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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/dom/shadow/focus-navigation-with-delegatesFocus.html

Issue 1174893002: Implement ShadowRoot.delegatesFocus 1/4 (focus navigation) (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: fix for nit review comment Created 5 years, 6 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 | Annotate | Revision Log
« no previous file with comments | « no previous file | LayoutTests/fast/dom/shadow/focus-navigation-with-delegatesFocus-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <script src="../../../resources/js-test.js"></script>
5 <script src="resources/shadow-dom.js"></script>
6 </head>
7 <body>
8 <p>This tests TAB focus navigation with delegatesFocus flag on shadow hosts</p>
9 <pre id="console"></pre>
10 <div id="sandbox"></div>
11 <script>
12 function prepareDOMTree(parent, tabindex, delegatesFocus) {
13 parent.innerHTML = '';
14 parent.appendChild(
15 createDOM('div', {'id': 'testform'},
16 createDOM('input', {'id': 'input-before'}),
17 createDOM('div', {'id': 'host-div'},
18 createShadowRoot(
19 {'delegatesFocus': delegatesFocus},
20 createDOM('input', {'id': 'inner-input'}))),
21 createDOM('input', {'id': 'input-after'})));
22
23 if (tabindex !== null)
24 parent.querySelector('#host-div').tabIndex = tabindex;
25
26 parent.offsetTop;
27 }
28
29 var hostDiv;
30
31 function test() {
32 debug('Testing shadow host with possible combinations of tabindex and delega tesFocus');
33
34 var sandbox = document.getElementById('sandbox');
35
36 debug('(1/8) Testing tab navigation order without tabindex and delegatesFocu s=false');
37 prepareDOMTree(sandbox, null, false);
38 hostDiv = document.getElementById('host-div');
39 shouldBe('hostDiv.shadowRoot.delegatesFocus', 'false');
40 shouldBe('hostDiv.tabIndex', '-1');
41
42 expectedOrder = [
43 'input-before',
44 'host-div/inner-input',
45 'input-after'
46 ];
47
48 testFocusNavigationForward(expectedOrder);
49 expectedOrder.reverse();
50 testFocusNavigationBackward(expectedOrder);
51
52 debug('(2/8) Testing tab navigation order without tabindex and delegatesFocu s=true');
53 prepareDOMTree(sandbox, null, true);
54 hostDiv = document.getElementById('host-div');
55 shouldBe('hostDiv.shadowRoot.delegatesFocus', 'true');
56 shouldBe('hostDiv.tabIndex', '0');
57
58 var expectedOrder = [
59 'input-before',
60 'host-div/inner-input',
61 'input-after'
62 ];
63
64 testFocusNavigationForward(expectedOrder);
65 expectedOrder.reverse();
66 testFocusNavigationBackward(expectedOrder);
67
68 debug('(3/8) Testing tab navigation order with tabindex=0 and delegatesFocus =false');
69 prepareDOMTree(sandbox, 0, false);
70 hostDiv = document.getElementById('host-div');
71 shouldBe('hostDiv.shadowRoot.delegatesFocus', 'false');
72 shouldBeEqualToString('hostDiv.getAttribute("tabindex")', '0');
73
74 expectedOrder = [
75 'input-before',
76 'host-div',
77 'host-div/inner-input',
78 'input-after'
79 ];
80
81 testFocusNavigationForward(expectedOrder);
82 expectedOrder.reverse();
83 testFocusNavigationBackward(expectedOrder);
84
85 debug('(4/8)Testing tab navigation order with tabindex=0 and delegatesFocus= true');
86 prepareDOMTree(sandbox, 0, true);
87 hostDiv = document.getElementById('host-div');
88 shouldBe('hostDiv.shadowRoot.delegatesFocus', 'true');
89 shouldBeEqualToString('hostDiv.getAttribute("tabindex")', '0');
90
91 expectedOrder = [
92 'input-before',
93 // 'host-div', // should skip host when delegatesFocus=true
94 'host-div/inner-input',
95 'input-after'
96 ];
97
98 testFocusNavigationForward(expectedOrder);
99 expectedOrder.reverse();
100 testFocusNavigationBackward(expectedOrder);
101
102 debug('(5/8) Testing tab navigation order with tabindex=-1 and delegatesFocu s=false');
103 prepareDOMTree(sandbox, -1, false);
104 hostDiv = document.getElementById('host-div');
105 shouldBe('hostDiv.shadowRoot.delegatesFocus', 'false');
106 shouldBeEqualToString('hostDiv.getAttribute("tabindex")', '-1');
107
108 expectedOrder = [
109 'input-before',
110 'host-div/inner-input',
111 'input-after'
112 ];
113
114 testFocusNavigationForward(expectedOrder);
115 expectedOrder.reverse();
116 testFocusNavigationBackward(expectedOrder);
117
118 debug('(6/8) Testing tab navigation order with tabindex=-1 and delegatesFocu s=true');
119 prepareDOMTree(sandbox, -1, true);
120 hostDiv = document.getElementById('host-div');
121 shouldBe('hostDiv.shadowRoot.delegatesFocus', 'true');
122 shouldBeEqualToString('hostDiv.getAttribute("tabindex")', '-1');
123
124 expectedOrder = [
125 'input-before',
126 'host-div/inner-input',
127 'input-after'
128 ];
129
130 testFocusNavigationForward(expectedOrder);
131 expectedOrder.reverse();
132 testFocusNavigationBackward(expectedOrder);
133
134 debug('(7/8) Testing tab navigation order with tabindex=1 and delegatesFocus =false');
135 prepareDOMTree(sandbox, 1, false);
136 hostDiv = document.getElementById('host-div');
137 shouldBe('hostDiv.shadowRoot.delegatesFocus', 'false');
138 shouldBeEqualToString('hostDiv.getAttribute("tabindex")', '1');
139
140 expectedOrder = [
141 'input-before',
142 'input-after',
143 'host-div',
144 'host-div/inner-input'
145 ];
146
147 testFocusNavigationForward(expectedOrder);
148 expectedOrder.reverse();
149 testFocusNavigationBackward(expectedOrder);
150
151 debug('(8/8) Testing tab navigation order with tabindex=1 and delegatesFocus =true');
152 prepareDOMTree(sandbox, 1, true);
153 hostDiv = document.getElementById('host-div');
154 shouldBe('hostDiv.shadowRoot.delegatesFocus', 'true');
155 shouldBeEqualToString('hostDiv.getAttribute("tabindex")', '1');
156
157 expectedOrder = [
158 'input-before',
159 'input-after',
160 // 'host-div', // should skip host when delegatesFocus=true
161 'host-div/inner-input'
162 ];
163
164 testFocusNavigationForward(expectedOrder);
165 expectedOrder.reverse();
166 testFocusNavigationBackward(expectedOrder);
167 }
168
169 function run_tests() {
170 if (!window.eventSender) {
171 testFailed('');
172 return;
173 }
174
175 test();
176
177 debug('Test finished.');
178 }
179
180 run_tests();
181 </script>
182 </body>
183 </html>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/dom/shadow/focus-navigation-with-delegatesFocus-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698