| OLD | NEW |
| 1 description('Test that setting and getting grid-columns and grid-rows works as e
xpected'); | 1 description('Test that setting and getting grid-columns and grid-rows works as e
xpected'); |
| 2 | 2 |
| 3 debug("Test getting |display| set through CSS"); | 3 debug("Test getting |display| set through CSS"); |
| 4 var gridWithFixedElement = document.getElementById("gridWithFixedElement"); | 4 var gridWithFixedElement = document.getElementById("gridWithFixedElement"); |
| 5 shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('grid-colu
mns')", "'7px 11px'"); | 5 shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('grid-colu
mns')", "'7px 11px'"); |
| 6 shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('grid-rows
')", "'17px 2px'"); | 6 shouldBe("getComputedStyle(gridWithFixedElement, '').getPropertyValue('grid-rows
')", "'17px 2px'"); |
| 7 | 7 |
| 8 var gridWithPercentElement = document.getElementById("gridWithPercentElement"); | 8 var gridWithPercentElement = document.getElementById("gridWithPercentElement"); |
| 9 shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('grid-co
lumns')", "'53% 99%'"); | 9 shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('grid-co
lumns')", "'53% 99%'"); |
| 10 shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('grid-ro
ws')", "'27% 52%'"); | 10 shouldBe("getComputedStyle(gridWithPercentElement, '').getPropertyValue('grid-ro
ws')", "'27% 52%'"); |
| (...skipping 12 matching lines...) Expand all Loading... |
| 23 | 23 |
| 24 var gridWithPercentAndViewportPercent = document.getElementById("gridWithPercent
AndViewportPercent"); | 24 var gridWithPercentAndViewportPercent = document.getElementById("gridWithPercent
AndViewportPercent"); |
| 25 shouldBe("getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyVal
ue('grid-columns')", "'50% 120px'"); | 25 shouldBe("getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyVal
ue('grid-columns')", "'50% 120px'"); |
| 26 shouldBe("getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyVal
ue('grid-rows')", "'35% 168px'"); | 26 shouldBe("getComputedStyle(gridWithPercentAndViewportPercent, '').getPropertyVal
ue('grid-rows')", "'35% 168px'"); |
| 27 | 27 |
| 28 var gridWithFitContentAndFitAvailable = document.getElementById("gridWithFitCont
entAndFitAvailable"); | 28 var gridWithFitContentAndFitAvailable = document.getElementById("gridWithFitCont
entAndFitAvailable"); |
| 29 shouldBe("getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyVal
ue('grid-columns')", "'none'"); | 29 shouldBe("getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyVal
ue('grid-columns')", "'none'"); |
| 30 shouldBe("getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyVal
ue('grid-rows')", "'none'"); | 30 shouldBe("getComputedStyle(gridWithFitContentAndFitAvailable, '').getPropertyVal
ue('grid-rows')", "'none'"); |
| 31 | 31 |
| 32 var gridWithMinMaxContent = document.getElementById("gridWithMinMaxContent"); | 32 var gridWithMinMaxContent = document.getElementById("gridWithMinMaxContent"); |
| 33 shouldBe("getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('grid-col
umns')", "'-webkit-min-content -webkit-max-content'"); | 33 shouldBe("getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('grid-col
umns')", "'min-content max-content'"); |
| 34 shouldBe("getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('grid-row
s')", "'-webkit-max-content -webkit-min-content'"); | 34 shouldBe("getComputedStyle(gridWithMinMaxContent, '').getPropertyValue('grid-row
s')", "'max-content min-content'"); |
| 35 | 35 |
| 36 var gridWithMinMaxAndFixed = document.getElementById("gridWithMinMaxAndFixed"); | 36 var gridWithMinMaxAndFixed = document.getElementById("gridWithMinMaxAndFixed"); |
| 37 shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('grid-co
lumns')", "'minmax(45px, 30%) 15px'"); | 37 shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('grid-co
lumns')", "'minmax(45px, 30%) 15px'"); |
| 38 shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('grid-ro
ws')", "'120px minmax(35%, 10px)'"); | 38 shouldBe("getComputedStyle(gridWithMinMaxAndFixed, '').getPropertyValue('grid-ro
ws')", "'120px minmax(35%, 10px)'"); |
| 39 | 39 |
| 40 var gridWithMinMaxAndMinMaxContent = document.getElementById("gridWithMinMaxAndM
inMaxContent"); | 40 var gridWithMinMaxAndMinMaxContent = document.getElementById("gridWithMinMaxAndM
inMaxContent"); |
| 41 shouldBe("getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue(
'grid-columns')", "'minmax(-webkit-min-content, 30%) 15px'"); | 41 shouldBe("getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue(
'grid-columns')", "'minmax(min-content, 30%) 15px'"); |
| 42 shouldBe("getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue(
'grid-rows')", "'120px minmax(35%, -webkit-max-content)'"); | 42 shouldBe("getComputedStyle(gridWithMinMaxAndMinMaxContent, '').getPropertyValue(
'grid-rows')", "'120px minmax(35%, max-content)'"); |
| 43 | 43 |
| 44 var gridWithFractionFraction = document.getElementById("gridWithFractionFraction
"); | 44 var gridWithFractionFraction = document.getElementById("gridWithFractionFraction
"); |
| 45 shouldBe("getComputedStyle(gridWithFractionFraction, '').getPropertyValue('grid-
columns')", "'1fr 2fr'"); | 45 shouldBe("getComputedStyle(gridWithFractionFraction, '').getPropertyValue('grid-
columns')", "'1fr 2fr'"); |
| 46 shouldBe("getComputedStyle(gridWithFractionFraction, '').getPropertyValue('grid-
rows')", "'3fr 4fr'"); | 46 shouldBe("getComputedStyle(gridWithFractionFraction, '').getPropertyValue('grid-
rows')", "'3fr 4fr'"); |
| 47 | 47 |
| 48 var gridWithFractionMinMax = document.getElementById("gridWithFractionMinMax"); | 48 var gridWithFractionMinMax = document.getElementById("gridWithFractionMinMax"); |
| 49 shouldBe("getComputedStyle(gridWithFractionMinMax, '').getPropertyValue('grid-co
lumns')", "'minmax(-webkit-min-content, 45px) 2fr'"); | 49 shouldBe("getComputedStyle(gridWithFractionMinMax, '').getPropertyValue('grid-co
lumns')", "'minmax(min-content, 45px) 2fr'"); |
| 50 shouldBe("getComputedStyle(gridWithFractionMinMax, '').getPropertyValue('grid-ro
ws')", "'3fr minmax(14px, -webkit-max-content)'"); | 50 shouldBe("getComputedStyle(gridWithFractionMinMax, '').getPropertyValue('grid-ro
ws')", "'3fr minmax(14px, max-content)'"); |
| 51 | 51 |
| 52 debug(""); | 52 debug(""); |
| 53 debug("Test the initial value"); | 53 debug("Test the initial value"); |
| 54 var element = document.createElement("div"); | 54 var element = document.createElement("div"); |
| 55 document.body.appendChild(element); | 55 document.body.appendChild(element); |
| 56 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-columns')", "'non
e'"); | 56 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-columns')", "'non
e'"); |
| 57 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-rows')", "'none'"
); | 57 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-rows')", "'none'"
); |
| 58 | 58 |
| 59 debug(""); | 59 debug(""); |
| 60 debug("Test getting and setting display through JS"); | 60 debug("Test getting and setting display through JS"); |
| (...skipping 140 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 201 element.style.gridColumns = "initial"; | 201 element.style.gridColumns = "initial"; |
| 202 element.style.gridRows = "initial"; | 202 element.style.gridRows = "initial"; |
| 203 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-columns')", "
'none'"); | 203 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-columns')", "
'none'"); |
| 204 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-rows')", "'no
ne'"); | 204 shouldBe("getComputedStyle(element, '').getPropertyValue('grid-rows')", "'no
ne'"); |
| 205 | 205 |
| 206 document.body.removeChild(element); | 206 document.body.removeChild(element); |
| 207 } | 207 } |
| 208 debug(""); | 208 debug(""); |
| 209 debug("Test setting grid-columns and grid-rows to 'initial' through JS"); | 209 debug("Test setting grid-columns and grid-rows to 'initial' through JS"); |
| 210 testInitial(); | 210 testInitial(); |
| OLD | NEW |