Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(35)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: LayoutTests/fast/alignment/parse-align-self.html

Issue 134013002: Upgrade align-self and align-items parsing to CSS 3 (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Really fix the tests Created 6 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « LayoutTests/fast/alignment/parse-align-items-expected.txt ('k') | LayoutTests/fast/alignment/parse-align-self-expected.txt » ('j') | Source/core/css/parser/BisonCSSParser-in.cpp » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: LayoutTests/fast/alignment/parse-align-self.html
diff --git a/LayoutTests/fast/alignment/parse-align-self.html b/LayoutTests/fast/alignment/parse-align-self.html
new file mode 100644
index 0000000000000000000000000000000000000000..5804f3b5187833aa8e19b1d4ed188ff8daa028a4
--- /dev/null
+++ b/LayoutTests/fast/alignment/parse-align-self.html
@@ -0,0 +1,234 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+#alignSelfBaseline {
+ align-self: baseline;
+}
+
+#alignSelfStretch {
+ align-self: stretch;
+}
+
+#alignSelfStart {
+ align-self: start;
+}
+
+#alignSelfEnd {
+ align-self: end;
+}
+
+#alignSelfCenter {
+ align-self: center;
+}
+
+#alignSelfSelfStart {
+ align-self: self-start;
+}
+
+#alignSelfSelfEnd {
+ align-self: self-end;
+}
+
+#alignSelfLeft {
+ align-self: left;
+}
+
+#alignSelfRight {
+ align-self: right;
+}
+
+#alignSelfEndTrue {
+ align-self: end true;
+}
+
+#alignSelfCenterTrue {
+ align-self: center true;
+}
+
+#alignSelfSelfEndSafe {
+ align-self: self-end safe;
+}
+
+#alignSelfSelfStartSafe {
+ align-self: self-start safe;
+}
+
+#alignSelfRightSafe {
+ align-self: right safe;
+}
+
+#alignSelfLeftTrue {
+ align-self: left true;
+}
+</style>
+<script src="../../resources/js-test.js"></script>
+</head>
+<body>
+<div id="alignSelfBaseline"></div>
+<div id="alignSelfStretch"></div>
+<div id="alignSelfStart"></div>
+<div id="alignSelfEnd"></div>
+<div id="alignSelfCenter"></div>
+<div id="alignSelfSelfStart"></div>
+<div id="alignSelfSelfEnd"></div>
+<div id="alignSelfLeft"></div>
+<div id="alignSelfRight"></div>
+
+<div id="alignSelfEndTrue"></div>
+<div id="alignSelfCenterTrue"></div>
+<div id="alignSelfSelfEndSafe"></div>
+<div id="alignSelfSelfStartSafe"></div>
+<div id="alignSelfRightSafe"></div>
+<div id="alignSelfLeftTrue"></div>
+<script>
+description('Test that setting and getting align-self works as expected');
+
+debug("Test getting align-self set through CSS");
+var alignSelfBaseline = document.getElementById("alignSelfBaseline");
+shouldBe("getComputedStyle(alignSelfBaseline, '').getPropertyValue('align-self')", "'baseline'");
+
+var alignSelfStretch = document.getElementById("alignSelfStretch");
+shouldBe("getComputedStyle(alignSelfStretch, '').getPropertyValue('align-self')", "'stretch'");
+
+var alignSelfStart = document.getElementById("alignSelfStart");
+shouldBe("getComputedStyle(alignSelfStart, '').getPropertyValue('align-self')", "'start'");
+
+var alignSelfEnd = document.getElementById("alignSelfEnd");
+shouldBe("getComputedStyle(alignSelfEnd, '').getPropertyValue('align-self')", "'end'");
+
+var alignSelfCenter = document.getElementById("alignSelfCenter");
+shouldBe("getComputedStyle(alignSelfCenter, '').getPropertyValue('align-self')", "'center'");
+
+var alignSelfSelfEnd = document.getElementById("alignSelfSelfEnd");
+shouldBe("getComputedStyle(alignSelfSelfEnd, '').getPropertyValue('align-self')", "'self-end'");
+
+var alignSelfSelfStart = document.getElementById("alignSelfSelfStart");
+shouldBe("getComputedStyle(alignSelfSelfStart, '').getPropertyValue('align-self')", "'self-start'");
+
+var alignSelfLeft = document.getElementById("alignSelfLeft");
+shouldBe("getComputedStyle(alignSelfLeft, '').getPropertyValue('align-self')", "'left'");
+
+var alignSelfRight = document.getElementById("alignSelfRight");
+shouldBe("getComputedStyle(alignSelfRight, '').getPropertyValue('align-self')", "'right'");
+
+var alignSelfEndTrue = document.getElementById("alignSelfEndTrue");
+shouldBe("getComputedStyle(alignSelfEndTrue, '').getPropertyValue('align-self')", "'end true'");
+
+var alignSelfCenterTrue = document.getElementById("alignSelfCenterTrue");
+shouldBe("getComputedStyle(alignSelfCenterTrue, '').getPropertyValue('align-self')", "'center true'");
+
+var alignSelfSelfEndSafe = document.getElementById("alignSelfSelfEndSafe");
+shouldBe("getComputedStyle(alignSelfSelfEndSafe, '').getPropertyValue('align-self')", "'self-end safe'");
+
+var alignSelfSelfStartSafe = document.getElementById("alignSelfSelfStartSafe");
+shouldBe("getComputedStyle(alignSelfSelfStartSafe, '').getPropertyValue('align-self')", "'self-start safe'");
+
+var alignSelfRightSafe = document.getElementById("alignSelfRightSafe");
+shouldBe("getComputedStyle(alignSelfRightSafe, '').getPropertyValue('align-self')", "'right safe'");
+
+var alignSelfLeftTrue = document.getElementById("alignSelfLeftTrue");
+shouldBe("getComputedStyle(alignSelfLeftTrue, '').getPropertyValue('align-self')", "'left true'");
+
+debug("");
+debug("Test initial value of align-self through JS");
+element = document.createElement("div");
+document.body.appendChild(element);
+// align-self: auto ends up returning the default value of align-items which is 'stretch'.
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+debug("");
+debug("Test getting and setting align-self through JS");
+element = document.createElement("div");
+document.body.appendChild(element);
+element.style.alignSelf = "center";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'center'");
+
+element = document.createElement("div");
+document.body.appendChild(element);
+element.style.alignSelf = "true start";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'start true'");
+
+element.style.alignSelf = "auto";
+// See explanation for the initial value as to why this is correct.
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+debug("");
+debug("Test bad combinaisons of align-self");
+element = document.createElement("div");
+document.body.appendChild(element);
+element.style.alignSelf = "true auto";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "auto safe";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "auto left";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "baseline safe";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "baseline center";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "stretch true";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "stretch right";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "true true";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "true safe";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "center start";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "stretch true";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "safe stretch";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "baseline safe";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "true baseline";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "true safe";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "true safe left";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "true left safe";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+element.style.alignSelf = "left safe true safe";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+debug("");
+debug("Test the value 'initial'");
+element.style.alignSelf = "center";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'center'");
+element.style.alignSelf = "initial";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stretch'");
+
+debug("");
+debug("Test the value 'inherit'");
+parentElement = document.createElement("div");
+document.body.appendChild(parentElement);
+parentElement.style.alignSelf = "end";
+shouldBe("getComputedStyle(parentElement, '').getPropertyValue('align-self')", "'end'");
+
+element = document.createElement("div");
+parentElement.appendChild(element);
+element.style.alignSelf = "inherit";
+shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'end'");
+</script>
+</body>
+</html>
« no previous file with comments | « LayoutTests/fast/alignment/parse-align-items-expected.txt ('k') | LayoutTests/fast/alignment/parse-align-self-expected.txt » ('j') | Source/core/css/parser/BisonCSSParser-in.cpp » ('J')

Powered by Google App Engine
This is Rietveld 408576698