Index: LayoutTests/fast/alignment/parse-justify-self.html |
diff --git a/LayoutTests/fast/alignment/parse-justify-self.html b/LayoutTests/fast/alignment/parse-justify-self.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..bc30d5f8ebdd403c69d55a91a26a774e4edb50e0 |
--- /dev/null |
+++ b/LayoutTests/fast/alignment/parse-justify-self.html |
@@ -0,0 +1,232 @@ |
+<!DOCTYPE html> |
+<html> |
+<head> |
+<style> |
+#justifySelfBaseline { |
+ justify-self: baseline; |
+} |
+ |
+#justifySelfStretch { |
+ justify-self: stretch; |
+} |
+ |
+#justifySelfStart { |
+ justify-self: start; |
+} |
+ |
+#justifySelfEnd { |
+ justify-self: end; |
+} |
+ |
+#justifySelfCenter { |
+ justify-self: center; |
+} |
+ |
+#justifySelfSelfStart { |
+ justify-self: self-start; |
+} |
+ |
+#justifySelfSelfEnd { |
+ justify-self: self-end; |
+} |
+ |
+#justifySelfLeft { |
+ justify-self: left; |
+} |
+ |
+#justifySelfRight { |
+ justify-self: right; |
+} |
+ |
+#justifySelfEndTrue { |
+ justify-self: end true; |
+} |
+ |
+#justifySelfCenterTrue { |
+ justify-self: center true; |
+} |
+ |
+#justifySelfSelfEndSafe { |
+ justify-self: self-end safe; |
+} |
+ |
+#justifySelfSelfStartSafe { |
+ justify-self: self-start safe; |
+} |
+ |
+#justifySelfRightSafe { |
+ justify-self: right safe; |
+} |
+ |
+#justifySelfLeftTrue { |
+ justify-self: left true; |
+} |
+</style> |
+<script src="../../resources/js-test.js"></script> |
+</head> |
+<body> |
+<div id="justifySelfBaseline"></div> |
+<div id="justifySelfStretch"></div> |
+<div id="justifySelfStart"></div> |
+<div id="justifySelfEnd"></div> |
+<div id="justifySelfCenter"></div> |
+<div id="justifySelfSelfStart"></div> |
+<div id="justifySelfSelfEnd"></div> |
+<div id="justifySelfLeft"></div> |
+<div id="justifySelfRight"></div> |
+ |
+<div id="justifySelfEndTrue"></div> |
+<div id="justifySelfCenterTrue"></div> |
+<div id="justifySelfSelfEndSafe"></div> |
+<div id="justifySelfSelfStartSafe"></div> |
+<div id="justifySelfRightSafe"></div> |
+<div id="justifySelfLeftTrue"></div> |
+<script> |
+description('Test that setting and getting justify-self works as expected'); |
+ |
+debug("Test getting justify-self set through CSS"); |
+var justifySelfBaseline = document.getElementById("justifySelfBaseline"); |
+shouldBe("getComputedStyle(justifySelfBaseline, '').getPropertyValue('justify-self')", "'baseline'"); |
+ |
+var justifySelfStretch = document.getElementById("justifySelfStretch"); |
+shouldBe("getComputedStyle(justifySelfStretch, '').getPropertyValue('justify-self')", "'stretch'"); |
+ |
+var justifySelfStart = document.getElementById("justifySelfStart"); |
+shouldBe("getComputedStyle(justifySelfStart, '').getPropertyValue('justify-self')", "'start'"); |
+ |
+var justifySelfEnd = document.getElementById("justifySelfEnd"); |
+shouldBe("getComputedStyle(justifySelfEnd, '').getPropertyValue('justify-self')", "'end'"); |
+ |
+var justifySelfCenter = document.getElementById("justifySelfCenter"); |
+shouldBe("getComputedStyle(justifySelfCenter, '').getPropertyValue('justify-self')", "'center'"); |
+ |
+var justifySelfSelfEnd = document.getElementById("justifySelfSelfEnd"); |
+shouldBe("getComputedStyle(justifySelfSelfEnd, '').getPropertyValue('justify-self')", "'self-end'"); |
+ |
+var justifySelfSelfStart = document.getElementById("justifySelfSelfStart"); |
+shouldBe("getComputedStyle(justifySelfSelfStart, '').getPropertyValue('justify-self')", "'self-start'"); |
+ |
+var justifySelfLeft = document.getElementById("justifySelfLeft"); |
+shouldBe("getComputedStyle(justifySelfLeft, '').getPropertyValue('justify-self')", "'left'"); |
+ |
+var justifySelfRight = document.getElementById("justifySelfRight"); |
+shouldBe("getComputedStyle(justifySelfRight, '').getPropertyValue('justify-self')", "'right'"); |
+ |
+var justifySelfEndTrue = document.getElementById("justifySelfEndTrue"); |
+shouldBe("getComputedStyle(justifySelfEndTrue, '').getPropertyValue('justify-self')", "'end true'"); |
+ |
+var justifySelfCenterTrue = document.getElementById("justifySelfCenterTrue"); |
+shouldBe("getComputedStyle(justifySelfCenterTrue, '').getPropertyValue('justify-self')", "'center true'"); |
+ |
+var justifySelfSelfEndSafe = document.getElementById("justifySelfSelfEndSafe"); |
+shouldBe("getComputedStyle(justifySelfSelfEndSafe, '').getPropertyValue('justify-self')", "'self-end safe'"); |
+ |
+var justifySelfSelfStartSafe = document.getElementById("justifySelfSelfStartSafe"); |
+shouldBe("getComputedStyle(justifySelfSelfStartSafe, '').getPropertyValue('justify-self')", "'self-start safe'"); |
+ |
+var justifySelfRightSafe = document.getElementById("justifySelfRightSafe"); |
+shouldBe("getComputedStyle(justifySelfRightSafe, '').getPropertyValue('justify-self')", "'right safe'"); |
+ |
+var justifySelfLeftTrue = document.getElementById("justifySelfLeftTrue"); |
+shouldBe("getComputedStyle(justifySelfLeftTrue, '').getPropertyValue('justify-self')", "'left true'"); |
+ |
+debug(""); |
+debug("Test initial value of justify-self through JS"); |
+element = document.createElement("div"); |
+document.body.appendChild(element); |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+debug(""); |
+debug("Test getting and setting justify-self through JS"); |
+element = document.createElement("div"); |
+document.body.appendChild(element); |
+element.style.justifySelf = "center"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'center'"); |
+ |
+element = document.createElement("div"); |
+document.body.appendChild(element); |
+element.style.justifySelf = "true start"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start true'"); |
+ |
+element.style.justifySelf = "auto"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+debug(""); |
+debug("Test bad combinaisons of justify-self"); |
+element = document.createElement("div"); |
+document.body.appendChild(element); |
+element.style.justifySelf = "true auto"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "auto safe"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "auto left"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "baseline safe"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "baseline center"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "stretch true"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "stretch right"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "true true"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "true safe"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "center start"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "stretch true"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "safe stretch"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "baseline safe"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "true baseline"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "true safe"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "true safe left"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "true left safe"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+element.style.justifySelf = "left safe true safe"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+debug(""); |
+debug("Test the value 'initial'"); |
+element.style.justifySelf = "center"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'center'"); |
+element.style.justifySelf = "initial"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'auto'"); |
+ |
+debug(""); |
+debug("Test the value 'inherit'"); |
+parentElement = document.createElement("div"); |
+document.body.appendChild(parentElement); |
+parentElement.style.justifySelf = "end"; |
+shouldBe("getComputedStyle(parentElement, '').getPropertyValue('justify-self')", "'end'"); |
+ |
+element = document.createElement("div"); |
+parentElement.appendChild(element); |
+element.style.justifySelf = "inherit"; |
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'end'"); |
+</script> |
+</body> |
+</html> |