Active style not visible on elements in iframe
Reported by
colindef...@gmail.com,
Apr 24 2017
|
||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36 Example URL: Steps to reproduce the problem: 1. Unzip the attached iframe-bug-test.zip file 2. Open index.html with chromium 3. Open dev tools with touch device emulation active - Or use a touch screen 4. Tap the button under "Parent", its style should change briefly and immediately (expected behavior) 5. Tap briefly the button under "Iframe", its style doesn't change (wrong behavior, it should react like the other button) 6. Tap and hold the button under "Iframe", its style changes after 300/350ms: the old 300ms tap delay behavior is still present in the iframe :( What is the expected behavior? As explained in https://developers.google.com/web/updates/2013/12/300ms-tap-delay-gone-away, adding to a web page the following code: <meta name="viewport" content="width=device-width"> or <style>html { touch-action: manipulation; }</style> should remove the old 300ms tap delay behavior of the browser when a touch event occurs. Unfortunately this doesn't seam to work inside an Iframe! What went wrong? In the iframe, the button style changes only after 300/350ms of touch press. But its style should briefly and immediately change since <meta name="viewport" content="width=device-width"> and <style>html { touch-action: manipulation; }</style> are present in the code. Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? N/A Does this work in other browsers? N/A Chrome version: 57.0.2987.133 Channel: stable OS Version: 6.1 (Windows 7, Windows Server 2008 R2) Flash Version:
,
Apr 25 2017
,
Apr 27 2017
Able to reproduce the issue on Windows 10 and Ubuntu 14.04 with chrome #58.0.3029.81 , #60.0.3081.0 and also in earlier version M45-45.0.2454.93. This is non-regression issue, hence marking it a untriaged Attaching a screen-shot for reference. Note: Builds less than M45 are crashing in my system.
,
Apr 27 2017
I've got other tap-delay detection bugs to fix so I'll take this one on as well.
,
Oct 20 2017
Load balancing this onto sahel@
,
Jan 11 2018
Chao, could you investigate why the tap delay is occuring in iframes? The relevant place to start is in RenderWidgetHostImpl::SubmitCompositorFrame, the bit about IsMobileOptimizedFrame. If that message comes from the renderer, the browser gesture detector will disable the 300ms delay. I would expect that to work for the whole page but since it's on RenderWidgetHost (each I frame has a RenderWidget I believe) perhaps we need to tell all the other widgets about the change.
,
Jan 29 2018
I upload the test on http://ht.chaopeng.me/iframe-delay/index.html I can not feel the 300ms delay not obvious like the video. I have tried devtools and Android.
,
Jan 29 2018
Yup, I can't repro anymore either. Closing as such.
,
Jan 30 2018
Hello, The tap delay is still obvious for me. You can see it in the attached video: - the style of the iframe button doesn't change when clicked - the link in the iframe doesn't change to red when clicked (I am clicking it twice at 10") Do you still think there is no a bug? Chrome version: 64.0.3282.119 Channel: stable OS Version: 6.1 (Windows 7, Windows Server 2008 R2)
,
Jan 30 2018
Yes, I found the style in devtools weird. The button edge disappear on Mac. Maybe we should open a new issue for that.
,
Jan 30 2018
Yes please, Originally this weird style behavior was the reason why I opened this issue.
,
Jan 30 2018
Ok, that's not the 300ms tap delay but it seems we're not reflecting the visual change in active pseudo-class (or maybe we're not applying the :active pseudo-class at all :/). Keeping this bug is fine, I've updated the title to better reflect the bug. Thanks for the clear repro video!
,
Jan 31 2018
Thanks for reopening, But I still think this behavior is linked to the 300ms tab delay: If you make a long touch (> 300ms?) to an interactive element of the iframe then you can see :active pseudo-class styles applied.
,
Jan 31 2018
Yeah, I noticed that too. It's possible it's related but it might also just be coincidence. The 300ms delay is applied in the browser process for an entire page so unless the iframe is out of process (it's not in this case) I wouldn't expect there to be a behavior difference here.
,
Jan 31 2018
I logged the Document::UpdateActiveState. We set the correct element immediately include SetActiveElement and element.SetActive. I have tried add layout after that but it does not work. It seems active vision effect is a delay animation. Click on the button, you can see effects are after mouse release. bokan@ do you know where we actually apply the effect?
,
Jan 31 2018
Nope. Are you sure it's an animation/timer task? I imagine we just need a repaint (rather than a layout) - maybe that's not getting scheduled? If you can find the object that paints an Anchor or Button Element you could probably print out some stack traces from the Paint method and see how we call into that after the mouse down happens in the main frame/working example.
,
Jan 31 2018
e.g. I expect an anchor tag would be painted by InlineTextBoxPainter::Paint
,
May 3 2018
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/1760ef3d17bbe5ee47db6e057e54822885cbafd3 commit 1760ef3d17bbe5ee47db6e057e54822885cbafd3 Author: chaopeng <chaopeng@chromium.org> Date: Thu May 03 14:15:49 2018 Store the last_show_press_timestamp_ in root frame EventHandler This issue is caused by: 1. When user tap on screen, we receive TapDown, ShowPress, Tap. TapDown and ShowPress will active the tapped element. Then Tap checks the LastShowPressTimeStamp() to stay active or cancel. 2. Each frame has GestureManager and we store LastShowPressTimeStamp() in GestureManager. 3. We check the root frame GestureManager LastShowPressTimeStamp() before hit test so we read the wrong LastShowPressTimeStamp(). In this patch, we move last_show_press_timestamp_ to root frame EventHandler so we don't need to hit test and figure which GestureManager should use. Bug: 714573 Change-Id: I80c75bf2f0493a6cbfd3b24873e1127da4fd7a27 Test: EventHandlerSimTest_TapActiveInFrame Test: Manual test for OOPIF Reviewed-on: https://chromium-review.googlesource.com/1041065 Reviewed-by: David Bokan <bokan@chromium.org> Commit-Queue: Jianpeng Chao <chaopeng@chromium.org> Cr-Commit-Position: refs/heads/master@{#555719} [modify] https://crrev.com/1760ef3d17bbe5ee47db6e057e54822885cbafd3/third_party/blink/renderer/core/input/event_handler.cc [modify] https://crrev.com/1760ef3d17bbe5ee47db6e057e54822885cbafd3/third_party/blink/renderer/core/input/event_handler.h [modify] https://crrev.com/1760ef3d17bbe5ee47db6e057e54822885cbafd3/third_party/blink/renderer/core/input/event_handler_test.cc [modify] https://crrev.com/1760ef3d17bbe5ee47db6e057e54822885cbafd3/third_party/blink/renderer/core/input/gesture_manager.cc [modify] https://crrev.com/1760ef3d17bbe5ee47db6e057e54822885cbafd3/third_party/blink/renderer/core/input/gesture_manager.h |
||||||||
►
Sign in to add a comment |
||||||||
Comment 1 by nyerramilli@chromium.org
, Apr 25 2017