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

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: LayoutTests/animations/animations-parsing.html

Issue 22925002: Add support to resolve unprefixed CSS animations properties. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 7 years, 4 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 | « no previous file | LayoutTests/animations/animations-parsing-expected.txt » ('j') | Source/core/css/CSSParser-in.cpp » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: LayoutTests/animations/animations-parsing.html
diff --git a/LayoutTests/animations/animations-parsing.html b/LayoutTests/animations/animations-parsing.html
new file mode 100644
index 0000000000000000000000000000000000000000..c1854694b80f3f67880520223336eee020c904c4
--- /dev/null
+++ b/LayoutTests/animations/animations-parsing.html
@@ -0,0 +1,827 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src="../fast/js/resources/js-test-pre.js"></script>
+</head>
+<body>
+<script>
+description("Test the parsing and the computed style values of the animations properties.")
+
+var testContainer = document.createElement("div");
+document.body.appendChild(testContainer);
+
+testContainer.innerHTML = '<div style="width:500px;height:500px"><div id="test">hello</div></div>';
+
+e = document.getElementById('test');
+style = e.style;
+computedStyle = window.getComputedStyle(e, null);
+
+// This function checks the return value of computedStyle.animation and verifies Blink can parse it.
+function checkTransitionShorthandValue() {
+ var before = computedStyle.getPropertyValue('animation');
+ e.style.animation = '';
+ e.style.animation = before;
+ return (computedStyle.getPropertyValue('animation') == before);
+}
+
+debug("Valid animation-name values.");
+// Initial test.
+shouldBe("computedStyle.animationName", "'none'");
+shouldBe("computedStyle.webkitAnimationName", "'none'");
+
+style.animationName = "none";
+shouldNotBe("Object.keys(style).indexOf('animationName')", "-1");
+shouldNotBe("Object.keys(style).indexOf('webkitAnimationName')", "-1");
+shouldBe("style.animationName", "'none'");
+shouldBe("computedStyle.animationName", "'none'");
+shouldBe("style.webkitAnimationName", "'none'");
+shouldBe("computedStyle.webkitAnimationName", "'none'");
+
+style.animationName = "none, none";
+shouldBe("style.animationName", "'none, none'");
+shouldBe("computedStyle.animationName", "'none'");
+shouldBe("style.webkitAnimationName", "'none, none'");
+shouldBe("computedStyle.webkitAnimationName", "'none'");
+
+style.animationName = "myAnim";
+shouldBe("style.animationName", "'myAnim'");
+shouldBe("computedStyle.animationName", "'myAnim'");
+shouldBe("style.webkitAnimationName", "'myAnim'");
+shouldBe("computedStyle.webkitAnimationName", "'myAnim'");
+
+style.animationName = "background-position, font-size";
+shouldBe("style.animationName", "'background-position, font-size'");
+shouldBe("computedStyle.animationName", "'background-position, font-size'");
+shouldBe("style.webkitAnimationName", "'background-position, font-size'");
+shouldBe("computedStyle.webkitAnimationName", "'background-position, font-size'");
+
+style.animationName = "background-position, font-size, color";
+shouldBe("style.animationName", "'background-position, font-size, color'");
+shouldBe("computedStyle.animationName", "'background-position, font-size, color'");
+shouldBe("style.webkitAnimationName", "'background-position, font-size, color'");
+shouldBe("computedStyle.webkitAnimationName", "'background-position, font-size, color'");
+
+style.animationName = "all, font-size, color";
+shouldBe("style.animationName", "'all, font-size, color'");
+shouldBe("computedStyle.animationName", "'all, font-size, color'");
+shouldBe("style.webkitAnimationName", "'all, font-size, color'");
+shouldBe("computedStyle.webkitAnimationName", "'all, font-size, color'");
+
+style.animationName = "inherit";
+shouldBe("style.animationName", "'inherit'");
+shouldBe("computedStyle.animationName", "'none'");
+shouldBe("style.webkitAnimationName", "'inherit'");
+shouldBe("computedStyle.webkitAnimationName", "'none'");
+
+style.animationName = "initial";
+shouldBe("style.animationName", "'initial'");
+shouldBe("computedStyle.animationName", "'none'");
+shouldBe("style.webkitAnimationName", "'initial'");
+shouldBe("computedStyle.webkitAnimationName", "'none'");
+
+debug("Invalid animation-name values.");
+style.animationName = "";
+
+style.animationName = "0";
+shouldBe("style.animationName", "''");
+shouldBe("computedStyle.animationName", "'none'");
+shouldBe("style.webkitAnimationName", "''");
+shouldBe("computedStyle.webkitAnimationName", "'none'");
+
+style.animationName = "all none";
+shouldBe("style.animationName", "''");
+shouldBe("computedStyle.animationName", "'none'");
+shouldBe("style.webkitAnimationName", "''");
+shouldBe("computedStyle.webkitAnimationName", "'none'");
+
+style.animationName = "opacity width";
+shouldBe("style.animationName", "''");
+shouldBe("computedStyle.animationName", "'none'");
+shouldBe("style.webkitAnimationName", "''");
+shouldBe("computedStyle.webkitAnimationName", "'none'");
+
+style.animationName = "";
+
+debug("Valid animation-duration values.");
+// Initial test.
+shouldBe("computedStyle.animationDuration", "'0s'");
+shouldBe("computedStyle.webkitAnimationDuration", "'0s'");
+
+style.animationDuration = "0s";
+shouldNotBe("Object.keys(style).indexOf('animationDuration')", "-1");
+shouldNotBe("Object.keys(style).indexOf('webkitAnimationDuration')", "-1");
+shouldBe("style.animationDuration", "'0s'");
+shouldBe("computedStyle.animationDuration", "'0s'");
+shouldBe("style.webkitAnimationDuration", "'0s'");
+shouldBe("computedStyle.webkitAnimationDuration", "'0s'");
+
+style.animationDuration = "5s";
+shouldBe("style.animationDuration", "'5s'");
+shouldBe("computedStyle.animationDuration", "'5s'");
+shouldBe("style.webkitAnimationDuration", "'5s'");
+shouldBe("computedStyle.webkitAnimationDuration", "'5s'");
+
+style.animationDuration = "10ms";
+shouldBe("style.animationDuration", "'10ms'");
+shouldBe("computedStyle.animationDuration", "'0.01s'");
+shouldBe("style.webkitAnimationDuration", "'10ms'");
+shouldBe("computedStyle.webkitAnimationDuration", "'0.01s'");
+
+style.animationDuration = "10ms, 20s";
+shouldBe("style.animationDuration", "'10ms, 20s'");
+shouldBe("computedStyle.animationDuration", "'0.01s, 20s'");
+shouldBe("style.webkitAnimationDuration", "'10ms, 20s'");
+shouldBe("computedStyle.webkitAnimationDuration", "'0.01s, 20s'");
+
+debug("Invalid animation-duration values.");
+style.animationDuration = "";
+
+// Negative values are invalid.
+style.animationDuration = "-10ms";
+shouldBe("style.animationDuration", "''");
+shouldBe("computedStyle.animationDuration", "'0s'");
+shouldBe("style.webkitAnimationDuration", "''");
+shouldBe("computedStyle.webkitAnimationDuration", "'0s'");
+
+style.animationDuration = "'5ms'";
+shouldBe("style.animationDuration", "''");
+shouldBe("computedStyle.animationDuration", "'0s'");
+shouldBe("style.webkitAnimationDuration", "''");
+shouldBe("computedStyle.webkitAnimationDuration", "'0s'");
+
+style.animationDuration = "30px";
+shouldBe("style.animationDuration", "''");
+shouldBe("computedStyle.animationDuration", "'0s'");
+shouldBe("style.webkitAnimationDuration", "''");
+shouldBe("computedStyle.webkitAnimationDuration", "'0s'");
+
+style.animationDuration = "solid";
+shouldBe("style.animationDuration", "''");
+shouldBe("computedStyle.animationDuration", "'0s'");
+shouldBe("style.webkitAnimationDuration", "''");
+shouldBe("computedStyle.webkitAnimationDuration", "'0s'");
+
+style.animationDuration = "20";
+shouldBe("style.animationDuration", "''");
+shouldBe("computedStyle.animationDuration", "'0s'");
+shouldBe("style.webkitAnimationDuration", "''");
+shouldBe("computedStyle.webkitAnimationDuration", "'0s'");
+
+style.animationDuration = "20%";
+shouldBe("style.animationDuration", "''");
+shouldBe("computedStyle.animationDuration", "'0s'");
+shouldBe("style.webkitAnimationDuration", "''");
+shouldBe("computedStyle.webkitAnimationDuration", "'0s'");
+
+style.animationDuration = "0s, 20px";
+shouldBe("style.animationDuration", "''");
+shouldBe("computedStyle.animationDuration", "'0s'");
+shouldBe("style.webkitAnimationDuration", "''");
+shouldBe("computedStyle.webkitAnimationDuration", "'0s'");
+
+debug("Valid animation-timing-function values.");
+// Initial test.
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "linear";
+shouldNotBe("Object.keys(style).indexOf('animationTimingFunction')", "-1");
+shouldNotBe("Object.keys(style).indexOf('webkitAnimationTimingFunction')", "-1");
+shouldBe("style.animationTimingFunction", "'linear'");
+shouldBe("computedStyle.animationTimingFunction", "'linear'");
+shouldBe("style.webkitAnimationTimingFunction", "'linear'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'linear'");
+
+style.animationTimingFunction = "ease";
+shouldBe("style.animationTimingFunction", "'ease'");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "'ease'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "ease-in";
+shouldBe("style.animationTimingFunction", "'ease-in'");
+shouldBe("computedStyle.animationTimingFunction", "'ease-in'");
+shouldBe("style.webkitAnimationTimingFunction", "'ease-in'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease-in'");
+
+style.animationTimingFunction = "ease-out";
+shouldBe("style.animationTimingFunction", "'ease-out'");
+shouldBe("computedStyle.animationTimingFunction", "'ease-out'");
+shouldBe("style.webkitAnimationTimingFunction", "'ease-out'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease-out'");
+
+style.animationTimingFunction = "ease-in-out";
+shouldBe("style.animationTimingFunction", "'ease-in-out'");
+shouldBe("computedStyle.animationTimingFunction", "'ease-in-out'");
+shouldBe("style.webkitAnimationTimingFunction", "'ease-in-out'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease-in-out'");
+
+style.animationTimingFunction = "cubic-bezier(0.25, 0.1, 0.25, 1)";
+shouldBe("style.animationTimingFunction", "'cubic-bezier(0.25, 0.1, 0.25, 1)'");
+shouldBe("computedStyle.animationTimingFunction", "'cubic-bezier(0.25, 0.1, 0.25, 1)'");
+shouldBe("style.webkitAnimationTimingFunction", "'cubic-bezier(0.25, 0.1, 0.25, 1)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'cubic-bezier(0.25, 0.1, 0.25, 1)'");
+
+style.animationTimingFunction = "cubic-bezier(0.1, 0, 0.23, 0.4)";
+shouldBe("style.animationTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 0.4)'");
+shouldBe("computedStyle.animationTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 0.4)'");
+shouldBe("style.webkitAnimationTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 0.4)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 0.4)'");
+
+style.animationTimingFunction = "cubic-bezier(0.1, 0, 0.23, 3)";
+shouldBe("style.animationTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 3)'");
+shouldBe("computedStyle.animationTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 3)'");
+shouldBe("style.webkitAnimationTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 3)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 3)'");
+
+style.animationTimingFunction = "cubic-bezier(0.1, 5, 0.23, 3)";
+shouldBe("style.animationTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 3)'");
+shouldBe("computedStyle.animationTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 3)'");
+shouldBe("style.webkitAnimationTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 3)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 3)'");
+
+style.animationTimingFunction = "cubic-bezier(0.1, 5, 0.23, 0)";
+shouldBe("style.animationTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 0)'");
+shouldBe("computedStyle.animationTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 0)'");
+shouldBe("style.webkitAnimationTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 0)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 0)'");
+
+style.animationTimingFunction = "cubic-bezier(0.2, 2, 0.2, -0.4)";
+shouldBe("style.animationTimingFunction", "'cubic-bezier(0.2, 2, 0.2, -0.4)'");
+shouldBe("computedStyle.animationTimingFunction", "'cubic-bezier(0.2, 2, 0.2, -0.4)'");
+shouldBe("style.webkitAnimationTimingFunction", "'cubic-bezier(0.2, 2, 0.2, -0.4)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'cubic-bezier(0.2, 2, 0.2, -0.4)'");
+
+style.animationTimingFunction = "cubic-bezier(0.2, -2, 0.2, 0.4)";
+shouldBe("style.animationTimingFunction", "'cubic-bezier(0.2, -2, 0.2, 0.4)'");
+shouldBe("computedStyle.animationTimingFunction", "'cubic-bezier(0.2, -2, 0.2, 0.4)'");
+shouldBe("style.webkitAnimationTimingFunction", "'cubic-bezier(0.2, -2, 0.2, 0.4)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'cubic-bezier(0.2, -2, 0.2, 0.4)'");
+
+style.animationTimingFunction = "step-start";
+shouldBe("style.animationTimingFunction", "'step-start'");
+shouldBe("computedStyle.animationTimingFunction", "'steps(1, start)'");
+shouldBe("style.webkitAnimationTimingFunction", "'step-start'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'steps(1, start)'");
+
+style.animationTimingFunction = "step-end";
+shouldBe("style.animationTimingFunction", "'step-end'");
+shouldBe("computedStyle.animationTimingFunction", "'steps(1, end)'");
+shouldBe("style.webkitAnimationTimingFunction", "'step-end'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'steps(1, end)'");
+
+style.animationTimingFunction = "steps(3)";
+shouldBe("style.animationTimingFunction", "'steps(3, end)'");
+shouldBe("computedStyle.animationTimingFunction", "'steps(3, end)'");
+shouldBe("style.webkitAnimationTimingFunction", "'steps(3, end)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'steps(3, end)'");
+
+style.animationTimingFunction = "steps(4, end)";
+shouldBe("style.animationTimingFunction", "'steps(4, end)'");
+shouldBe("computedStyle.animationTimingFunction", "'steps(4, end)'");
+shouldBe("style.webkitAnimationTimingFunction", "'steps(4, end)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'steps(4, end)'");
+
+style.animationTimingFunction = "steps(5, start)";
+shouldBe("style.animationTimingFunction", "'steps(5, start)'");
+shouldBe("computedStyle.animationTimingFunction", "'steps(5, start)'");
+shouldBe("style.webkitAnimationTimingFunction", "'steps(5, start)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'steps(5, start)'");
+
+style.animationName = "anim1, anim2";
+
+style.animationTimingFunction = "ease-in-out, ease-in";
+shouldBe("style.animationTimingFunction", "'ease-in-out, ease-in'");
+shouldBe("computedStyle.animationTimingFunction", "'ease-in-out, ease-in'");
+shouldBe("style.webkitAnimationTimingFunction", "'ease-in-out, ease-in'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease-in-out, ease-in'");
+
+style.animationTimingFunction = "ease-in-out, cubic-bezier(0.1, 0, 0.23, 0.4)";
+shouldBe("style.animationTimingFunction", "'ease-in-out, cubic-bezier(0.1, 0, 0.23, 0.4)'");
+shouldBe("computedStyle.animationTimingFunction", "'ease-in-out, cubic-bezier(0.1, 0, 0.23, 0.4)'");
+shouldBe("style.webkitAnimationTimingFunction", "'ease-in-out, cubic-bezier(0.1, 0, 0.23, 0.4)'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease-in-out, cubic-bezier(0.1, 0, 0.23, 0.4)'");
+
+style.animationTimingFunction = "steps(3, start), ease-in-out";
+shouldBe("style.animationTimingFunction", "'steps(3, start), ease-in-out'");
+shouldBe("computedStyle.animationTimingFunction", "'steps(3, start), ease-in-out'");
+shouldBe("style.webkitAnimationTimingFunction", "'steps(3, start), ease-in-out'");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'steps(3, start), ease-in-out'");
+
+debug("Invalid animation-timing-function values.");
+style.animationName = "";
+style.animationTimingFunction = "";
+
+style.animationTimingFunction = "cubic-bezier(3, 0.1, 4, 1)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "cubic-bezier(1, 0.1, 3, 1)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "cubic-bezier(0.1, 0, 4, 0.4)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "cubic-bezier(3, 0, 4, 0.4)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "cubic-bezier(3, 0, 0.2, 0.4)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "cubic-bezier(-0.2, 0, 0.2, 0.4)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "cubic-bezier(0.2, 2, -0.2, 0.4)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "steps(5, 3)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "steps(-5, start)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "steps(5, start, end)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "step(5)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "red";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "cubic-bezier(0.25, 0.1, 0.25)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "cubic-bezier(0.25, 0.1, 0.25, 1, 2)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+style.animationTimingFunction = "cubic-foo(0.25, 0.1, 0.25, 1)";
+shouldBe("style.animationTimingFunction", "''");
+shouldBe("computedStyle.animationTimingFunction", "'ease'");
+shouldBe("style.webkitAnimationTimingFunction", "''");
+shouldBe("computedStyle.webkitAnimationTimingFunction", "'ease'");
+
+debug("Valid animation-delay values.");
+// Initial test.
+shouldBe("computedStyle.animationDelay", "'0s'");
+shouldBe("computedStyle.webkitAnimationDelay", "'0s'");
+
+style.animationDelay = "0s";
+shouldNotBe("Object.keys(style).indexOf('animationDelay')", "-1");
+shouldNotBe("Object.keys(style).indexOf('webkitAnimationDelay')", "-1");
+shouldBe("style.animationDelay", "'0s'");
+shouldBe("computedStyle.animationDelay", "'0s'");
+shouldBe("style.webkitAnimationDelay", "'0s'");
+shouldBe("computedStyle.webkitAnimationDelay", "'0s'");
+
+style.animationDelay = "5s";
+shouldBe("style.animationDelay", "'5s'");
+shouldBe("computedStyle.animationDelay", "'5s'");
+shouldBe("style.webkitAnimationDelay", "'5s'");
+shouldBe("computedStyle.webkitAnimationDelay", "'5s'");
+
+style.animationDelay = "10ms";
+shouldBe("style.animationDelay", "'10ms'");
+shouldBe("computedStyle.animationDelay", "'0.01s'");
+shouldBe("style.webkitAnimationDelay", "'10ms'");
+shouldBe("computedStyle.webkitAnimationDelay", "'0.01s'");
+
+style.animationDelay = "-10ms";
+shouldBe("style.animationDelay", "'-10ms'");
+shouldBe("computedStyle.animationDelay", "'-0.01s'");
+shouldBe("style.webkitAnimationDelay", "'-10ms'");
+shouldBe("computedStyle.webkitAnimationDelay", "'-0.01s'");
+
+style.transitionProperty = "opacity, width";
+
+style.animationDelay = "-10ms, 20s";
+shouldBe("style.animationDelay", "'-10ms, 20s'");
+shouldBe("computedStyle.animationDelay", "'-0.01s, 20s'");
+shouldBe("style.webkitAnimationDelay", "'-10ms, 20s'");
+shouldBe("computedStyle.webkitAnimationDelay", "'-0.01s, 20s'");
+
+debug("Invalid animation-delay values.");
+style.transitionProperty = "opacity";
+style.animationDelay = "";
+
+style.animationDelay = "'5ms'";
+shouldBe("style.animationDelay", "''");
+shouldBe("computedStyle.animationDelay", "'0s'");
+shouldBe("style.webkitAnimationDelay", "''");
+shouldBe("computedStyle.webkitAnimationDelay", "'0s'");
+
+style.animationDelay = "30px";
+shouldBe("style.animationDelay", "''");
+shouldBe("computedStyle.animationDelay", "'0s'");
+shouldBe("style.webkitAnimationDelay", "''");
+shouldBe("computedStyle.webkitAnimationDelay", "'0s'");
+
+style.animationDelay = "solid";
+shouldBe("style.animationDelay", "''");
+shouldBe("computedStyle.animationDelay", "'0s'");
+shouldBe("style.webkitAnimationDelay", "''");
+shouldBe("computedStyle.webkitAnimationDelay", "'0s'");
+
+style.animationDelay = "20";
+shouldBe("style.animationDelay", "''");
+shouldBe("computedStyle.animationDelay", "'0s'");
+shouldBe("style.webkitAnimationDelay", "''");
+shouldBe("computedStyle.webkitAnimationDelay", "'0s'");
+
+style.animationDelay = "20%";
+shouldBe("style.animationDelay", "''");
+shouldBe("computedStyle.animationDelay", "'0s'");
+shouldBe("style.webkitAnimationDelay", "''");
+shouldBe("computedStyle.webkitAnimationDelay", "'0s'");
+
+style.animationDelay = "0s, 20px";
+shouldBe("style.animationDelay", "''");
+shouldBe("computedStyle.animationDelay", "'0s'");
+shouldBe("style.webkitAnimationDelay", "''");
+shouldBe("computedStyle.webkitAnimationDelay", "'0s'");
+
+debug("Valid animation-iteration-count values.");
+// Initial test.
+shouldBe("computedStyle.animationIterationCount", "'1'");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'1'");
+
+style.animationIterationCount = "4";
+shouldNotBe("Object.keys(style).indexOf('animationIterationCount')", "-1");
+shouldNotBe("Object.keys(style).indexOf('webkitAnimationIterationCount')", "-1");
+shouldBe("style.animationIterationCount", "'4'");
+shouldBe("computedStyle.animationIterationCount", "'4'");
+shouldBe("style.webkitAnimationIterationCount", "'4'");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'4'");
+
+style.animationIterationCount = "2.5";
+shouldBe("style.animationIterationCount", "'2.5'");
+shouldBe("computedStyle.animationIterationCount", "'2.5'");
+shouldBe("style.webkitAnimationIterationCount", "'2.5'");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'2.5'");
+
+style.animationIterationCount = "infinite";
+shouldBe("style.animationIterationCount", "'infinite'");
+shouldBe("computedStyle.animationIterationCount", "'infinite'");
+shouldBe("style.webkitAnimationIterationCount", "'infinite'");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'infinite'");
+
+style.animationIterationCount = "infinite, 3";
+shouldBe("style.animationIterationCount", "'infinite, 3'");
+shouldBe("computedStyle.animationIterationCount", "'infinite, 3'");
+shouldBe("style.webkitAnimationIterationCount", "'infinite, 3'");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'infinite, 3'");
+
+style.animationIterationCount = "0";
+shouldBe("style.animationIterationCount", "'0'");
+shouldBe("computedStyle.animationIterationCount", "'0'");
+shouldBe("style.webkitAnimationIterationCount", "'0'");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'0'");
+
+style.animationIterationCount = "infinite, infinite";
+shouldBe("style.animationIterationCount", "'infinite, infinite'");
+shouldBe("computedStyle.animationIterationCount", "'infinite, infinite'");
+shouldBe("style.webkitAnimationIterationCount", "'infinite, infinite'");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'infinite, infinite'");
+
+debug("Invalid animation-iteration-count values.");
+style.animationIterationCount = "";
+
+style.animationIterationCount = "none";
+shouldBe("style.animationIterationCount", "''");
+shouldBe("computedStyle.animationIterationCount", "'1'");
+shouldBe("style.webkitAnimationIterationCount", "''");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'1'");
+
+style.animationIterationCount = "-3";
+shouldBe("style.animationIterationCount", "''");
+shouldBe("computedStyle.animationIterationCount", "'1'");
+shouldBe("style.webkitAnimationIterationCount", "''");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'1'");
+
+style.animationIterationCount = "infinite, -3";
+shouldBe("style.animationIterationCount", "''");
+shouldBe("computedStyle.animationIterationCount", "'1'");
+shouldBe("style.webkitAnimationIterationCount", "''");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'1'");
+
+style.animationIterationCount = "solid";
+shouldBe("style.animationIterationCount", "''");
+shouldBe("computedStyle.animationIterationCount", "'1'");
+shouldBe("style.webkitAnimationIterationCount", "''");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'1'");
+
+style.animationIterationCount = "-1, infinite";
+shouldBe("style.animationIterationCount", "''");
+shouldBe("computedStyle.animationIterationCount", "'1'");
+shouldBe("style.webkitAnimationIterationCount", "''");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'1'");
+
+style.animationIterationCount = "-1, 3";
+shouldBe("style.animationIterationCount", "''");
+shouldBe("computedStyle.animationIterationCount", "'1'");
+shouldBe("style.webkitAnimationIterationCount", "''");
+shouldBe("computedStyle.webkitAnimationIterationCount", "'1'");
+
+debug("Valid animation-direction values.");
+// Initial test.
+shouldBe("computedStyle.animationDirection", "'normal'");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal'");
+
+style.animationDirection = "reverse";
+shouldNotBe("Object.keys(style).indexOf('animationDirection')", "-1");
+shouldNotBe("Object.keys(style).indexOf('webkitAnimationDirection')", "-1");
+shouldBe("style.animationDirection", "'reverse'");
+// FIXME : https://code.google.com/p/chromium/issues/detail?id=271573
+//shouldBe("computedStyle.animationDirection", "'reverse'");
+shouldBe("style.webkitAnimationDirection", "'reverse'");
+//shouldBe("computedStyle.webkitAnimationDirection", "'reverse'");
+
+style.animationDirection = "normal";
+shouldBe("style.animationDirection", "'normal'");
+shouldBe("computedStyle.animationDirection", "'normal'");
+shouldBe("style.webkitAnimationDirection", "'normal'");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal'");
+
+style.animationDirection = "normal, alternate";
+shouldBe("style.animationDirection", "'normal, alternate'");
+shouldBe("computedStyle.animationDirection", "'normal, alternate'");
+shouldBe("style.webkitAnimationDirection", "'normal, alternate'");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal, alternate'");
+
+style.animationDirection = "alternate";
+shouldBe("style.animationDirection", "'alternate'");
+shouldBe("computedStyle.animationDirection", "'alternate'");
+shouldBe("style.webkitAnimationDirection", "'alternate'");
+shouldBe("computedStyle.webkitAnimationDirection", "'alternate'");
+
+style.animationDirection = "alternate-reverse";
+shouldBe("style.animationDirection", "'alternate-reverse'");
+// FIXME : https://code.google.com/p/chromium/issues/detail?id=271573
+//shouldBe("computedStyle.animationDirection", "'alternate-reverse'");
+shouldBe("style.webkitAnimationDirection", "'alternate-reverse'");
+//shouldBe("computedStyle.webkitAnimationDirection", "'alternate-reverse'");
+
+debug("Invalid animation-direction values.");
+style.animationDirection = "";
+
+style.animationDirection = "solid";
+shouldBe("style.animationDirection", "''");
+shouldBe("computedStyle.animationDirection", "'normal'");
+shouldBe("style.webkitAnimationDirection", "''");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal'");
+
+style.animationDirection = "0";
+shouldBe("style.animationDirection", "''");
+shouldBe("computedStyle.animationDirection", "'normal'");
+shouldBe("style.webkitAnimationDirection", "''");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal'");
+
+style.animationDirection = "3px";
+shouldBe("style.animationDirection", "''");
+shouldBe("computedStyle.animationDirection", "'normal'");
+shouldBe("style.webkitAnimationDirection", "''");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal'");
+
+style.animationDirection = "alternate-normal";
+shouldBe("style.animationDirection", "''");
+shouldBe("computedStyle.animationDirection", "'normal'");
+shouldBe("style.webkitAnimationDirection", "''");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal'");
+
+style.animationDirection = "3.5";
+shouldBe("style.animationDirection", "''");
+shouldBe("computedStyle.animationDirection", "'normal'");
+shouldBe("style.webkitAnimationDirection", "''");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal'");
+
+style.animationDirection = "3.5, reverse";
+shouldBe("style.animationDirection", "''");
+shouldBe("computedStyle.animationDirection", "'normal'");
+shouldBe("style.webkitAnimationDirection", "''");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal'");
+
+style.animationDirection = "reverse, solid";
+shouldBe("style.animationDirection", "''");
+shouldBe("computedStyle.animationDirection", "'normal'");
+shouldBe("style.webkitAnimationDirection", "''");
+shouldBe("computedStyle.webkitAnimationDirection", "'normal'");
+
+debug("Valid animation-play-state values.");
+// Initial test.
+shouldBe("computedStyle.animationPlayState", "'running'");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running'");
+
+style.animationPlayState = "paused";
+shouldNotBe("Object.keys(style).indexOf('animationPlayState')", "-1");
+shouldNotBe("Object.keys(style).indexOf('webkitAnimationPlayState')", "-1");
+shouldBe("style.animationPlayState", "'paused'");
+shouldBe("computedStyle.animationPlayState", "'paused'");
+shouldBe("style.webkitAnimationPlayState", "'paused'");
+shouldBe("computedStyle.webkitAnimationPlayState", "'paused'");
+
+style.animationPlayState = "running";
+shouldBe("style.animationPlayState", "'running'");
+shouldBe("computedStyle.animationPlayState", "'running'");
+shouldBe("style.webkitAnimationPlayState", "'running'");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running'");
+
+style.animationPlayState = "running, running";
+shouldBe("style.animationPlayState", "'running, running'");
+shouldBe("computedStyle.animationPlayState", "'running, running'");
+shouldBe("style.webkitAnimationPlayState", "'running, running'");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running, running'");
+
+style.animationPlayState = "paused, paused";
+shouldBe("style.animationPlayState", "'paused, paused'");
+shouldBe("computedStyle.animationPlayState", "'paused, paused'");
+shouldBe("style.webkitAnimationPlayState", "'paused, paused'");
+shouldBe("computedStyle.webkitAnimationPlayState", "'paused, paused'");
+
+style.animationPlayState = "paused, running";
+shouldBe("style.animationPlayState", "'paused, running'");
+shouldBe("computedStyle.animationPlayState", "'paused, running'");
+shouldBe("style.webkitAnimationPlayState", "'paused, running'");
+shouldBe("computedStyle.webkitAnimationPlayState", "'paused, running'");
+
+debug("Invalid animation-play-state values.");
+style.animationPlayState = "";
+
+style.animationPlayState = "running3";
+shouldBe("style.animationPlayState", "''");
+shouldBe("computedStyle.animationPlayState", "'running'");
+shouldBe("style.webkitAnimationPlayState", "''");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running'");
+
+style.animationPlayState = "0";
+shouldBe("style.animationPlayState", "''");
+shouldBe("computedStyle.animationPlayState", "'running'");
+shouldBe("style.webkitAnimationPlayState", "''");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running'");
+
+style.animationPlayState = "solid";
+shouldBe("style.animationPlayState", "''");
+shouldBe("computedStyle.animationPlayState", "'running'");
+shouldBe("style.webkitAnimationPlayState", "''");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running'");
+
+style.animationPlayState = "20px";
+shouldBe("style.animationPlayState", "''");
+shouldBe("computedStyle.animationPlayState", "'running'");
+shouldBe("style.webkitAnimationPlayState", "''");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running'");
+
+style.animationPlayState = "all";
+shouldBe("style.animationPlayState", "''");
+shouldBe("computedStyle.animationPlayState", "'running'");
+shouldBe("style.webkitAnimationPlayState", "''");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running'");
+
+style.animationPlayState = "running, test";
+shouldBe("style.animationPlayState", "''");
+shouldBe("computedStyle.animationPlayState", "'running'");
+shouldBe("style.webkitAnimationPlayState", "''");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running'");
+
+style.animationPlayState = "all, paused";
+shouldBe("style.animationPlayState", "''");
+shouldBe("computedStyle.animationPlayState", "'running'");
+shouldBe("style.webkitAnimationPlayState", "''");
+shouldBe("computedStyle.webkitAnimationPlayState", "'running'");
+
+debug("Valid animation-fill-mode values.");
+// Initial test.
+shouldBe("computedStyle.animationFillMode", "'none'");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none'");
+
+style.animationFillMode = "forwards";
+shouldNotBe("Object.keys(style).indexOf('animationFillMode')", "-1");
+shouldNotBe("Object.keys(style).indexOf('webkitAnimationFillMode')", "-1");
+shouldBe("style.animationFillMode", "'forwards'");
+shouldBe("computedStyle.animationFillMode", "'forwards'");
+shouldBe("style.webkitAnimationFillMode", "'forwards'");
+shouldBe("computedStyle.webkitAnimationFillMode", "'forwards'");
+
+style.animationFillMode = "backwards";
+shouldBe("style.animationFillMode", "'backwards'");
+shouldBe("computedStyle.animationFillMode", "'backwards'");
+shouldBe("style.webkitAnimationFillMode", "'backwards'");
+shouldBe("computedStyle.webkitAnimationFillMode", "'backwards'");
+
+style.animationFillMode = "both";
+shouldBe("style.animationFillMode", "'both'");
+shouldBe("computedStyle.animationFillMode", "'both'");
+shouldBe("style.webkitAnimationFillMode", "'both'");
+shouldBe("computedStyle.webkitAnimationFillMode", "'both'");
+
+style.animationFillMode = "none";
+shouldBe("style.animationFillMode", "'none'");
+shouldBe("computedStyle.animationFillMode", "'none'");
+shouldBe("style.webkitAnimationFillMode", "'none'");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none'");
+
+style.animationFillMode = "none, both";
+shouldBe("style.animationFillMode", "'none, both'");
+shouldBe("computedStyle.animationFillMode", "'none, both'");
+shouldBe("style.webkitAnimationFillMode", "'none, both'");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none, both'");
+
+style.animationFillMode = "backwards, forwards";
+shouldBe("style.animationFillMode", "'backwards, forwards'");
+shouldBe("computedStyle.animationFillMode", "'backwards, forwards'");
+shouldBe("style.webkitAnimationFillMode", "'backwards, forwards'");
+shouldBe("computedStyle.webkitAnimationFillMode", "'backwards, forwards'");
+
+debug("Invalid animation-fill-mode values.");
+style.animationFillMode = "";
+
+style.animationFillMode = "foo";
+shouldBe("style.animationFillMode", "''");
+shouldBe("computedStyle.animationFillMode", "'none'");
+shouldBe("style.webkitAnimationFillMode", "''");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none'");
+
+style.animationFillMode = "0";
+shouldBe("style.animationFillMode", "''");
+shouldBe("computedStyle.animationFillMode", "'none'");
+shouldBe("style.webkitAnimationFillMode", "''");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none'");
+
+style.animationFillMode = "-";
+shouldBe("style.animationFillMode", "''");
+shouldBe("computedStyle.animationFillMode", "'none'");
+shouldBe("style.webkitAnimationFillMode", "''");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none'");
+
+style.animationFillMode = "3px";
+shouldBe("style.animationFillMode", "''");
+shouldBe("computedStyle.animationFillMode", "'none'");
+shouldBe("style.webkitAnimationFillMode", "''");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none'");
+
+style.animationFillMode = "backwards, test";
+shouldBe("style.animationFillMode", "''");
+shouldBe("computedStyle.animationFillMode", "'none'");
+shouldBe("style.webkitAnimationFillMode", "''");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none'");
+
+style.animationFillMode = "test, all";
+shouldBe("style.animationFillMode", "''");
+shouldBe("computedStyle.animationFillMode", "'none'");
+shouldBe("style.webkitAnimationFillMode", "''");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none'");
+
+style.animationFillMode = "test, none";
+shouldBe("style.animationFillMode", "''");
+shouldBe("computedStyle.animationFillMode", "'none'");
+shouldBe("style.webkitAnimationFillMode", "''");
+shouldBe("computedStyle.webkitAnimationFillMode", "'none'");
+
+// FIXME : Add tests for shorthand parsing.
+// https://code.google.com/p/chromium/issues/detail?id=234612
+
+document.body.removeChild(testContainer);
+</script>
+<script src="../fast/js/resources/js-test-post.js"></script>
+</body>
+</html>
« no previous file with comments | « no previous file | LayoutTests/animations/animations-parsing-expected.txt » ('j') | Source/core/css/CSSParser-in.cpp » ('J')

Powered by Google App Engine
This is Rietveld 408576698