OLD | NEW |
1 <!DOCTYPE HTML> | 1 <!DOCTYPE HTML> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <script> | 4 <script> |
5 if (window.testRunner) | 5 if (window.testRunner) |
6 testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1); | 6 testRunner.overridePreference("WebKitCSSGridLayoutEnabled", 1); |
7 </script> | 7 </script> |
8 <link href="resources/grid.css" rel="stylesheet"> | 8 <link href="resources/grid.css" rel="stylesheet"> |
9 <style> | 9 <style> |
10 .gridWithFixed { | 10 .gridWithFixed { |
(...skipping 43 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
54 function testCSSValue(gridElementId, namedGridDefinitionColumns, namedGridDe
finitionRows) | 54 function testCSSValue(gridElementId, namedGridDefinitionColumns, namedGridDe
finitionRows) |
55 { | 55 { |
56 testValue(document.getElementById(gridElementId), namedGridDefinitionCol
umns, namedGridDefinitionRows); | 56 testValue(document.getElementById(gridElementId), namedGridDefinitionCol
umns, namedGridDefinitionRows); |
57 } | 57 } |
58 | 58 |
59 debug("Test getting grid-definition-columns and grid-definition-rows set thr
ough CSS"); | 59 debug("Test getting grid-definition-columns and grid-definition-rows set thr
ough CSS"); |
60 testCSSValue("gridWithFixedElement", "first 10px", "first 15px"); | 60 testCSSValue("gridWithFixedElement", "first 10px", "first 15px"); |
61 testCSSValue("gridWithPercentElement", "53% last", "27% last"); | 61 testCSSValue("gridWithPercentElement", "53% last", "27% last"); |
62 testCSSValue("gridWithAutoElement", "first auto", "auto last"); | 62 testCSSValue("gridWithAutoElement", "first auto", "auto last"); |
63 testCSSValue("gridWithMinMax", "first minmax(10%, 15px)", "minmax(20px, 50%)
last"); | 63 testCSSValue("gridWithMinMax", "first minmax(10%, 15px)", "minmax(20px, 50%)
last"); |
64 testCSSValue("gridWithFixedMultiple", "nav first 10px last", "nav first 15px
last"); | 64 testCSSValue("gridWithFixedMultiple", "first nav 10px last", "first nav 15px
last"); |
65 testCSSValue("gridWithPercentageSameStringMultipleTimes", "nav first 10% nav
15% last", "first nav2 25% nav2 75% last"); | 65 testCSSValue("gridWithPercentageSameStringMultipleTimes", "first nav 10% nav
15% last", "first nav2 25% nav2 75% last"); |
66 | 66 |
67 debug(""); | 67 debug(""); |
68 debug("Test getting and setting grid-definition-columns and grid-definition-
rows through JS"); | 68 debug("Test getting and setting grid-definition-columns and grid-definition-
rows through JS"); |
69 var element = document.createElement("div"); | 69 var element = document.createElement("div"); |
70 document.body.appendChild(element); | 70 document.body.appendChild(element); |
71 element.style.gridDefinitionColumns = "'first' 18px"; | 71 element.style.gridDefinitionColumns = "'first' 18px"; |
72 element.style.gridDefinitionRows = "66px 'last'"; | 72 element.style.gridDefinitionRows = "66px 'last'"; |
73 testValue(element, "first 18px", "66px last"); | 73 testValue(element, "first 18px", "66px last"); |
74 | 74 |
75 element = document.createElement("div"); | 75 element = document.createElement("div"); |
(...skipping 43 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
119 element = document.createElement("div"); | 119 element = document.createElement("div"); |
120 document.body.appendChild(element); | 120 document.body.appendChild(element); |
121 element.style.gridDefinitionColumns = "'first' minmax(min-content, max-conte
nt)"; | 121 element.style.gridDefinitionColumns = "'first' minmax(min-content, max-conte
nt)"; |
122 element.style.gridDefinitionRows = "minmax(max-content, min-content) 'last'"
; | 122 element.style.gridDefinitionRows = "minmax(max-content, min-content) 'last'"
; |
123 testValue(element, "first minmax(min-content, max-content)", "minmax(max-con
tent, min-content) last"); | 123 testValue(element, "first minmax(min-content, max-content)", "minmax(max-con
tent, min-content) last"); |
124 | 124 |
125 element = document.createElement("div"); | 125 element = document.createElement("div"); |
126 document.body.appendChild(element); | 126 document.body.appendChild(element); |
127 element.style.gridDefinitionColumns = "'first' 'nav' minmax(min-content, max
-content) 'last'"; | 127 element.style.gridDefinitionColumns = "'first' 'nav' minmax(min-content, max
-content) 'last'"; |
128 element.style.gridDefinitionRows = "'first' 'nav' minmax(max-content, min-co
ntent) 'last'"; | 128 element.style.gridDefinitionRows = "'first' 'nav' minmax(max-content, min-co
ntent) 'last'"; |
129 testValue(element, "nav first minmax(min-content, max-content) last", "nav f
irst minmax(max-content, min-content) last"); | 129 testValue(element, "first nav minmax(min-content, max-content) last", "first
nav minmax(max-content, min-content) last"); |
130 | 130 |
131 element = document.createElement("div"); | 131 element = document.createElement("div"); |
132 document.body.appendChild(element); | 132 document.body.appendChild(element); |
133 element.style.gridDefinitionColumns = "'first' 'nav' minmax(min-content, max
-content) 'nav' auto 'last'"; | 133 element.style.gridDefinitionColumns = "'first' 'nav' minmax(min-content, max
-content) 'nav' auto 'last'"; |
134 element.style.gridDefinitionRows = "'first' 'nav2' minmax(max-content, min-c
ontent) 'nav2' minmax(10px, 15px) 'last'"; | 134 element.style.gridDefinitionRows = "'first' 'nav2' minmax(max-content, min-c
ontent) 'nav2' minmax(10px, 15px) 'last'"; |
135 testValue(element, "nav first minmax(min-content, max-content) nav auto last
", "first nav2 minmax(max-content, min-content) nav2 minmax(10px, 15px) last"); | 135 testValue(element, "first nav minmax(min-content, max-content) nav auto last
", "first nav2 minmax(max-content, min-content) nav2 minmax(10px, 15px) last"); |
136 | 136 |
137 element = document.createElement("div"); | 137 element = document.createElement("div"); |
138 document.body.appendChild(element); | 138 document.body.appendChild(element); |
139 element.style.gridDefinitionColumns = "'foo' 'bar' auto 'foo' auto 'bar'"; | 139 element.style.gridDefinitionColumns = "'foo' 'bar' auto 'foo' auto 'bar'"; |
140 element.style.gridDefinitionRows = "'foo' 'bar' auto 'foo' auto 'bar'"; | 140 element.style.gridDefinitionRows = "'foo' 'bar' auto 'foo' auto 'bar'"; |
141 testValue(element, "foo bar auto foo auto bar", "foo bar auto foo auto bar")
; | 141 testValue(element, "foo bar auto foo auto bar", "foo bar auto foo auto bar")
; |
142 | 142 |
143 debug(""); | 143 debug(""); |
144 debug("Test getting and setting invalid grid-definition-columns and grid-def
inition-rows through JS"); | 144 debug("Test getting and setting invalid grid-definition-columns and grid-def
inition-rows through JS"); |
145 element = document.createElement("div"); | 145 element = document.createElement("div"); |
146 document.body.appendChild(element); | 146 document.body.appendChild(element); |
147 element.style.gridDefinitionColumns = "'foo'"; | 147 element.style.gridDefinitionColumns = "'foo'"; |
148 element.style.gridDefinitionRows = "'bar"; | 148 element.style.gridDefinitionRows = "'bar"; |
149 testValue(element, "none", "none"); | 149 testValue(element, "none", "none"); |
150 | 150 |
151 element = document.createElement("div"); | 151 element = document.createElement("div"); |
152 document.body.appendChild(element); | 152 document.body.appendChild(element); |
153 element.style.gridDefinitionColumns = "'foo' 'bar'"; | 153 element.style.gridDefinitionColumns = "'foo' 'bar'"; |
154 element.style.gridDefinitionRows = "'bar' 'foo'"; | 154 element.style.gridDefinitionRows = "'bar' 'foo'"; |
155 testValue(element, "none", "none"); | 155 testValue(element, "none", "none"); |
156 </script> | 156 </script> |
157 <script src="../js/resources/js-test-post.js"></script> | 157 <script src="../js/resources/js-test-post.js"></script> |
158 </body> | 158 </body> |
159 </html> | 159 </html> |
OLD | NEW |