OLD | NEW |
1 description('Test that setting and getting grid-definition-columns and grid-defi
nition-rows works as expected'); | 1 description('Test that setting and getting grid-definition-columns and grid-defi
nition-rows works as expected'); |
2 | 2 |
3 debug("Test getting |grid-definition-columns| and |grid-definition-rows| set thr
ough CSS"); | 3 debug("Test getting |grid-definition-columns| and |grid-definition-rows| set thr
ough CSS"); |
4 testGridDefinitionsValues(document.getElementById("gridWithFixedElement"), "7px
11px", "17px 2px"); | 4 testGridDefinitionsValues(document.getElementById("gridWithFixedElement"), "7px
11px", "17px 2px"); |
5 testGridDefinitionsValues(document.getElementById("gridWithPercentElement"), "53
% 99%", "27% 52%"); | 5 testGridDefinitionsValues(document.getElementById("gridWithPercentElement"), "53
% 99%", "27% 52%"); |
6 testGridDefinitionsValues(document.getElementById("gridWithAutoElement"), "auto
auto", "auto auto"); | 6 testGridDefinitionsValues(document.getElementById("gridWithAutoElement"), "auto
auto", "auto auto"); |
7 testGridDefinitionsValues(document.getElementById("gridWithEMElement"), "100px 1
20px", "150px 170px"); | 7 testGridDefinitionsValues(document.getElementById("gridWithEMElement"), "100px 1
20px", "150px 170px"); |
8 testGridDefinitionsValues(document.getElementById("gridWithThreeItems"), "15px a
uto 100px", "120px 18px auto"); | 8 testGridDefinitionsValues(document.getElementById("gridWithThreeItems"), "15px a
uto 100px", "120px 18px auto"); |
9 testGridDefinitionsValues(document.getElementById("gridWithPercentAndViewportPer
cent"), "50% 120px", "35% 168px"); | 9 testGridDefinitionsValues(document.getElementById("gridWithPercentAndViewportPer
cent"), "50% 120px", "35% 168px"); |
10 testGridDefinitionsValues(document.getElementById("gridWithFitContentAndFitAvail
able"), "none", "none"); | 10 testGridDefinitionsValues(document.getElementById("gridWithFitContentAndFitAvail
able"), "none", "none"); |
(...skipping 40 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
51 testGridDefinitionsSetBadJSValues("-webkit-fit-content -webkit-fit-content", "-w
ebkit-fit-available -webkit-fit-available"); | 51 testGridDefinitionsSetBadJSValues("-webkit-fit-content -webkit-fit-content", "-w
ebkit-fit-available -webkit-fit-available"); |
52 testGridDefinitionsSetBadJSValues("auto minmax(16px, auto)", "minmax(auto, 15%)
10vw"); | 52 testGridDefinitionsSetBadJSValues("auto minmax(16px, auto)", "minmax(auto, 15%)
10vw"); |
53 // Negative values are not allowed. | 53 // Negative values are not allowed. |
54 testGridDefinitionsSetBadJSValues("-10px minmax(16px, 32px)", "minmax(10%, 15%)
-10vw"); | 54 testGridDefinitionsSetBadJSValues("-10px minmax(16px, 32px)", "minmax(10%, 15%)
-10vw"); |
55 testGridDefinitionsSetBadJSValues("10px minmax(16px, -1vw)", "minmax(-1%, 15%) 1
0vw"); | 55 testGridDefinitionsSetBadJSValues("10px minmax(16px, -1vw)", "minmax(-1%, 15%) 1
0vw"); |
56 | 56 |
57 function testInherit() | 57 function testInherit() |
58 { | 58 { |
59 var parentElement = document.createElement("div"); | 59 var parentElement = document.createElement("div"); |
60 document.body.appendChild(parentElement); | 60 document.body.appendChild(parentElement); |
61 parentElement.style.gridDefinitionColumns = "50px 1fr 'last'"; | 61 parentElement.style.gridDefinitionColumns = "50px 1fr (last)"; |
62 parentElement.style.gridDefinitionRows = "101% 'middle' 45px"; | 62 parentElement.style.gridDefinitionRows = "101% (middle) 45px"; |
63 testGridDefinitionsValues(parentElement, "50px 1fr last", "101% middle 45px"
); | 63 testGridDefinitionsValues(parentElement, "50px 1fr last", "101% middle 45px"
); |
64 | 64 |
65 element = document.createElement("div"); | 65 element = document.createElement("div"); |
66 parentElement.appendChild(element); | 66 parentElement.appendChild(element); |
67 element.style.gridDefinitionColumns = "inherit"; | 67 element.style.gridDefinitionColumns = "inherit"; |
68 element.style.gridDefinitionRows = "inherit"; | 68 element.style.gridDefinitionRows = "inherit"; |
69 testGridDefinitionsValues(element, "50px 1fr last", "101% middle 45px"); | 69 testGridDefinitionsValues(element, "50px 1fr last", "101% middle 45px"); |
70 | 70 |
71 document.body.removeChild(parentElement); | 71 document.body.removeChild(parentElement); |
72 } | 72 } |
73 debug(""); | 73 debug(""); |
74 debug("Test setting grid-definition-columns and grid-definition-rows to 'inherit
' through JS"); | 74 debug("Test setting grid-definition-columns and grid-definition-rows to 'inherit
' through JS"); |
75 testInherit(); | 75 testInherit(); |
76 | 76 |
77 function testInitial() | 77 function testInitial() |
78 { | 78 { |
79 element = document.createElement("div"); | 79 element = document.createElement("div"); |
80 document.body.appendChild(element); | 80 document.body.appendChild(element); |
81 element.style.gridDefinitionColumns = "150% 'middle' 55px"; | 81 element.style.gridDefinitionColumns = "150% (middle) 55px"; |
82 element.style.gridDefinitionRows = "1fr 'line' 2fr 'line'"; | 82 element.style.gridDefinitionRows = "1fr (line) 2fr (line)"; |
83 testGridDefinitionsValues(element, "150% middle 55px", "1fr line 2fr line"); | 83 testGridDefinitionsValues(element, "150% middle 55px", "1fr line 2fr line"); |
84 | 84 |
85 element.style.gridDefinitionColumns = "initial"; | 85 element.style.gridDefinitionColumns = "initial"; |
86 element.style.gridDefinitionRows = "initial"; | 86 element.style.gridDefinitionRows = "initial"; |
87 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-definition-co
lumns')", "'none'"); | 87 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-definition-co
lumns')", "'none'"); |
88 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-definition-ro
ws')", "'none'"); | 88 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-definition-ro
ws')", "'none'"); |
89 | 89 |
90 document.body.removeChild(element); | 90 document.body.removeChild(element); |
91 } | 91 } |
92 debug(""); | 92 debug(""); |
93 debug("Test setting grid-definition-columns and grid-definition-rows to 'initial
' through JS"); | 93 debug("Test setting grid-definition-columns and grid-definition-rows to 'initial
' through JS"); |
94 testInitial(); | 94 testInitial(); |
OLD | NEW |