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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/alignment/parse-alignment-of-root-elements.html

Issue 2266353004: Make Document::styleForElementIgnoringPendingStyleSheets() be aware of a flat tree structure (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: update the tests Created 4 years, 3 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 | third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-redistribution.html » ('j') | 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="resources/alignment-parsing-utils-th.js"></script> 4 <script src="resources/alignment-parsing-utils-th.js"></script>
5 <html> 5 <html>
6 <body> 6 <body>
7 <p>Test to verify auto value resolution works as expected in root elements (eg. document root / shadow roots / slotted elements / elements inside<slot>)</p > 7 <p>Test to verify auto value resolution works as expected in root elements (eg. document root / shadow roots / slotted elements / elements inside slot)</p>
8 <div id="log"></div> 8 <div id="log"></div>
9 9
10 <div id="host"> 10 <div id="host">
11 <div id="slotted" slot="s1"></div> 11 <div id="slotted" slot="s1"></div>
12 </div> 12 </div>
13 <script> 13 <script>
14 14
15 var block = document.getElementById("host"); 15 var block = document.getElementById("host");
16 16
17 console.log(""); 17 console.log("");
(...skipping 136 matching lines...) Expand 10 before | Expand all | Expand 10 after
154 test(function() { 154 test(function() {
155 shadowHost.style.alignItems = "center"; 155 shadowHost.style.alignItems = "center";
156 shadowNode.style.alignItems = "right"; 156 shadowNode.style.alignItems = "right";
157 slotted.style.alignItems = "left"; 157 slotted.style.alignItems = "left";
158 checkValues(slotted, "alignItems", "align-items", "left", "left"); 158 checkValues(slotted, "alignItems", "align-items", "left", "left");
159 slotted.style.alignItems = ""; 159 slotted.style.alignItems = "";
160 checkValues(slotted, "alignItems", "align-items", "", "normal"); 160 checkValues(slotted, "alignItems", "align-items", "", "normal");
161 slotted.style.alignSelf = "start"; 161 slotted.style.alignSelf = "start";
162 checkValues(slotted, "alignSelf", "align-self", "start", "start"); 162 checkValues(slotted, "alignSelf", "align-self", "start", "start");
163 slotted.style.alignSelf = "auto"; 163 slotted.style.alignSelf = "auto";
164 checkValues(slotted, "alignSelf", "align-self", "auto", "center"); 164 checkValues(slotted, "alignSelf", "align-self", "auto", "normal");
165 }, "Check out how align-self uses the 'shadowHost' as 'slotted' element's parent while 'slot' is not assigned."); 165 }, "Check out how align-self uses the 'shadowHost' as 'slotted' element's parent while 'slot' is not assigned.");
166 166
167 test(function() { 167 test(function() {
168 shadowHost.style.justifyItems = "center"; 168 shadowHost.style.justifyItems = "center";
169 shadowNode.style.justifyItems = "right"; 169 shadowNode.style.justifyItems = "right";
170 slotted.style.justifyItems = "left"; 170 slotted.style.justifyItems = "left";
171 checkValues(slotted, "justifyItems", "justify-items", "left", "left"); 171 checkValues(slotted, "justifyItems", "justify-items", "left", "left");
172 slotted.style.justifyItems = ""; 172 slotted.style.justifyItems = "";
173 checkValues(slotted, "justifyItems", "justify-items", "", "normal"); 173 checkValues(slotted, "justifyItems", "justify-items", "", "normal");
174 slotted.style.justifySelf = "start"; 174 slotted.style.justifySelf = "start";
175 checkValues(slotted, "justifySelf", "justify-self", "start", "start"); 175 checkValues(slotted, "justifySelf", "justify-self", "start", "start");
176 slotted.style.justifySelf = "auto"; 176 slotted.style.justifySelf = "auto";
177 checkValues(slotted, "justifySelf", "justify-self", "auto", "center"); 177 checkValues(slotted, "justifySelf", "justify-self", "auto", "normal");
178 }, "Check out how justify-self uses the 'shadowHost' as 'slotted' element's pare nt while 'slot' is not assigned."); 178 }, "Check out how justify-self uses the 'shadowHost' as 'slotted' element's pare nt while 'slot' is not assigned.");
179 179
180 test(function() { 180 test(function() {
181 shadowHost.style.justifyItems = "auto"; 181 shadowHost.style.justifyItems = "auto";
182 shadowNode.style.justifyItems = "right"; 182 shadowNode.style.justifyItems = "right";
183 checkValues(shadowHost, "justifyItems", "justify-items", "auto", "normal"); 183 checkValues(shadowHost, "justifyItems", "justify-items", "auto", "normal");
184 checkValues(shadowNode, "justifyItems", "justify-items", "right", "right"); 184 checkValues(shadowNode, "justifyItems", "justify-items", "right", "right");
185 document.documentElement.style.justifyItems = "legacy center"; 185 document.documentElement.style.justifyItems = "legacy center";
186 checkValues(document.documentElement, "justifyItems", "justify-items", "leg acy center", "legacy center"); 186 checkValues(document.documentElement, "justifyItems", "justify-items", "leg acy center", "legacy center");
187 checkValues(shadowHost, "justifyItems", "justify-items", "auto", "legacy ce nter"); 187 checkValues(shadowHost, "justifyItems", "justify-items", "auto", "legacy ce nter");
188 slotted.style.justifyItems = "auto"; 188 slotted.style.justifyItems = "auto";
189 checkValues(slotted, "justifyItems", "justify-items", "auto", "legacy cente r"); 189 checkValues(slotted, "justifyItems", "justify-items", "auto", "normal");
190 slotted.style.justifySelf = "auto"; 190 slotted.style.justifySelf = "auto";
191 checkValues(slotted, "justifySelf", "justify-self", "auto", "center"); 191 checkValues(slotted, "justifySelf", "justify-self", "auto", "normal");
192 shadowNode.style.justifyItems = "auto"; 192 shadowNode.style.justifyItems = "auto";
193 checkValues(shadowNode, "justifyItems", "justify-items", "auto", "legacy cen ter"); 193 checkValues(shadowNode, "justifyItems", "justify-items", "auto", "legacy cen ter");
194 checkValues(slotted, "justifyItems", "justify-items", "auto", "legacy center "); 194 checkValues(slotted, "justifyItems", "justify-items", "auto", "normal");
195 checkValues(slotted, "justifySelf", "justify-self", "auto", "center"); 195 checkValues(slotted, "justifySelf", "justify-self", "auto", "normal");
196 document.documentElement.style.justifyItems = "auto"; 196 document.documentElement.style.justifyItems = "auto";
197 }, "Check out how the 'legacy' keyword in justify-items affects the 'slotted' el ements while 'slot' is not assigned."); 197 }, "Check out how the 'legacy' keyword in justify-items affects the 'slotted' el ements while 'slot' is not assigned.");
198 198
199 // Slot element is assigned now. 199 // Slot element is assigned now.
200 var slot = document.createElement('slot'); 200 var slot = document.createElement('slot');
201 slot.setAttribute('name', 's1'); 201 slot.setAttribute('name', 's1');
202 shadowNode.appendChild(slot); 202 shadowNode.appendChild(slot);
203 203
204 test(function() { 204 test(function() {
205 shadowHost.style.alignItems = "center"; 205 shadowHost.style.alignItems = "center";
206 shadowNode.style.alignItems = "right"; 206 shadowNode.style.alignItems = "right";
207 slotted.style.alignItems = "left"; 207 slotted.style.alignItems = "left";
208 checkValues(slotted, "alignItems", "align-items", "left", "left"); 208 checkValues(slotted, "alignItems", "align-items", "left", "left");
209 slotted.style.alignItems = ""; 209 slotted.style.alignItems = "";
210 checkValues(slotted, "alignItems", "align-items", "", "normal"); 210 checkValues(slotted, "alignItems", "align-items", "", "normal");
211 slotted.style.alignSelf = "start"; 211 slotted.style.alignSelf = "start";
212 checkValues(slotted, "alignSelf", "align-self", "start", "start"); 212 checkValues(slotted, "alignSelf", "align-self", "start", "start");
213 slotted.style.alignSelf = "auto"; 213 slotted.style.alignSelf = "auto";
214 checkValues(slotted, "alignSelf", "align-self", "auto", "right"); 214 checkValues(slotted, "alignSelf", "align-self", "auto", "right");
215 }, "Check out how align-self uses the 'slot' element's parent (Shadow Node) as ' slotted' element' s parent after the 'slot' is assigned."); 215 }, "Check out how align-self uses the 'slot' element's parent (Shadow Node) as ' slotted' element' s parent after the 'slot' is assigned.");
hayato 2016/08/24 10:57:20 I think the test already assumes that *parent* mea
216 216
217 test(function() { 217 test(function() {
218 shadowHost.style.justifyItems = "center"; 218 shadowHost.style.justifyItems = "center";
219 shadowNode.style.justifyItems = "right"; 219 shadowNode.style.justifyItems = "right";
220 slotted.style.justifyItems = "left"; 220 slotted.style.justifyItems = "left";
221 checkValues(slotted, "justifyItems", "justify-items", "left", "left"); 221 checkValues(slotted, "justifyItems", "justify-items", "left", "left");
222 slotted.style.justifyItems = ""; 222 slotted.style.justifyItems = "";
223 checkValues(slotted, "justifyItems", "justify-items", "", "normal"); 223 checkValues(slotted, "justifyItems", "justify-items", "", "normal");
224 slotted.style.justifySelf = "start"; 224 slotted.style.justifySelf = "start";
225 checkValues(slotted, "justifySelf", "justify-self", "start", "start"); 225 checkValues(slotted, "justifySelf", "justify-self", "start", "start");
(...skipping 23 matching lines...) Expand all
249 test(function() { 249 test(function() {
250 shadowHost.style.alignItems = "center"; 250 shadowHost.style.alignItems = "center";
251 shadowNode.style.alignItems = "right"; 251 shadowNode.style.alignItems = "right";
252 slot.style.alignItems = "left"; 252 slot.style.alignItems = "left";
253 checkValues(slot, "alignItems", "align-items", "left", "left"); 253 checkValues(slot, "alignItems", "align-items", "left", "left");
254 slot.style.alignItems = ""; 254 slot.style.alignItems = "";
255 checkValues(slot, "alignItems", "align-items", "", "normal"); 255 checkValues(slot, "alignItems", "align-items", "", "normal");
256 slot.style.alignSelf = "left"; 256 slot.style.alignSelf = "left";
257 checkValues(slot, "alignSelf", "align-self", "left", "left"); 257 checkValues(slot, "alignSelf", "align-self", "left", "left");
258 slot.style.alignSelf = "auto"; 258 slot.style.alignSelf = "auto";
259 checkValues(slot, "alignSelf", "align-self", "auto", "right"); 259 checkValues(slot, "alignSelf", "align-self", "auto", "normal");
260 }, "The 'slot' element uses its parent inside the ShadowDOM tree to resolve the align-self 'auto' values ."); 260 }, "The 'slot' element should not use its parent inside the ShadowDOM tree to re solve the align-self 'auto' values because Blink does not support slots in the f lat tree.");
261 261
262 test(function() { 262 test(function() {
263 shadowHost.style.justifyItems = "center"; 263 shadowHost.style.justifyItems = "center";
264 shadowNode.style.justifyItems = "right"; 264 shadowNode.style.justifyItems = "right";
265 265
266 slot.style.justifyItems = "left"; 266 slot.style.justifyItems = "left";
267 checkValues(slot, "justifyItems", "justify-items", "left", "left"); 267 checkValues(slot, "justifyItems", "justify-items", "left", "left");
268 slot.style.justifyItems = "auto"; 268 slot.style.justifyItems = "auto";
269 checkValues(slot, "justifyItems", "justify-items", "auto", "normal"); 269 checkValues(slot, "justifyItems", "justify-items", "auto", "normal");
270 slot.style.justifySelf = "left"; 270 slot.style.justifySelf = "left";
271 checkValues(slot, "justifySelf", "justify-self", "left", "left"); 271 checkValues(slot, "justifySelf", "justify-self", "left", "left");
272 slot.style.justifySelf = "auto"; 272 slot.style.justifySelf = "auto";
273 checkValues(slot, "justifySelf", "justify-self", "auto", "right"); 273 checkValues(slot, "justifySelf", "justify-self", "auto", "normal");
274 }, "The 'slot' element uses its parent inside the ShadowDOM tree to resolve the justify-self 'auto' values ."); 274 }, "The 'slot' element should not use its parent inside the ShadowDOM tree to re solve the justify-self 'auto' values because Blink does not support slots in the flat tree.");
275 275
276 </script> 276 </script>
277 277
278 </body> 278 </body>
279 </html> 279 </html>
OLDNEW
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/fast/css/getComputedStyle/computed-style-redistribution.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698