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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-get-set.html

Issue 16404015: Unprefix -webkit-min-content and -webkit-max-content for grid layout (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 7 years, 6 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 | Annotate | Revision Log
« no previous file with comments | « LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-auto-flow-resolution.html ('k') | LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-get-set-expected.txt » ('j') | Source/core/css/CSSValueKeywords.in » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> 1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
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 .gridAutoFixedFixed { 10 .gridAutoFixedFixed {
11 grid-auto-rows: 30px; 11 grid-auto-rows: 30px;
12 grid-auto-columns: 50px; 12 grid-auto-columns: 50px;
13 } 13 }
14 14
15 .gridAutoMinMax { 15 .gridAutoMinMax {
16 grid-auto-rows: minmax(10%, 15px); 16 grid-auto-rows: minmax(10%, 15px);
17 grid-auto-columns: minmax(30%, 100px); 17 grid-auto-columns: minmax(30%, 100px);
18 } 18 }
19 19
20 .gridAutoMinMaxContent { 20 .gridAutoMinMaxContent {
21 grid-auto-rows: -webkit-min-content; 21 grid-auto-rows: min-content;
22 grid-auto-columns: -webkit-max-content; 22 grid-auto-columns: max-content;
23 } 23 }
24 </style> 24 </style>
25 <script src="../js/resources/js-test-pre.js"></script> 25 <script src="../js/resources/js-test-pre.js"></script>
26 </head> 26 </head>
27 <body> 27 <body>
28 <div class="grid gridAutoFixedFixed" id="gridAutoFixedFixed"></div> 28 <div class="grid gridAutoFixedFixed" id="gridAutoFixedFixed"></div>
29 <div class="grid gridAutoMinMax" id="gridAutoMinMax"></div> 29 <div class="grid gridAutoMinMax" id="gridAutoMinMax"></div>
30 <div class="grid gridAutoMinMaxContent" id="gridAutoMinMaxContent"></div> 30 <div class="grid gridAutoMinMaxContent" id="gridAutoMinMaxContent"></div>
31 <script> 31 <script>
32 description('Test that setting and getting grid-auto-columns and grid-auto-rows works as expected'); 32 description('Test that setting and getting grid-auto-columns and grid-auto-rows works as expected');
33 33
34 debug("Test getting grid-auto-columns and grid-auto-rows set through CSS"); 34 debug("Test getting grid-auto-columns and grid-auto-rows set through CSS");
35 var gridAutoFixedFixed = document.getElementById("gridAutoFixedFixed"); 35 var gridAutoFixedFixed = document.getElementById("gridAutoFixedFixed");
36 shouldBe("getComputedStyle(gridAutoFixedFixed, '').getPropertyValue('grid-auto-r ows')", "'30px'"); 36 shouldBe("getComputedStyle(gridAutoFixedFixed, '').getPropertyValue('grid-auto-r ows')", "'30px'");
37 shouldBe("getComputedStyle(gridAutoFixedFixed, '').getPropertyValue('grid-auto-c olumns')", "'50px'"); 37 shouldBe("getComputedStyle(gridAutoFixedFixed, '').getPropertyValue('grid-auto-c olumns')", "'50px'");
38 38
39 var gridAutoMinMax = document.getElementById("gridAutoMinMax"); 39 var gridAutoMinMax = document.getElementById("gridAutoMinMax");
40 shouldBe("getComputedStyle(gridAutoMinMax, '').getPropertyValue('grid-auto-rows' )", "'minmax(10%, 15px)'"); 40 shouldBe("getComputedStyle(gridAutoMinMax, '').getPropertyValue('grid-auto-rows' )", "'minmax(10%, 15px)'");
41 shouldBe("getComputedStyle(gridAutoMinMax, '').getPropertyValue('grid-auto-colum ns')", "'minmax(30%, 100px)'"); 41 shouldBe("getComputedStyle(gridAutoMinMax, '').getPropertyValue('grid-auto-colum ns')", "'minmax(30%, 100px)'");
42 42
43 var gridAutoMinMaxContent = document.getElementById("gridAutoMinMaxContent"); 43 var gridAutoMinMaxContent = document.getElementById("gridAutoMinMaxContent");
44 shouldBe("getComputedStyle(gridAutoMinMaxContent, '').getPropertyValue('grid-aut o-rows')", "'-webkit-min-content'"); 44 shouldBe("getComputedStyle(gridAutoMinMaxContent, '').getPropertyValue('grid-aut o-rows')", "'min-content'");
45 shouldBe("getComputedStyle(gridAutoMinMaxContent, '').getPropertyValue('grid-aut o-columns')", "'-webkit-max-content'"); 45 shouldBe("getComputedStyle(gridAutoMinMaxContent, '').getPropertyValue('grid-aut o-columns')", "'max-content'");
46 46
47 debug(""); 47 debug("");
48 debug("Test the initial value"); 48 debug("Test the initial value");
49 var element = document.createElement("div"); 49 var element = document.createElement("div");
50 document.body.appendChild(element); 50 document.body.appendChild(element);
51 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'auto'"); 51 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'auto'");
52 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-rows')", "'a uto'"); 52 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-rows')", "'a uto'");
53 53
54 debug(""); 54 debug("");
55 debug("Test getting and setting grid-auto-columns and grid-auto-rows through JS" ); 55 debug("Test getting and setting grid-auto-columns and grid-auto-rows through JS" );
56 element.style.font = "10px Ahem"; 56 element.style.font = "10px Ahem";
57 element.style.gridAutoColumns = "18em"; 57 element.style.gridAutoColumns = "18em";
58 element.style.gridAutoRows = "66em"; 58 element.style.gridAutoRows = "66em";
59 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'180px'"); 59 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'180px'");
60 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-rows')", "'6 60px'"); 60 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-rows')", "'6 60px'");
61 61
62 element = document.createElement("div"); 62 element = document.createElement("div");
63 document.body.appendChild(element); 63 document.body.appendChild(element);
64 element.style.gridAutoColumns = "minmax(-webkit-min-content, 8vh)"; 64 element.style.gridAutoColumns = "minmax(min-content, 8vh)";
65 element.style.gridAutoRows = "minmax(10vw, -webkit-min-content)"; 65 element.style.gridAutoRows = "minmax(10vw, min-content)";
66 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'minmax(-webkit-min-content, 48px)'"); 66 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'minmax(min-content, 48px)'");
67 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-rows')", "'m inmax(80px, -webkit-min-content)'"); 67 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-rows')", "'m inmax(80px, min-content)'");
68 68
69 element = document.createElement("div"); 69 element = document.createElement("div");
70 document.body.appendChild(element); 70 document.body.appendChild(element);
71 element.style.gridAutoColumns = "minmax(-webkit-min-content, -webkit-max-content )"; 71 element.style.gridAutoColumns = "minmax(min-content, max-content)";
72 element.style.gridAutoRows = "minmax(-webkit-max-content, -webkit-min-content)"; 72 element.style.gridAutoRows = "minmax(max-content, min-content)";
73 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'minmax(-webkit-min-content, -webkit-max-content)'"); 73 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'minmax(min-content, max-content)'");
74 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-rows')", "'m inmax(-webkit-max-content, -webkit-min-content)'"); 74 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-rows')", "'m inmax(max-content, min-content)'");
75 75
76 debug(""); 76 debug("");
77 debug("Test setting grid-auto-columns and grid-auto-rows to bad minmax value thr ough JS"); 77 debug("Test setting grid-auto-columns and grid-auto-rows to bad minmax value thr ough JS");
78 element = document.createElement("div"); 78 element = document.createElement("div");
79 document.body.appendChild(element); 79 document.body.appendChild(element);
80 // No comma. 80 // No comma.
81 element.style.gridAutoColumns = "minmax(10px 20px)"; 81 element.style.gridAutoColumns = "minmax(10px 20px)";
82 // Only 1 argument provided. 82 // Only 1 argument provided.
83 element.style.gridAutoRows = "minmax(10px)"; 83 element.style.gridAutoRows = "minmax(10px)";
84 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'auto'"); 84 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-auto-columns')", "'auto'");
(...skipping 69 matching lines...) Expand 10 before | Expand all | Expand 10 after
154 154
155 document.body.removeChild(element); 155 document.body.removeChild(element);
156 } 156 }
157 debug(""); 157 debug("");
158 debug("Test setting grid-auto-columns and grid-auto-rows to 'initial' through JS "); 158 debug("Test setting grid-auto-columns and grid-auto-rows to 'initial' through JS ");
159 testInitial(); 159 testInitial();
160 </script> 160 </script>
161 <script src="../js/resources/js-test-post.js"></script> 161 <script src="../js/resources/js-test-post.js"></script>
162 </body> 162 </body>
163 </html> 163 </html>
OLDNEW
« no previous file with comments | « LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-auto-flow-resolution.html ('k') | LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-get-set-expected.txt » ('j') | Source/core/css/CSSValueKeywords.in » ('J')

Powered by Google App Engine
This is Rietveld 408576698