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

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set.js

Issue 1323053004: [CSS Grid Layout] Flex tracks sizing alg must handle 0fr values (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Applied last suggested changes. Created 5 years, 2 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
OLDNEW
1 description('Test that setting and getting grid-template-columns and grid-templa te-rows works as expected'); 1 description('Test that setting and getting grid-template-columns and grid-templa te-rows works as expected');
2 2
3 debug("Test getting grid-template-columns and grid-template-rows set through CSS "); 3 debug("Test getting grid-template-columns and grid-template-rows set through CSS ");
4 testGridDefinitionsValues(document.getElementById("gridWithNoneElement"), "none" , "none"); 4 testGridDefinitionsValues(document.getElementById("gridWithNoneElement"), "none" , "none");
5 testGridDefinitionsValues(document.getElementById("gridWithFixedElement"), "10px ", "15px"); 5 testGridDefinitionsValues(document.getElementById("gridWithFixedElement"), "10px ", "15px");
6 testGridDefinitionsValues(document.getElementById("gridWithPercentElement"), "40 0px", "150px"); 6 testGridDefinitionsValues(document.getElementById("gridWithPercentElement"), "40 0px", "150px");
7 testGridDefinitionsValues(document.getElementById("gridWithPercentWithoutSize"), "0px", "0px"); 7 testGridDefinitionsValues(document.getElementById("gridWithPercentWithoutSize"), "0px", "0px");
8 testGridDefinitionsValues(document.getElementById("gridWithPercentWithoutSizeWit hChildren"), "7px", "11px"); 8 testGridDefinitionsValues(document.getElementById("gridWithPercentWithoutSizeWit hChildren"), "7px", "11px");
9 testGridDefinitionsValues(document.getElementById("gridWithAutoElement"), "0px", "0px"); 9 testGridDefinitionsValues(document.getElementById("gridWithAutoElement"), "0px", "0px");
10 testGridDefinitionsValues(document.getElementById("gridWithAutoWithoutSizeElemen t"), "0px", "0px"); 10 testGridDefinitionsValues(document.getElementById("gridWithAutoWithoutSizeElemen t"), "0px", "0px");
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after
55 testGridDefinitionsSetJSValues("minmax(min-content, 8vh)", "minmax(10vw, min-con tent)", "48px", "80px"); 55 testGridDefinitionsSetJSValues("minmax(min-content, 8vh)", "minmax(10vw, min-con tent)", "48px", "80px");
56 testGridDefinitionsSetJSValues("minmax(22em, max-content)", "minmax(max-content, 5em)", "220px", "50px"); 56 testGridDefinitionsSetJSValues("minmax(22em, max-content)", "minmax(max-content, 5em)", "220px", "50px");
57 testGridDefinitionsSetJSValues("minmax(min-content, max-content)", "minmax(max-c ontent, min-content)", "0px", "0px"); 57 testGridDefinitionsSetJSValues("minmax(min-content, max-content)", "minmax(max-c ontent, min-content)", "0px", "0px");
58 testGridDefinitionsSetJSValues("minmax(auto, max-content)", "minmax(10vw, auto)" , "0px", "80px"); 58 testGridDefinitionsSetJSValues("minmax(auto, max-content)", "minmax(10vw, auto)" , "0px", "80px");
59 // Unit comparison should be case-insensitive. 59 // Unit comparison should be case-insensitive.
60 testGridDefinitionsSetJSValues("3600Fr", "154fR", "800px", "600px", "3600fr", "1 54fr"); 60 testGridDefinitionsSetJSValues("3600Fr", "154fR", "800px", "600px", "3600fr", "1 54fr");
61 // Float values are allowed. 61 // Float values are allowed.
62 testGridDefinitionsSetJSValues("3.1459fr", "2.718fr", "800px", "600px"); 62 testGridDefinitionsSetJSValues("3.1459fr", "2.718fr", "800px", "600px");
63 // A leading '+' is allowed. 63 // A leading '+' is allowed.
64 testGridDefinitionsSetJSValues("+3fr", "+4fr", "800px", "600px", "3fr", "4fr"); 64 testGridDefinitionsSetJSValues("+3fr", "+4fr", "800px", "600px", "3fr", "4fr");
65 // Flex factor values can be zero.
66 testGridDefinitionsSetJSValues("0fr", ".0fr", "0px", "0px", "0fr", "0fr");
67 testGridDefinitionsSetJSValues("minmax(0fr, 0fr)", "minmax(.0fr, .0fr)", "0px", "0px", "minmax(0fr, 0fr)", "minmax(0fr, 0fr)");
65 68
66 debug(""); 69 debug("");
67 debug("Test getting and setting grid-template-columns and grid-template-rows to calc() values through JS"); 70 debug("Test getting and setting grid-template-columns and grid-template-rows to calc() values through JS");
68 testGridDefinitionsSetJSValues("calc(150px)", "calc(75px)", "150px", "75px"); 71 testGridDefinitionsSetJSValues("calc(150px)", "calc(75px)", "150px", "75px");
69 testGridDefinitionsSetJSValues("calc(50% - 30px)", "calc(75px + 10%)", "370px", "135px"); 72 testGridDefinitionsSetJSValues("calc(50% - 30px)", "calc(75px + 10%)", "370px", "135px");
70 testGridDefinitionsSetJSValues("minmax(25%, calc(30px))", "minmax(calc(75%), 40p x)", "200px", "450px", "minmax(25%, calc(30px))", "minmax(calc(75%), 40px)"); 73 testGridDefinitionsSetJSValues("minmax(25%, calc(30px))", "minmax(calc(75%), 40p x)", "200px", "450px", "minmax(25%, calc(30px))", "minmax(calc(75%), 40px)");
71 testGridDefinitionsSetJSValues("minmax(10%, calc(30px + 10%))", "minmax(calc(25% - 50px), 200px)", "110px", "200px", "minmax(10%, calc(30px + 10%))", "minmax(ca lc(25% - 50px), 200px)"); 74 testGridDefinitionsSetJSValues("minmax(10%, calc(30px + 10%))", "minmax(calc(25% - 50px), 200px)", "110px", "200px", "minmax(10%, calc(30px + 10%))", "minmax(ca lc(25% - 50px), 200px)");
72 75
73 debug(""); 76 debug("");
74 debug("Test setting grid-template-columns and grid-template-rows to bad values t hrough JS"); 77 debug("Test setting grid-template-columns and grid-template-rows to bad values t hrough JS");
75 // No comma and only 1 argument provided. 78 // No comma and only 1 argument provided.
76 testGridDefinitionsSetBadJSValues("minmax(10px 20px)", "minmax(10px)") 79 testGridDefinitionsSetBadJSValues("minmax(10px 20px)", "minmax(10px)")
77 // Nested minmax and only 2 arguments are allowed. 80 // Nested minmax and only 2 arguments are allowed.
78 testGridDefinitionsSetBadJSValues("minmax(minmax(10px, 20px), 20px)", "minmax(10 px, 20px, 30px)"); 81 testGridDefinitionsSetBadJSValues("minmax(minmax(10px, 20px), 20px)", "minmax(10 px, 20px, 30px)");
79 // No breadth value and no comma. 82 // No breadth value and no comma.
80 testGridDefinitionsSetBadJSValues("minmax()", "minmax(30px 30% 30em)"); 83 testGridDefinitionsSetBadJSValues("minmax()", "minmax(30px 30% 30em)");
81 testGridDefinitionsSetBadJSValues("-2fr", "3ffr"); 84 testGridDefinitionsSetBadJSValues("-2fr", "3ffr");
82 testGridDefinitionsSetBadJSValues("-2.05fr", "+-3fr"); 85 testGridDefinitionsSetBadJSValues("-2.05fr", "+-3fr");
83 testGridDefinitionsSetBadJSValues("0fr", "1r"); 86 testGridDefinitionsSetBadJSValues("1f", "1r");
84 // A dimension doesn't allow spaces between the number and the unit. 87 // A dimension doesn't allow spaces between the number and the unit.
85 testGridDefinitionsSetBadJSValues(".0000fr", "13 fr"); 88 testGridDefinitionsSetBadJSValues(".1 fr", "13 fr");
86 testGridDefinitionsSetBadJSValues("7.-fr", "-8,0fr"); 89 testGridDefinitionsSetBadJSValues("7.-fr", "-8,0fr");
87 // Negative values are not allowed. 90 // Negative values are not allowed.
88 testGridDefinitionsSetBadJSValues("-1px", "-6em"); 91 testGridDefinitionsSetBadJSValues("-1px", "-6em");
89 testGridDefinitionsSetBadJSValues("minmax(-1%, 32%)", "minmax(2vw, -6em)"); 92 testGridDefinitionsSetBadJSValues("minmax(-1%, 32%)", "minmax(2vw, -6em)");
90 // Invalid expressions with calc 93 // Invalid expressions with calc
91 testGridDefinitionsSetBadJSValues("calc(16px 30px)", "calc(25px + auto)"); 94 testGridDefinitionsSetBadJSValues("calc(16px 30px)", "calc(25px + auto)");
92 testGridDefinitionsSetBadJSValues("minmax(min-content, calc())", "calc(10%("); 95 testGridDefinitionsSetBadJSValues("minmax(min-content, calc())", "calc(10%(");
93 // Forward slash not allowed if not part of a shorthand 96 // Forward slash not allowed if not part of a shorthand
94 testGridDefinitionsSetBadJSValues("10px /", "15px /"); 97 testGridDefinitionsSetBadJSValues("10px /", "15px /");
95 98
(...skipping 40 matching lines...) Expand 10 before | Expand all | Expand 10 after
136 element.style.gridTemplateColumns = "initial"; 139 element.style.gridTemplateColumns = "initial";
137 element.style.gridTemplateRows = "initial"; 140 element.style.gridTemplateRows = "initial";
138 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-colu mns')", "'none'"); 141 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-colu mns')", "'none'");
139 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-rows ')", "'none'"); 142 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-template-rows ')", "'none'");
140 143
141 document.body.removeChild(element); 144 document.body.removeChild(element);
142 } 145 }
143 debug(""); 146 debug("");
144 debug("Test setting grid-template-columns and grid-template-rows to 'initial' th rough JS"); 147 debug("Test setting grid-template-columns and grid-template-rows to 'initial' th rough JS");
145 testInitial(); 148 testInitial();
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698