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

Side by Side Diff: LayoutTests/fast/css-grid-layout/named-grid-line-get-set.html

Issue 179383003: [CSS Grid Layout] Disallow using <ident> and function names as <custom-ident> (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
OLDNEW
1 <!DOCTYPE HTML> 1 <!DOCTYPE HTML>
2 <html> 2 <html>
3 <head> 3 <head>
4 <link href="resources/grid.css" rel="stylesheet"> 4 <link href="resources/grid.css" rel="stylesheet">
5 <style> 5 <style>
6 .grid { 6 .grid {
7 /* Give an explicit size to the grid so that percentage grid tracks have a c onsistent resolution */ 7 /* Give an explicit size to the grid so that percentage grid tracks have a c onsistent resolution */
8 width: 800px; 8 width: 800px;
9 height: 600px; 9 height: 600px;
10 } 10 }
(...skipping 48 matching lines...) Expand 10 before | Expand all | Expand 10 after
59 grid-template-rows: (first) 50% last); 59 grid-template-rows: (first) 50% last);
60 } 60 }
61 .gridWithMisplacedParentheses { 61 .gridWithMisplacedParentheses {
62 grid-template-columns: (first 10px) 50%; 62 grid-template-columns: (first 10px) 50%;
63 grid-template-rows: (first) (nav 50%); 63 grid-template-rows: (first) (nav 50%);
64 } 64 }
65 .gridWithContiguousParentheses { 65 .gridWithContiguousParentheses {
66 grid-template-columns: (first) (nav) 10px; 66 grid-template-columns: (first) (nav) 10px;
67 grid-template-rows: 50px (nav nav2) (middle) 10px; 67 grid-template-rows: 50px (nav nav2) (middle) 10px;
68 } 68 }
69 .gridWithAutoAsCustomIdent {
70 grid-template-columns: (auto) 10px 50px;
71 grid-template-rows: 50px (auto) 10px;
72 }
73 .gridWithMinmaxAsCustomIdent {
74 grid-template-columns: (minmax) 10px 50px;
75 grid-template-rows: 50px (minmax) 10px;
76 }
77 .gridWithSubgridAsCustomIdent {
78 grid-template-columns: (subgrid) 10px 50px;
79 grid-template-rows: 50px (subgrid) 10px;
80 }
69 </style> 81 </style>
70 <script src="../../resources/js-test.js"></script> 82 <script src="../../resources/js-test.js"></script>
71 </head> 83 </head>
72 <body> 84 <body>
73 <div class="grid gridWithFixed" id="gridWithFixedElement"></div> 85 <div class="grid gridWithFixed" id="gridWithFixedElement"></div>
74 <div class="grid gridWithPercent" id="gridWithPercentElement"></div> 86 <div class="grid gridWithPercent" id="gridWithPercentElement"></div>
75 <div class="indefiniteSizeGrid gridWithPercent" id="gridWithPercentWithoutSize"> </div> 87 <div class="indefiniteSizeGrid gridWithPercent" id="gridWithPercentWithoutSize"> </div>
76 <div class="indefiniteSizeGrid gridWithPercent" id="gridWithPercentWithoutSizeWi thChildren"> 88 <div class="indefiniteSizeGrid gridWithPercent" id="gridWithPercentWithoutSizeWi thChildren">
77 <div class="gridItem"></div> 89 <div class="gridItem"></div>
78 </div> 90 </div>
79 <div class="grid gridWithAuto" id="gridWithAutoElement"></div> 91 <div class="grid gridWithAuto" id="gridWithAutoElement"></div>
80 <div class="grid gridWithAuto" id="gridWithAutoWithChildrenElement"> 92 <div class="grid gridWithAuto" id="gridWithAutoWithChildrenElement">
81 <div class="gridItem"></div> 93 <div class="gridItem"></div>
82 </div> 94 </div>
83 <div class="grid gridWithMinMax" id="gridWithMinMax"></div> 95 <div class="grid gridWithMinMax" id="gridWithMinMax"></div>
84 <div class="grid gridWithFixedMultiple" id="gridWithFixedMultiple"></div> 96 <div class="grid gridWithFixedMultiple" id="gridWithFixedMultiple"></div>
85 <div class="grid gridWithPercentageSameStringMultipleTimes" id="gridWithPercenta geSameStringMultipleTimes"></div> 97 <div class="grid gridWithPercentageSameStringMultipleTimes" id="gridWithPercenta geSameStringMultipleTimes"></div>
86 <div class="grid gridWithRepeat" id="gridWithRepeatElement"></div> 98 <div class="grid gridWithRepeat" id="gridWithRepeatElement"></div>
87 <div class="grid gridWithEmptyParentheses" id="gridWithEmptyParentheses"></div> 99 <div class="grid gridWithEmptyParentheses" id="gridWithEmptyParentheses"></div>
88 <div class="grid gridWithoutParentheses" id="gridWithoutParentheses"></div> 100 <div class="grid gridWithoutParentheses" id="gridWithoutParentheses"></div>
89 <div class="grid gridWithInvalidNestedParentheses" id="gridWithInvalidNestedPare ntheses"></div> 101 <div class="grid gridWithInvalidNestedParentheses" id="gridWithInvalidNestedPare ntheses"></div>
90 <div class="grid gridWithUnbalancedParentheses" id="gridWithUnbalancedParenthese s"></div> 102 <div class="grid gridWithUnbalancedParentheses" id="gridWithUnbalancedParenthese s"></div>
91 <div class="grid gridWithMisplacedParentheses" id="gridWithMisplacedParentheses" ></div> 103 <div class="grid gridWithMisplacedParentheses" id="gridWithMisplacedParentheses" ></div>
92 <div class="grid gridWithContiguousParentheses" id="gridWithContiguousParenthese s"></div> 104 <div class="grid gridWithContiguousParentheses" id="gridWithContiguousParenthese s"></div>
105 <div class="grid gridWithAutoAsCustomIdent" id="gridWithAutoAsCustomIdent"></div >
106 <div class="grid gridWithMinmaxAsCustomIdent" id="gridWithMinmaxAsCustomIdent">< /div>
107 <div class="grid gridWithSubgridAsCustomIdent" id="gridWithSubgridAsCustomIdent" ></div>
93 108
94 <script src="resources/grid-definitions-parsing-utils.js"></script> 109 <script src="resources/grid-definitions-parsing-utils.js"></script>
95 <script> 110 <script>
96 description('Test that setting and getting grid-template-columns and grid-te mplate-rows works as expected'); 111 description('Test that setting and getting grid-template-columns and grid-te mplate-rows works as expected');
97 112
98 debug("Test getting grid-template-columns and grid-template-rows set through CSS"); 113 debug("Test getting grid-template-columns and grid-template-rows set through CSS");
99 testGridDefinitionsValues(document.getElementById("gridWithFixedElement"), " (first) 10px", "(first) 15px"); 114 testGridDefinitionsValues(document.getElementById("gridWithFixedElement"), " (first) 10px", "(first) 15px");
100 testGridDefinitionsValues(document.getElementById("gridWithPercentElement"), "424px (last)", "162px (last)"); 115 testGridDefinitionsValues(document.getElementById("gridWithPercentElement"), "424px (last)", "162px (last)");
101 testGridDefinitionsValues(document.getElementById("gridWithPercentWithoutSiz e"), "0px (last)", "0px (last)"); 116 testGridDefinitionsValues(document.getElementById("gridWithPercentWithoutSiz e"), "0px (last)", "0px (last)");
102 testGridDefinitionsValues(document.getElementById("gridWithPercentWithoutSiz eWithChildren"), "77px (last)", "22px (last)"); 117 testGridDefinitionsValues(document.getElementById("gridWithPercentWithoutSiz eWithChildren"), "77px (last)", "22px (last)");
(...skipping 21 matching lines...) Expand all
124 testGridDefinitionsSetJSValues("(foo bar) auto (foo) auto (bar)", "(foo bar) auto (foo) auto (bar)", "(foo bar) 0px (foo) 0px (bar)", "(foo bar) 0px (foo) 0 px (bar)", "(foo bar) auto (foo) auto (bar)", "(foo bar) auto (foo) auto (bar)") ; 139 testGridDefinitionsSetJSValues("(foo bar) auto (foo) auto (bar)", "(foo bar) auto (foo) auto (bar)", "(foo bar) 0px (foo) 0px (bar)", "(foo bar) 0px (foo) 0 px (bar)", "(foo bar) auto (foo) auto (bar)", "(foo bar) auto (foo) auto (bar)") ;
125 testGridDefinitionsSetJSValues("(first) auto repeat(2, (foo bar) 20px)", "22 0px (foo) repeat(1, 50% (baz)", "(first) 0px (foo bar) 20px (foo bar) 20px", "22 0px (foo) 300px (baz)", "(first) auto (foo bar) 20px (foo bar) 20px", "220px (fo o) 50% (baz)"); 140 testGridDefinitionsSetJSValues("(first) auto repeat(2, (foo bar) 20px)", "22 0px (foo) repeat(1, 50% (baz)", "(first) 0px (foo bar) 20px (foo bar) 20px", "22 0px (foo) 300px (baz)", "(first) auto (foo bar) 20px (foo bar) 20px", "220px (fo o) 50% (baz)");
126 141
127 debug(""); 142 debug("");
128 debug("Test getting invalid grid-template-columns and grid-template-rows set through CSS"); 143 debug("Test getting invalid grid-template-columns and grid-template-rows set through CSS");
129 testGridDefinitionsValues(document.getElementById("gridWithoutParentheses"), "none", "none"); 144 testGridDefinitionsValues(document.getElementById("gridWithoutParentheses"), "none", "none");
130 testGridDefinitionsValues(document.getElementById("gridWithInvalidNestedPare ntheses"), "none", "none"); 145 testGridDefinitionsValues(document.getElementById("gridWithInvalidNestedPare ntheses"), "none", "none");
131 testGridDefinitionsValues(document.getElementById("gridWithUnbalancedParenth eses"), "none", "none"); 146 testGridDefinitionsValues(document.getElementById("gridWithUnbalancedParenth eses"), "none", "none");
132 testGridDefinitionsValues(document.getElementById("gridWithMisplacedParenthe ses"), "none", "none"); 147 testGridDefinitionsValues(document.getElementById("gridWithMisplacedParenthe ses"), "none", "none");
133 testGridDefinitionsValues(document.getElementById("gridWithContiguousParenth eses"), "none", "none"); 148 testGridDefinitionsValues(document.getElementById("gridWithContiguousParenth eses"), "none", "none");
149 testGridDefinitionsValues(document.getElementById("gridWithAutoAsCustomIdent "), "none", "none");
150 testGridDefinitionsValues(document.getElementById("gridWithMinmaxAsCustomIde nt"), "none", "none");
151 testGridDefinitionsValues(document.getElementById("gridWithSubgridAsCustomId ent"), "none", "none");
134 152
135 debug(""); 153 debug("");
136 debug("Test getting and setting invalid grid-template-columns and grid-templ ate-rows through JS"); 154 debug("Test getting and setting invalid grid-template-columns and grid-templ ate-rows through JS");
137 testGridDefinitionsSetBadJSValues("(foo)", "(bar"); 155 testGridDefinitionsSetBadJSValues("(foo)", "(bar");
138 testGridDefinitionsSetBadJSValues("(foo bar)", "(bar foo)"); 156 testGridDefinitionsSetBadJSValues("(foo bar)", "(bar foo)");
139 testGridDefinitionsSetBadJSValues("foo bar 10px", "50% baz bar foo 2em"); 157 testGridDefinitionsSetBadJSValues("foo bar 10px", "50% baz bar foo 2em");
140 testGridDefinitionsSetBadJSValues("(foo (bar)) 10px", "50% ((baz bar) foo) 2 em"); 158 testGridDefinitionsSetBadJSValues("(foo (bar)) 10px", "50% ((baz bar) foo) 2 em");
141 testGridDefinitionsSetBadJSValues("(foo bar 10px", "50% (baz bar) foo) 2em") ; 159 testGridDefinitionsSetBadJSValues("(foo bar 10px", "50% (baz bar) foo) 2em") ;
142 testGridDefinitionsSetBadJSValues("(foo 10px) 2em", "(50% bar) (foo)"); 160 testGridDefinitionsSetBadJSValues("(foo 10px) 2em", "(50% bar) (foo)");
161 testGridDefinitionsSetBadJSValues("(foo auto) 2em", "50% (auto)");
162 testGridDefinitionsSetBadJSValues("10% (minmax nav)", "(minmax) 50% (minmax end)");
163 testGridDefinitionsSetBadJSValues("(start) 2em (subgrid)", "(subgrid) 2em");
164
143 </script> 165 </script>
144 </body> 166 </body>
145 </html> 167 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698