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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/css-grid-layout/grid-item-removal-track-breadth-update.html

Issue 208133003: [CSS Grid Layout] Prevent issues with checkLayout() in grid items (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Created 6 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 unified diff | Download patch
« no previous file with comments | « LayoutTests/fast/css-grid-layout/grid-item-removal-auto-placement-update-expected.txt ('k') | LayoutTests/fast/css-grid-layout/grid-item-removal-track-breadth-update-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
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <link href="resources/grid.css" rel="stylesheet"> 3 <link href="resources/grid.css" rel="stylesheet">
4 <style> 4 <style>
5 .gridAutoContent { 5 .gridAutoContent {
6 grid-template-columns: auto; 6 grid-template-columns: auto;
7 grid-template-rows: auto; 7 grid-template-rows: auto;
8 } 8 }
9 9
10 .gridMinContentFixed { 10 .gridMinContentFixed {
(...skipping 25 matching lines...) Expand all
36 font: 10px/1 Ahem; 36 font: 10px/1 Ahem;
37 /* Make us fit our grid area. */ 37 /* Make us fit our grid area. */
38 width: 100%; 38 width: 100%;
39 height: 100%; 39 height: 100%;
40 } 40 }
41 </style> 41 </style>
42 <script src="../../resources/check-layout.js"></script> 42 <script src="../../resources/check-layout.js"></script>
43 <script> 43 <script>
44 function testRemoval(gridElementID, size1, size2, size3) 44 function testRemoval(gridElementID, size1, size2, size3)
45 { 45 {
46 var testOutput = document.getElementById("test-output");
46 var gridElement = document.getElementById(gridElementID); 47 var gridElement = document.getElementById(gridElementID);
47 var gridItem1 = gridElement.firstChild.nextSibling; 48 var gridItem1 = gridElement.firstChild.nextSibling;
48 var gridItem2 = gridItem1.nextSibling.nextSibling; 49 var gridItem2 = gridItem1.nextSibling.nextSibling;
49 var gridItem3 = gridItem2.nextSibling.nextSibling; 50 var gridItem3 = gridItem2.nextSibling.nextSibling;
50 gridItem1.setAttribute("data-expected-width", size1.width); 51 gridItem1.setAttribute("data-expected-width", size1.width);
51 gridItem1.setAttribute("data-expected-height", size1.height); 52 gridItem1.setAttribute("data-expected-height", size1.height);
52 gridItem2.setAttribute("data-expected-width", size1.width); 53 gridItem2.setAttribute("data-expected-width", size1.width);
53 gridItem2.setAttribute("data-expected-height", size1.height); 54 gridItem2.setAttribute("data-expected-height", size1.height);
54 gridItem3.setAttribute("data-expected-width", size1.width); 55 gridItem3.setAttribute("data-expected-width", size1.width);
55 gridItem3.setAttribute("data-expected-height", size1.height); 56 gridItem3.setAttribute("data-expected-height", size1.height);
56 checkLayout("#" + gridElementID); 57 checkLayout("#" + gridElementID, testOutput);
57 58
58 gridElement.removeChild(gridItem1); 59 gridElement.removeChild(gridItem1);
59 gridItem2.setAttribute("data-expected-width", size2.width); 60 gridItem2.setAttribute("data-expected-width", size2.width);
60 gridItem2.setAttribute("data-expected-height", size2.height); 61 gridItem2.setAttribute("data-expected-height", size2.height);
61 gridItem3.setAttribute("data-expected-width", size2.width); 62 gridItem3.setAttribute("data-expected-width", size2.width);
62 gridItem3.setAttribute("data-expected-height", size2.height); 63 gridItem3.setAttribute("data-expected-height", size2.height);
63 checkLayout("#" + gridElementID); 64 checkLayout("#" + gridElementID, testOutput);
64 65
65 gridElement.removeChild(gridItem2); 66 gridElement.removeChild(gridItem2);
66 gridItem3.setAttribute("data-expected-width", size3.width); 67 gridItem3.setAttribute("data-expected-width", size3.width);
67 gridItem3.setAttribute("data-expected-height", size3.height); 68 gridItem3.setAttribute("data-expected-height", size3.height);
68 checkLayout("#" + gridElementID); 69 checkLayout("#" + gridElementID, testOutput);
69 } 70 }
70 71
71 function testRemovals() 72 function testRemovals()
72 { 73 {
73 testRemoval("constrainedAutoGrid", { 'width': '50', 'height': '40' }, { 'wid th': '40', 'height': '40' }, { 'width': '30', 'height': '30' }); 74 testRemoval("constrainedAutoGrid", { 'width': '50', 'height': '40' }, { 'wid th': '40', 'height': '40' }, { 'width': '30', 'height': '30' });
74 testRemoval("constrainedMinContentFixedGrid", { 'width': '50', 'height': '40 ' }, { 'width': '40', 'height': '40' }, { 'width': '30', 'height': '30' }); 75 testRemoval("constrainedMinContentFixedGrid", { 'width': '50', 'height': '40 ' }, { 'width': '40', 'height': '40' }, { 'width': '30', 'height': '30' });
75 testRemoval("constrainedMinContentFixedGridUndefinedHeight", { 'width': '50' , 'height': '40' }, { 'width': '40', 'height': '40' }, { 'width': '30', 'height' : '40' }); 76 testRemoval("constrainedMinContentFixedGridUndefinedHeight", { 'width': '50' , 'height': '40' }, { 'width': '40', 'height': '40' }, { 'width': '30', 'height' : '40' });
76 testRemoval("constrainedMaxContentFixedGrid", { 'width': '190', 'height': '1 0' }, { 'width': '190', 'height': '10' }, { 'width': '110', 'height': '10' }); 77 testRemoval("constrainedMaxContentFixedGrid", { 'width': '190', 'height': '1 0' }, { 'width': '190', 'height': '10' }, { 'width': '110', 'height': '10' });
77 testRemoval("constrainedMaxContentFixedGridUndefinedHeight", { 'width': '190 ', 'height': '40' }, { 'width': '190', 'height': '40' }, { 'width': '110', 'heig ht': '40' }); 78 testRemoval("constrainedMaxContentFixedGridUndefinedHeight", { 'width': '190 ', 'height': '40' }, { 'width': '190', 'height': '40' }, { 'width': '110', 'heig ht': '40' });
78 testRemoval("constrainedFixedMinContentGrid", { 'width': '100', 'height': '4 0' }, { 'width': '100', 'height': '40' }, { 'width': '100', 'height': '40' }); 79 testRemoval("constrainedFixedMinContentGrid", { 'width': '100', 'height': '4 0' }, { 'width': '100', 'height': '40' }, { 'width': '100', 'height': '40' });
(...skipping 193 matching lines...) Expand 10 before | Expand all | Expand 10 after
272 </div> 273 </div>
273 274
274 <div class="lessConstrainedContainer"> 275 <div class="lessConstrainedContainer">
275 <div class="grid gridFixedMaxContent" id="lessConstrainedFixedMaxContentGrid UndefinedHeight"> 276 <div class="grid gridFixedMaxContent" id="lessConstrainedFixedMaxContentGrid UndefinedHeight">
276 <div class="firstRowFirstColumn">XXX XXX XXX XXX XXX XXX XXX XXX XXX</di v> 277 <div class="firstRowFirstColumn">XXX XXX XXX XXX XXX XXX XXX XXX XXX</di v>
277 <div class="firstRowFirstColumn">XXXXX XXXXX XXXXX XXXXX XXXXX XXXXX</di v> 278 <div class="firstRowFirstColumn">XXXXX XXXXX XXXXX XXXXX XXXXX XXXXX</di v>
278 <div class="firstRowFirstColumn">XX XX XX XX XX XX</div> 279 <div class="firstRowFirstColumn">XX XX XX XX XX XX</div>
279 </div> 280 </div>
280 </div> 281 </div>
281 282
283 <div id="test-output"></div>
284
282 </body> 285 </body>
283 </html> 286 </html>
OLDNEW
« no previous file with comments | « LayoutTests/fast/css-grid-layout/grid-item-removal-auto-placement-update-expected.txt ('k') | LayoutTests/fast/css-grid-layout/grid-item-removal-track-breadth-update-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698