Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(707)

Unified Diff: third_party/WebKit/LayoutTests/shadow-dom/slot-with-tabindex.html

Issue 1848753002: Consider slots' tabindex in focus navigation (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Refactor Created 4 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/LayoutTests/shadow-dom/slot-with-tabindex.html
diff --git a/third_party/WebKit/LayoutTests/shadow-dom/slot-with-tabindex.html b/third_party/WebKit/LayoutTests/shadow-dom/slot-with-tabindex.html
new file mode 100644
index 0000000000000000000000000000000000000000..483a54c60cbf9deef67294d05b0e515f072ca6db
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/shadow-dom/slot-with-tabindex.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<script src='../resources/testharness.js'></script>
+<script src='../resources/testharnessreport.js'></script>
+<script src='../fast/dom/shadow/resources/shadow-dom.js'></script>
+<script src='resources/shadow-dom.js'></script>
+<div id="log"></div>
+<p>
+ document tree: [i0 -> [x-foo]]<br>
+ x-foo's shadow tree: [j1 -> [s1] -> [s2] -> j2 ->[x-bar]]<br>
+ x-bar's shadow tree: [[s3] -> k1]<br>
+ slot #s1: [i1 -> i2]<br>
+ slot #s2: [i3]<br>
+ slot #s3: [l1 -> l2]<br><br>
+ <b>v1 ideal nav forward: [i0 -> j1 -> i1 -> i2 -> i3 -> j2 -> x-bar -> l1 -> l2 -> k1]</b><br>
+</p>
+
+<input id="i0" tabindex=0 value="i0">
+<div id="x-foo">
+ <input id="i2" slot="s1" tabindex=2 value="i2">
+ <input id="i1" slot="s1" tabindex=1 value="i1">
+ <input id="i3" slot="s2" tabindex=3 value="i3">
+ <template data-mode="open">
+ <div id="x-bar" tabindex=5>
+ <input id="l2" slot="s3" tabindex=2 value="l2">
+ <input id="l1" slot="s3" tabindex=1 value="l1">
+ <template data-mode="open">
+ <slot id="s3" name="s3" tabindex=1></slot>
+ <input id="k1" tabindex=2 value="k1">
+ </template>
+ </div>
+ <input id="j1" tabindex=1 value="j1">
+ <slot id="s2" name="s2" tabindex=3></slot>
+ <slot id="s1" name="s1" tabindex=2></slot>
+ <input id="j2" tabindex=4 value="j2">
+ </template>
+</div>
+
+<script>
+
+test(function() {
+ var xfoo = document.getElementById('x-foo');
+ convertTemplatesToShadowRootsWithin(xfoo);
+
+ var elements = [
+ 'i0',
+ 'x-foo/j1',
+ 'i1',
+ 'i2',
+ 'i3',
+ 'x-foo/j2',
+ 'x-foo/x-bar',
+ 'x-foo/l1',
+ 'x-foo/l2',
+ 'x-foo/x-bar/k1',
+ ];
+
+ for (var i = 0; i + 1 < elements.length; ++i)
+ assert_true(shouldNavigateFocus(elements[i], elements[i + 1], 'forward'), elements[i] + ' to ' + elements[i + 1]);
+ elements.reverse();
+ for (var i = 0; i + 1 < elements.length; ++i)
+ assert_true(shouldNavigateFocus(elements[i], elements[i + 1], 'backward'), elements[i] + ' to ' + elements[i + 1]);
+}, 'Slots tabindex should be considred in focus navigation.');
+
+</script>

Powered by Google App Engine
This is Rietveld 408576698