| Index: third_party/WebKit/LayoutTests/fast/alignment/parse-place-self.html
|
| diff --git a/third_party/WebKit/LayoutTests/fast/alignment/parse-place-self.html b/third_party/WebKit/LayoutTests/fast/alignment/parse-place-self.html
|
| index 407da5cc19f7f58c5d8e437f41e17b36e2720674..a8e6c0e92d34f93b3a0cc166332cdc4088fa704a 100644
|
| --- a/third_party/WebKit/LayoutTests/fast/alignment/parse-place-self.html
|
| +++ b/third_party/WebKit/LayoutTests/fast/alignment/parse-place-self.html
|
| @@ -2,64 +2,64 @@
|
| <html>
|
| <head>
|
| <style>
|
| -#placeItemsNormal {
|
| - place-items: normal;
|
| +#placeSelfNormal {
|
| + place-self: normal;
|
| }
|
| -#placeItemsCenterAuto {
|
| - place-items: center auto;
|
| +#placeSelfCenterAuto {
|
| + place-self: center auto;
|
| }
|
| -#placeItemsBaseline {
|
| - place-items: baseline;
|
| +#placeSelfBaseline {
|
| + place-self: baseline;
|
| }
|
| -#placeItemsFirstBaseline {
|
| - place-items: first baseline;
|
| +#placeSelfFirstBaseline {
|
| + place-self: first baseline;
|
| }
|
| -#placeItemsLastBaseline {
|
| - place-items: last baseline;
|
| +#placeSelfLastBaseline {
|
| + place-self: last baseline;
|
| }
|
| -#placeItemsStart {
|
| - place-items: start;
|
| +#placeSelfStart {
|
| + place-self: start;
|
| }
|
| -#placeItemsFlexStart {
|
| - place-items: flex-start;
|
| +#placeSelfFlexStart {
|
| + place-self: flex-start;
|
| }
|
| -#placeItemsEnd {
|
| - place-items: end;
|
| +#placeSelfEnd {
|
| + place-self: end;
|
| }
|
| -#placeItemsSelfStart {
|
| - place-items: self-start;
|
| +#placeSelfSelfStart {
|
| + place-self: self-start;
|
| }
|
| -#placeItemsStretch {
|
| - place-items: stretch;
|
| +#placeSelfStretch {
|
| + place-self: stretch;
|
| }
|
| -#placeItemsStartEnd {
|
| - place-items: start end;
|
| +#placeSelfStartEnd {
|
| + place-self: start end;
|
| }
|
| -#placeItemsStartSelfEnd {
|
| - place-items: start self-end;
|
| +#placeSelfStartSelfEnd {
|
| + place-self: start self-end;
|
| }
|
| -#placeItemsStartBaseline {
|
| - place-items: start baseline;
|
| +#placeSelfStartBaseline {
|
| + place-self: start baseline;
|
| }
|
|
|
| <!-- Invalid CSS cases -->
|
| -#placeItemsEmpty {
|
| - place-items:;
|
| +#placeSelfEmpty {
|
| + place-self:;
|
| }
|
| -#placeItemsAuto {
|
| - place-items: auto;
|
| +#placeSelfAuto {
|
| + place-self: auto;
|
| }
|
| -#placeItemsNone {
|
| - place-items: none;
|
| +#placeSelfNone {
|
| + place-self: none;
|
| }
|
| -#placeItemsSafe {
|
| - place-items: safe;
|
| +#placeSelfSafe {
|
| + place-self: safe;
|
| }
|
| -#placeItemsStartSafe {
|
| - place-items: start safe;
|
| +#placeSelfStartSafe {
|
| + place-self: start safe;
|
| }
|
| -#placeItemsStartEndLeft {
|
| - place-items: start end left;
|
| +#placeSelfStartEndLeft {
|
| + place-self: start end left;
|
| }
|
| </style>
|
| <script src="../../resources/testharness.js"></script>
|
| @@ -67,194 +67,192 @@
|
| <script src="resources/alignment-parsing-utils-th.js"></script>
|
| </head>
|
| <body>
|
| - <p>Test to verify that the new place-items alignment shorthand is parsed as expected and correctly sets the longhand values.</p>
|
| + <p>Test to verify that the new place-self alignment shorthand is parsed as expected and correctly sets the longhand values.</p>
|
| <div id="log"></div>
|
|
|
| - <div id="placeItemsNormal"></div>
|
| - <div id="placeItemsCenterAuto"></div>
|
| - <div id="placeItemsBaseline"></div>
|
| - <div id="placeItemsFirstBaseline"></div>
|
| - <div id="placeItemsLastBaseline"></div>
|
| - <div id="placeItemsStart"></div>
|
| - <div id="placeItemsFlexStart"></div>
|
| - <div id="placeItemsEnd"></div>
|
| - <div id="placeItemsSelfStart"></div>
|
| - <div id="placeItemsStretch"></div>
|
| - <div id="placeItemsStartEnd"></div>
|
| - <div id="placeItemsStartSelfEnd"></div>
|
| - <div id="placeItemsStartBaseline"></div>
|
| + <div id="placeSelfNormal"></div>
|
| + <div id="placeSelfCenterAuto"></div>
|
| + <div id="placeSelfBaseline"></div>
|
| + <div id="placeSelfFirstBaseline"></div>
|
| + <div id="placeSelfLastBaseline"></div>
|
| + <div id="placeSelfStart"></div>
|
| + <div id="placeSelfFlexStart"></div>
|
| + <div id="placeSelfEnd"></div>
|
| + <div id="placeSelfSelfStart"></div>
|
| + <div id="placeSelfStretch"></div>
|
| + <div id="placeSelfStartEnd"></div>
|
| + <div id="placeSelfStartSelfEnd"></div>
|
| + <div id="placeSelfStartBaseline"></div>
|
|
|
| - <div id="placeItemsEmpty"></div>
|
| - <div id="placeItemsAuto"></div>
|
| - <div id="placeItemsNone"></div>
|
| - <div id="placeItemsSafe"></div>
|
| - <div id="placeItemsStartSafe"></div>
|
| - <div id="placeItemsBaselineSafe"></div>
|
| - <div id="placeItemsStartEndLeft"></div>
|
| + <div id="placeSelfEmpty"></div>
|
| + <div id="placeSelfAuto"></div>
|
| + <div id="placeSelfNone"></div>
|
| + <div id="placeSelfSafe"></div>
|
| + <div id="placeSelfStartSafe"></div>
|
| + <div id="placeSelfBaselineSafe"></div>
|
| + <div id="placeSelfStartEndLeft"></div>
|
| <script>
|
| -function checkPlaceItemsValues(element, value, alignValue, justifyValue) {
|
| +function checkPlaceSelfValues(element, value, alignValue, justifyValue) {
|
| var res = value.split(" ");
|
| if (res.length < 2)
|
| res[1] = res[0];
|
| - checkValues(element, "alignItems", "align-items", res[0], alignValue);
|
| - checkValues(element, "justifyItems", "justify-items", res[1], justifyValue);
|
| + checkValues(element, "alignSelf", "align-self", res[0], alignValue);
|
| + checkValues(element, "justifySelf", "justify-self", res[1], justifyValue);
|
| }
|
|
|
| -function checkPlaceItemsValuesJS(value, alignValue, justifyValue)
|
| +function checkPlaceSelfValuesJS(value, alignValue, justifyValue)
|
| {
|
| element = document.createElement("div");
|
| document.body.appendChild(element);
|
| - element.style.placeItems = value;
|
| - checkValues(element, "placeItems", "place-items", value, alignValue + ' ' + justifyValue)
|
| - checkPlaceItemsValues(element, value, alignValue, justifyValue)
|
| + element.style.placeSelf = value;
|
| + checkValues(element, "placeSelf", "place-self", value, alignValue + ' ' + justifyValue)
|
| + checkPlaceSelfValues(element, value, alignValue, justifyValue)
|
| }
|
|
|
| -function checkPlaceItemsValuesBadJS(value)
|
| +function checkPlaceSelfValuesBadJS(value)
|
| {
|
| - element.style.placeItems = "";
|
| - element.style.placeItems = value;
|
| - checkPlaceItemsValues(element, "", "normal", "normal")
|
| + element.style.placeSelf = "";
|
| + element.style.placeSelf = value;
|
| + checkPlaceSelfValues(element, "", "normal", "normal")
|
| }
|
|
|
| test(function() {
|
| - checkValues(placeItemsNormal, "placeItems", "place-items", "", "normal normal");
|
| - checkPlaceItemsValues(placeItemsNormal, "", "normal", "normal");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'normal' value through CSS.");
|
| + checkValues(placeSelfNormal, "placeSelf", "place-self", "", "normal normal");
|
| + checkPlaceSelfValues(placeSelfNormal, "", "normal", "normal");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'normal' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsCenterAuto, "placeItems", "place-items", "", "center normal");
|
| - checkPlaceItemsValues(placeItemsCenterAuto, "", "center", "normal");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'center auto' value through CSS.");
|
| + checkValues(placeSelfCenterAuto, "placeSelf", "place-self", "", "center normal");
|
| + checkPlaceSelfValues(placeSelfCenterAuto, "", "center", "normal");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'center auto' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsBaseline, "placeItems", "place-items", "", "baseline baseline");
|
| - checkPlaceItemsValues(placeItemsBaseline, "", "baseline", "baseline");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'baseline' value through CSS.");
|
| + checkValues(placeSelfBaseline, "placeSelf", "place-self", "", "baseline baseline");
|
| + checkPlaceSelfValues(placeSelfBaseline, "", "baseline", "baseline");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'baseline' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsFirstBaseline, "placeItems", "place-items", "", "baseline baseline");
|
| - checkPlaceItemsValues(placeItemsFirstBaseline, "", "baseline", "baseline");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'first baseline' value through CSS.");
|
| + checkValues(placeSelfFirstBaseline, "placeSelf", "place-self", "", "baseline baseline");
|
| + checkPlaceSelfValues(placeSelfFirstBaseline, "", "baseline", "baseline");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'first baseline' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsLastBaseline, "placeItems", "place-items", "", "last baseline last baseline");
|
| - checkPlaceItemsValues(placeItemsLastBaseline, "", "last baseline", "last baseline");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'last baseline' value through CSS.");
|
| + checkValues(placeSelfLastBaseline, "placeSelf", "place-self", "", "last baseline last baseline");
|
| + checkPlaceSelfValues(placeSelfLastBaseline, "", "last baseline", "last baseline");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'last baseline' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsStart, "placeItems", "place-items", "", "start start");
|
| - checkPlaceItemsValues(placeItemsStart, "", "start", "start");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'start' value through CSS.");
|
| + checkValues(placeSelfStart, "placeSelf", "place-self", "", "start start");
|
| + checkPlaceSelfValues(placeSelfStart, "", "start", "start");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'start' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsFlexStart, "placeItems", "place-items", "", "flex-start flex-start");
|
| - checkPlaceItemsValues(placeItemsFlexStart, "", "flex-start", "flex-start");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'flex-start' value through CSS.");
|
| + checkValues(placeSelfFlexStart, "placeSelf", "place-self", "", "flex-start flex-start");
|
| + checkPlaceSelfValues(placeSelfFlexStart, "", "flex-start", "flex-start");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'flex-start' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsEnd, "placeItems", "place-items", "", "end end");
|
| - checkPlaceItemsValues(placeItemsEnd, "", "end", "end");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'end' value through CSS.");
|
| + checkValues(placeSelfEnd, "placeSelf", "place-self", "", "end end");
|
| + checkPlaceSelfValues(placeSelfEnd, "", "end", "end");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'end' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsSelfStart, "placeItems", "place-items", "", "self-start self-start");
|
| - checkPlaceItemsValues(placeItemsSelfStart, "", "self-start", "self-start");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'self-start' value through CSS.");
|
| + checkValues(placeSelfSelfStart, "placeSelf", "place-self", "", "self-start self-start");
|
| + checkPlaceSelfValues(placeSelfSelfStart, "", "self-start", "self-start");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'self-start' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsStretch, "placeItems", "place-items", "", "stretch stretch");
|
| - checkPlaceItemsValues(placeItemsStretch, "", "stretch", "stretch");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'stretch' value through CSS.");
|
| + checkValues(placeSelfStretch, "placeSelf", "place-self", "", "stretch stretch");
|
| + checkPlaceSelfValues(placeSelfStretch, "", "stretch", "stretch");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'stretch' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsStartEnd, "placeItems", "place-items", "", "start end");
|
| - checkPlaceItemsValues(placeItemsStartEnd, "", "start", "end");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'start end' value through CSS.");
|
| + checkValues(placeSelfStartEnd, "placeSelf", "place-self", "", "start end");
|
| + checkPlaceSelfValues(placeSelfStartEnd, "", "start", "end");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'start end' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsStartSelfEnd, "placeItems", "place-items", "", "start self-end");
|
| - checkPlaceItemsValues(placeItemsStartSelfEnd, "", "start", "self-end");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'start self-end' value through CSS.");
|
| + checkValues(placeSelfStartSelfEnd, "placeSelf", "place-self", "", "start self-end");
|
| + checkPlaceSelfValues(placeSelfStartSelfEnd, "", "start", "self-end");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'start self-end' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsStartBaseline, "placeItems", "place-items", "", "start baseline");
|
| - checkPlaceItemsValues(placeItemsStartBaseline, "", "start", "baseline");
|
| -}, "Test getting the Computed Value of place-items's longhand properties when setting 'start baseline' value through CSS.");
|
| + checkValues(placeSelfStartBaseline, "placeSelf", "place-self", "", "start baseline");
|
| + checkPlaceSelfValues(placeSelfStartBaseline, "", "start", "baseline");
|
| +}, "Test getting the Computed Value of place-self's longhand properties when setting 'start baseline' value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsAuto, "placeItems", "place-items", "", "normal normal");
|
| - checkPlaceItemsValues(placeItemsAuto, "", "normal", "normal");
|
| + checkValues(placeSelfAuto, "placeSelf", "place-self", "", "normal normal");
|
| + checkPlaceSelfValues(placeSelfAuto, "", "normal", "normal");
|
| }, "Test setting '' as incorrect value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsAuto, "placeItems", "place-items", "", "normal normal");
|
| - checkPlaceItemsValues(placeItemsAuto, "", "normal", "normal");
|
| + checkValues(placeSelfAuto, "placeSelf", "place-self", "", "normal normal");
|
| + checkPlaceSelfValues(placeSelfAuto, "", "normal", "normal");
|
| }, "Test setting 'auto' as incorrect value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsNone, "placeItems", "place-items", "", "normal normal");
|
| - checkPlaceItemsValues(placeItemsNone, "", "normal", "normal");
|
| + checkValues(placeSelfNone, "placeSelf", "place-self", "", "normal normal");
|
| + checkPlaceSelfValues(placeSelfNone, "", "normal", "normal");
|
| }, "Test setting 'none' as incorrect value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsSafe, "placeItems", "place-items", "", "normal normal");
|
| - checkPlaceItemsValues(placeItemsSafe, "", "normal", "normal");
|
| + checkValues(placeSelfSafe, "placeSelf", "place-self", "", "normal normal");
|
| + checkPlaceSelfValues(placeSelfSafe, "", "normal", "normal");
|
| }, "Test setting 'safe' as incorrect value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsStartSafe, "placeItems", "place-items", "", "normal normal");
|
| - checkPlaceItemsValues(placeItemsStartSafe, "", "normal", "normal");
|
| + checkValues(placeSelfStartSafe, "placeSelf", "place-self", "", "normal normal");
|
| + checkPlaceSelfValues(placeSelfStartSafe, "", "normal", "normal");
|
| }, "Test setting 'start safe' as incorrect value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsStartSafe, "placeItems", "place-items", "", "normal normal");
|
| - checkPlaceItemsValues(placeItemsStartSafe, "", "normal", "normal");
|
| + checkValues(placeSelfStartSafe, "placeSelf", "place-self", "", "normal normal");
|
| + checkPlaceSelfValues(placeSelfStartSafe, "", "normal", "normal");
|
| }, "Test setting 'baseline safe' as incorrect value through CSS.");
|
|
|
| test(function() {
|
| - checkValues(placeItemsStartEndLeft, "placeItems", "place-items", "", "normal normal");
|
| - checkPlaceItemsValues(placeItemsStartEndLeft, "", "normal", "normal");
|
| + checkValues(placeSelfStartEndLeft, "placeSelf", "place-self", "", "normal normal");
|
| + checkPlaceSelfValues(placeSelfStartEndLeft, "", "normal", "normal");
|
| }, "Test setting 'start end left' as incorrect value through CSS.");
|
|
|
| test(function() {
|
| - checkPlaceItemsValuesJS("center", "center", "center");
|
| - checkPlaceItemsValuesJS("center start", "center", "start");
|
| - checkPlaceItemsValuesJS("self-start end", "self-start", "end");
|
| - checkPlaceItemsValuesJS("normal end", "normal", "end");
|
| + checkPlaceSelfValuesJS("center", "center", "center");
|
| + checkPlaceSelfValuesJS("center start", "center", "start");
|
| + checkPlaceSelfValuesJS("self-start end", "self-start", "end");
|
| + checkPlaceSelfValuesJS("normal end", "normal", "end");
|
| }, "Test setting values through JS.");
|
|
|
| test(function() {
|
| - checkPlaceItemsValuesBadJS("auto normal", "normal", "normal");
|
| - checkPlaceItemsValuesBadJS("space-between", "normal", "normal");
|
| - checkPlaceItemsValuesBadJS("center safe", "normal", "normal");
|
| - checkPlaceItemsValuesBadJS("center self-start center", "normal", "normal");
|
| - checkPlaceItemsValuesBadJS("asrt", "normal", "normal");
|
| - checkPlaceItemsValuesBadJS("auto", "normal", "normal");
|
| - checkPlaceItemsValuesBadJS("10px", "normal", "normal");
|
| - checkPlaceItemsValuesBadJS("stretch safe", "normal", "normal");
|
| - checkPlaceItemsValuesBadJS("self-start start end", "normal", "normal");
|
| - checkPlaceItemsValuesBadJS("", "normal", "normal");
|
| + checkPlaceSelfValuesBadJS("space-between", "normal", "normal");
|
| + checkPlaceSelfValuesBadJS("center safe", "normal", "normal");
|
| + checkPlaceSelfValuesBadJS("center self-start center", "normal", "normal");
|
| + checkPlaceSelfValuesBadJS("asrt", "normal", "normal");
|
| + checkPlaceSelfValuesBadJS("10px", "normal", "normal");
|
| + checkPlaceSelfValuesBadJS("stretch safe", "normal", "normal");
|
| + checkPlaceSelfValuesBadJS("self-start start end", "normal", "normal");
|
| + checkPlaceSelfValuesBadJS("", "normal", "normal");
|
| }, "Test setting incorrect values through JS.");
|
|
|
| test(function() {
|
| element = document.createElement("div");
|
| document.body.appendChild(element);
|
| - checkValues(element, "placeItems", "place-items", "", "normal normal");
|
| - element.style.placeItems = "center";
|
| - checkPlaceItemsValues(element, "center", "center", "center");
|
| - element.style.placeItems = "initial";
|
| - checkValues(element, "placeItems", "place-items", "initial", "normal normal");
|
| - checkPlaceItemsValues(element, "initial", "normal", "normal");
|
| -}, "Test the 'initial' value of the place-items shorthand and its longhand properties' Computed value");
|
| + checkValues(element, "placeSelf", "place-self", "", "normal normal");
|
| + element.style.placeSelf = "center";
|
| + checkPlaceSelfValues(element, "center", "center", "center");
|
| + element.style.placeSelf = "initial";
|
| + checkValues(element, "placeSelf", "place-self", "initial", "normal normal");
|
| + checkPlaceSelfValues(element, "initial", "normal", "normal");
|
| +}, "Test the 'initial' value of the place-self shorthand and its longhand properties' Computed value");
|
|
|
| test(function() {
|
| - document.body.style.placeItems = "start";
|
| + document.body.style.placeSelf = "start";
|
| var anotherElement = document.createElement("div");
|
| document.body.appendChild(anotherElement);
|
| - checkPlaceItemsValues(anotherElement, "", "normal", "normal");
|
| - anotherElement.style.placeItems = "inherit";
|
| - checkPlaceItemsValues(anotherElement, "inherit", "start", "start");
|
| -}, "Test the 'inherit' value of the place-items shorthand and its longhand properties' Computed value");
|
| + checkPlaceSelfValues(anotherElement, "", "normal", "normal");
|
| + anotherElement.style.placeSelf = "inherit";
|
| + checkPlaceSelfValues(anotherElement, "inherit", "start", "start");
|
| +}, "Test the 'inherit' value of the place-self shorthand and its longhand properties' Computed value");
|
| </script>
|
| </body>
|
| </html>
|
|
|