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> |