Title: [200520] trunk
- Revision
- 200520
- Author
- [email protected]
- Date
- 2016-05-06 14:01:32 -0700 (Fri, 06 May 2016)
Log Message
FKA: No way to get focus from DOM to shadow DOM components (Was: HTML5 media controls not keyboard accessible)
https://bugs.webkit.org/show_bug.cgi?id=117857
Reviewed by Jer Noble.
Source/WebCore:
The bug was caused by hasCustomFocusLogic returning true on media elements.
Fix the bug by removing this function so that FocusController will walk into the shadow tree of media elements
to look for focusable elements. This will allow AT such as Voice Over to iterate through controls.
We don't seem to draw focus rings inside the media elements but that could be tweaked in a separate patch.
Test: media/tab-focus-inside-media-elements.html
* html/HTMLMediaElement.cpp:
(WebCore::HTMLMediaElement::hasCustomFocusLogic): Deleted.
* html/HTMLMediaElement.h:
LayoutTests:
Added a regression test for moving focus into media elements by pressing tab key.
* media/tab-focus-inside-media-elements-expected.txt: Added.
* media/tab-focus-inside-media-elements.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (200519 => 200520)
--- trunk/LayoutTests/ChangeLog 2016-05-06 20:38:55 UTC (rev 200519)
+++ trunk/LayoutTests/ChangeLog 2016-05-06 21:01:32 UTC (rev 200520)
@@ -1,3 +1,15 @@
+2016-05-06 Ryosuke Niwa <[email protected]>
+
+ FKA: No way to get focus from DOM to shadow DOM components (Was: HTML5 media controls not keyboard accessible)
+ https://bugs.webkit.org/show_bug.cgi?id=117857
+
+ Reviewed by Jer Noble.
+
+ Added a regression test for moving focus into media elements by pressing tab key.
+
+ * media/tab-focus-inside-media-elements-expected.txt: Added.
+ * media/tab-focus-inside-media-elements.html: Added.
+
2016-05-06 Filip Pizlo <[email protected]>
JS Function removed after parsing
Added: trunk/LayoutTests/media/tab-focus-inside-media-elements-expected.txt (0 => 200520)
--- trunk/LayoutTests/media/tab-focus-inside-media-elements-expected.txt (rev 0)
+++ trunk/LayoutTests/media/tab-focus-inside-media-elements-expected.txt 2016-05-06 21:01:32 UTC (rev 200520)
@@ -0,0 +1,39 @@
+
+
+Tests for moving the focus onto controls inside an audio element and a video element.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS document.body.focus(); eventSender.keyDown("\t"); document.activeElement is mediaElements[0]
+PASS mediaElements[0] instanceof HTMLAudioElement is true
+PASS mediaElements[0].controls is true
+PASS eventSender.keyDown("\t"); document.activeElement is mediaElements[0]
+PASS !!internals.shadowRoot(mediaElements[0]).activeElement /* play button */ is true
+PASS eventSender.keyDown("\t"); document.activeElement is mediaElements[0]
+PASS !!internals.shadowRoot(mediaElements[0]).activeElement /* rewind button */ is true
+PASS eventSender.keyDown("\t"); document.activeElement is mediaElements[0]
+PASS !!internals.shadowRoot(mediaElements[0]).activeElement /* volume slider */ is true
+PASS eventSender.keyDown("\t"); document.activeElement is mediaElements[0]
+PASS !!internals.shadowRoot(mediaElements[0]).activeElement /* mute button */ is true
+PASS eventSender.keyDown("\t"); document.activeElement is mediaElements[1]
+PASS mediaElements[1] instanceof HTMLVideoElement is true
+PASS mediaElements[1].controls is true
+FAIL !!internals.shadowRoot(mediaElements[1]).activeElement /* play button */ should be true. Was false.
+PASS eventSender.keyDown("\t"); document.activeElement is mediaElements[1]
+PASS !!internals.shadowRoot(mediaElements[1]).activeElement /* rewind button */ is true
+PASS eventSender.keyDown("\t"); document.activeElement is mediaElements[1]
+PASS !!internals.shadowRoot(mediaElements[1]).activeElement /* volume slider */ is true
+PASS eventSender.keyDown("\t"); document.activeElement is mediaElements[1]
+PASS !!internals.shadowRoot(mediaElements[1]).activeElement /* mute button */ is true
+FAIL eventSender.keyDown("\t"); document.activeElement should be [object HTMLAudioElement]. Was [object HTMLVideoElement].
+PASS mediaElements[2] instanceof HTMLAudioElement is true
+PASS mediaElements[2].controls is false
+PASS eventSender.keyDown("\t"); document.activeElement is mediaElements[3]
+PASS mediaElements[3] instanceof HTMLVideoElement is true
+PASS mediaElements[3].controls is false
+PASS eventSender.keyDown("\t"); document.activeElement is document.querySelector("div")
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
Added: trunk/LayoutTests/media/tab-focus-inside-media-elements.html (0 => 200520)
--- trunk/LayoutTests/media/tab-focus-inside-media-elements.html (rev 0)
+++ trunk/LayoutTests/media/tab-focus-inside-media-elements.html 2016-05-06 21:01:32 UTC (rev 200520)
@@ -0,0 +1,61 @@
+<!DOCTYPE html!>
+<html>
+<body>
+<audio controls></audio><video controls></video><br>
+<audio tabindex="0"></audio><video tabindex="0"></video>
+<div tabindex="0"></div>
+<div id="console"></div>
+<script src=""
+<script>
+
+description('Tests for moving the focus onto controls inside an audio element and a video element.');
+
+var mediaElements = document.querySelectorAll("audio,video");
+
+if (window.testRunner)
+ runTests();
+else
+ log('This test requires eventSender');
+
+function runTests()
+{
+ testRunner.overridePreference("WebKitTabToLinksPreferenceKey", 1);
+
+ shouldBe('document.body.focus(); eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[0]');
+ shouldBeTrue('mediaElements[0] instanceof HTMLAudioElement');
+ shouldBeTrue('mediaElements[0].controls');
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[0]');
+ shouldBeTrue('!!internals.shadowRoot(mediaElements[0]).activeElement /* play button */');
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[0]');
+ shouldBeTrue('!!internals.shadowRoot(mediaElements[0]).activeElement /* rewind button */');
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[0]');
+ shouldBeTrue('!!internals.shadowRoot(mediaElements[0]).activeElement /* volume slider */');
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[0]');
+ shouldBeTrue('!!internals.shadowRoot(mediaElements[0]).activeElement /* mute button */');
+
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[1]');
+ shouldBeTrue('mediaElements[1] instanceof HTMLVideoElement');
+ shouldBeTrue('mediaElements[1].controls');
+ shouldBeTrue('!!internals.shadowRoot(mediaElements[1]).activeElement /* play button */');
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[1]');
+ shouldBeTrue('!!internals.shadowRoot(mediaElements[1]).activeElement /* rewind button */');
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[1]');
+ shouldBeTrue('!!internals.shadowRoot(mediaElements[1]).activeElement /* volume slider */');
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[1]');
+ shouldBeTrue('!!internals.shadowRoot(mediaElements[1]).activeElement /* mute button */');
+
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[2]');
+ shouldBeTrue('mediaElements[2] instanceof HTMLAudioElement');
+ shouldBeFalse('mediaElements[2].controls');
+
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'mediaElements[3]');
+ shouldBeTrue('mediaElements[3] instanceof HTMLVideoElement');
+ shouldBeFalse('mediaElements[3].controls');
+
+ shouldBe('eventSender.keyDown("\\t"); document.activeElement', 'document.querySelector("div")');
+}
+
+</script>
+<script src=""
+</body>
+</html>
Modified: trunk/Source/WebCore/ChangeLog (200519 => 200520)
--- trunk/Source/WebCore/ChangeLog 2016-05-06 20:38:55 UTC (rev 200519)
+++ trunk/Source/WebCore/ChangeLog 2016-05-06 21:01:32 UTC (rev 200520)
@@ -1,3 +1,23 @@
+2016-05-06 Ryosuke Niwa <[email protected]>
+
+ FKA: No way to get focus from DOM to shadow DOM components (Was: HTML5 media controls not keyboard accessible)
+ https://bugs.webkit.org/show_bug.cgi?id=117857
+
+ Reviewed by Jer Noble.
+
+ The bug was caused by hasCustomFocusLogic returning true on media elements.
+
+ Fix the bug by removing this function so that FocusController will walk into the shadow tree of media elements
+ to look for focusable elements. This will allow AT such as Voice Over to iterate through controls.
+
+ We don't seem to draw focus rings inside the media elements but that could be tweaked in a separate patch.
+
+ Test: media/tab-focus-inside-media-elements.html
+
+ * html/HTMLMediaElement.cpp:
+ (WebCore::HTMLMediaElement::hasCustomFocusLogic): Deleted.
+ * html/HTMLMediaElement.h:
+
2016-05-06 Anders Carlsson <[email protected]>
Tidy up the LinkRelAttribute code
Modified: trunk/Source/WebCore/html/HTMLMediaElement.cpp (200519 => 200520)
--- trunk/Source/WebCore/html/HTMLMediaElement.cpp 2016-05-06 20:38:55 UTC (rev 200519)
+++ trunk/Source/WebCore/html/HTMLMediaElement.cpp 2016-05-06 21:01:32 UTC (rev 200520)
@@ -659,11 +659,6 @@
}
#endif
-bool HTMLMediaElement::hasCustomFocusLogic() const
-{
- return true;
-}
-
bool HTMLMediaElement::supportsFocus() const
{
if (document().isMediaDocument())
Modified: trunk/Source/WebCore/html/HTMLMediaElement.h (200519 => 200520)
--- trunk/Source/WebCore/html/HTMLMediaElement.h 2016-05-06 20:38:55 UTC (rev 200519)
+++ trunk/Source/WebCore/html/HTMLMediaElement.h 2016-05-06 21:01:32 UTC (rev 200520)
@@ -496,7 +496,6 @@
// FIXME: Shadow DOM spec says we should be able to create shadow root on audio and video elements
bool canHaveUserAgentShadowRoot() const final { return true; }
- bool hasCustomFocusLogic() const override;
bool supportsFocus() const override;
bool isMouseFocusable() const override;
bool rendererIsNeeded(const RenderStyle&) override;
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes
