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

Side by Side Diff: third_party/WebKit/LayoutTests/shadow-dom/slot-assigned-slot.html

Issue 1878543002: Add a regression test for focus behavior with slots that are assigned to a slot (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Update test description Created 4 years, 8 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 unified diff | Download patch
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <script src='../resources/testharness.js'></script> 2 <script src='../resources/testharness.js'></script>
3 <script src='../resources/testharnessreport.js'></script> 3 <script src='../resources/testharnessreport.js'></script>
4 <script src='../fast/dom/shadow/resources/shadow-dom.js'></script> 4 <script src='../fast/dom/shadow/resources/shadow-dom.js'></script>
5 <script src='resources/shadow-dom.js'></script> 5 <script src='resources/shadow-dom.js'></script>
6 <div id="log"></div> 6 <div id="log"></div>
7 <p> 7 <p>
8 document tree: [i0 -> [x-foo]]<br> 8 document tree: [i0 -> [x-foo]]<br>
9 x-foo's shadow tree: [j1 -> [s1] -> [s2] -> j2 ->[x-bar]]<br> 9 x-foo's shadow tree: [j1 -> [s1] -> [s2] -> j2 ->[x-bar]]<br>
10 x-bar's shadow tree: [[s3] -> k1]<br> 10 x-bar's shadow tree: [k1 -> [s3]]<br>
11 slot #s1: [i1 -> i2]<br> 11 slot #s1: [i1 -> i2]<br>
12 slot #s2: [i3]<br> 12 slot #s2: [i3]<br>
13 slot #s3: [l1 -> l2]<br><br> 13 slot #s3: [[s4]]<br>
14 <b>v1 ideal nav forward: [i0 -> j1 -> i1 -> i2 -> i3 -> j2 -> x-bar -> l1 -> l2 -> k1]</b><br> 14 slot #s4: [i4 -> i5]<br><br>
15 <b>v1 ideal nav forward: [i0 -> j1 -> i1 -> i2 -> i3 -> j2 -> x-bar -> k1 -> i4 -> i5]</b><br>
15 </p> 16 </p>
16 17
17 <input id="i0" tabindex=0 value="i0"> 18 <input id="i0" tabindex=0 value="i0">
18 <div id="x-foo"> 19 <div id="x-foo">
19 <input id="i2" slot="s1" tabindex=2 value="i2"> 20 <input id="i2" slot="s1" tabindex=2 value="i2">
20 <input id="i1" slot="s1" tabindex=1 value="i1"> 21 <input id="i1" slot="s1" tabindex=1 value="i1">
21 <input id="i3" slot="s2" tabindex=3 value="i3"> 22 <input id="i3" slot="s2" tabindex=3 value="i3">
23 <input id="i4" slot="s4" tabindex=4 value="i4">
24 <input id="i5" slot="s4" tabindex=5 value="i5">
22 <template data-mode="open"> 25 <template data-mode="open">
23 <div id="x-bar" tabindex=5> 26 <div id="x-bar" tabindex=5>
24 <input id="l2" slot="s3" tabindex=2 value="l2"> 27 <slot id="s4" name="s4" slot="s3"></slot>
25 <input id="l1" slot="s3" tabindex=1 value="l1">
26 <template data-mode="open"> 28 <template data-mode="open">
27 <slot id="s3" name="s3" tabindex=1></slot> 29 <slot id="s3" name="s3" tabindex=2></slot>
28 <input id="k1" tabindex=2 value="k1"> 30 <input id="k1" tabindex=1 value="k1">
29 </template> 31 </template>
30 </div> 32 </div>
31 <input id="j1" tabindex=1 value="j1"> 33 <input id="j1" tabindex=1 value="j1">
32 <slot id="s2" name="s2" tabindex=3></slot> 34 <slot id="s2" name="s2" tabindex=3></slot>
33 <slot id="s1" name="s1" tabindex=2></slot> 35 <slot id="s1" name="s1" tabindex=2></slot>
34 <input id="j2" tabindex=4 value="j2"> 36 <input id="j2" tabindex=4 value="j2">
35 </template> 37 </template>
36 </div> 38 </div>
37 39
38 <script> 40 <script>
39 41
40 test(function() { 42 test(function() {
41 var xfoo = document.getElementById('x-foo'); 43 var xfoo = document.getElementById('x-foo');
42 convertTemplatesToShadowRootsWithin(xfoo); 44 convertTemplatesToShadowRootsWithin(xfoo);
43 45
44 var elements = [ 46 var elements = [
45 'i0', 47 'i0',
46 'x-foo/j1', 48 'x-foo/j1',
47 'i1', 49 'i1',
48 'i2', 50 'i2',
49 'i3', 51 'i3',
50 'x-foo/j2', 52 'x-foo/j2',
51 'x-foo/x-bar', 53 'x-foo/x-bar',
52 'x-foo/l1',
53 'x-foo/l2',
54 'x-foo/x-bar/k1', 54 'x-foo/x-bar/k1',
55 'i4',
56 'i5'
55 ]; 57 ];
56 58
57 for (var i = 0; i + 1 < elements.length; ++i) 59 for (var i = 0; i + 1 < elements.length; ++i)
58 assert_true(shouldNavigateFocus(elements[i], elements[i + 1], 'forward'), elements[i] + ' to ' + elements[i + 1]); 60 assert_true(shouldNavigateFocus(elements[i], elements[i + 1], 'forward'), elements[i] + ' to ' + elements[i + 1]);
59 elements.reverse(); 61 elements.reverse();
60 for (var i = 0; i + 1 < elements.length; ++i) 62 for (var i = 0; i + 1 < elements.length; ++i)
61 assert_true(shouldNavigateFocus(elements[i], elements[i + 1], 'backward'), elements[i] + ' to ' + elements[i + 1]); 63 assert_true(shouldNavigateFocus(elements[i], elements[i + 1], 'backward'), elements[i] + ' to ' + elements[i + 1]);
62 }, 'Slots tabindex should be considred in focus navigation.'); 64 }, 'Focus should cover assigned elements of an assigned slot, as well as element s that are directly assigned to a slot.');
63 65
64 </script> 66 </script>
OLDNEW
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698