Add tests to cover what transition-timing-function accepts for cubic-bezier values.
authoralexis@webkit.org <alexis@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 3 Jan 2013 19:05:44 +0000 (19:05 +0000)
committeralexis@webkit.org <alexis@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 3 Jan 2013 19:05:44 +0000 (19:05 +0000)
https://bugs.webkit.org/show_bug.cgi?id=105426

Reviewed by Simon Fraser.

http://www.w3.org/TR/css3-transitions/#transition-timing-function-property
has not yet been updated following the discussions
http://lists.w3.org/Archives/Public/www-style/2010Apr/0489.html and
http://lists.w3.org/Archives/Public/www-style/2010Jun/0254.html where
the range restriction of Y values for cubic-bezier type has been
removed. This patch add tests to cover that behavior to avoid breakage
in the future and test also various other different cubic-bezier use
cases.

* transitions/transitions-parsing-expected.txt:
* transitions/transitions-parsing.html:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@138721 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/transitions/transitions-parsing-expected.txt
LayoutTests/transitions/transitions-parsing.html

index e369978..4b2a172 100644 (file)
@@ -1,3 +1,22 @@
+2013-01-03  Alexis Menard  <alexis@webkit.org>
+
+        Add tests to cover what transition-timing-function accepts for cubic-bezier values.
+        https://bugs.webkit.org/show_bug.cgi?id=105426
+
+        Reviewed by Simon Fraser.
+
+        http://www.w3.org/TR/css3-transitions/#transition-timing-function-property
+        has not yet been updated following the discussions
+        http://lists.w3.org/Archives/Public/www-style/2010Apr/0489.html and
+        http://lists.w3.org/Archives/Public/www-style/2010Jun/0254.html where
+        the range restriction of Y values for cubic-bezier type has been
+        removed. This patch add tests to cover that behavior to avoid breakage
+        in the future and test also various other different cubic-bezier use
+        cases.
+
+        * transitions/transitions-parsing-expected.txt:
+        * transitions/transitions-parsing.html:
+
 2013-01-03  Ryosuke Niwa  <rniwa@webkit.org>
 
         Update Mac test expectations after merging the bug 105987 into the bug 105986.
index c7baf9c..bdeb127 100644 (file)
@@ -118,6 +118,34 @@ PASS style.transitionTimingFunction is 'cubic-bezier(0.1, 0, 0.23, 0.4)'
 PASS computedStyle.transitionTimingFunction is 'cubic-bezier(0.1, 0, 0.23, 0.4)'
 PASS style.webkitTransitionTimingFunction is 'cubic-bezier(0.1, 0, 0.23, 0.4)'
 PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(0.1, 0, 0.23, 0.4)'
+PASS style.transitionTimingFunction is 'cubic-bezier(0.1, 0, 0.23, 3)'
+PASS computedStyle.transitionTimingFunction is 'cubic-bezier(0.1, 0, 0.23, 3)'
+PASS style.webkitTransitionTimingFunction is 'cubic-bezier(0.1, 0, 0.23, 3)'
+PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(0.1, 0, 0.23, 3)'
+PASS style.transitionTimingFunction is 'cubic-bezier(0.1, 5, 0.23, 3)'
+PASS computedStyle.transitionTimingFunction is 'cubic-bezier(0.1, 5, 0.23, 3)'
+PASS style.webkitTransitionTimingFunction is 'cubic-bezier(0.1, 5, 0.23, 3)'
+PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(0.1, 5, 0.23, 3)'
+PASS style.transitionTimingFunction is 'cubic-bezier(0.1, 5, 0.23, 0)'
+PASS computedStyle.transitionTimingFunction is 'cubic-bezier(0.1, 5, 0.23, 0)'
+PASS style.webkitTransitionTimingFunction is 'cubic-bezier(0.1, 5, 0.23, 0)'
+PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(0.1, 5, 0.23, 0)'
+PASS style.transitionTimingFunction is 'cubic-bezier(0.2, 2, 0.2, -0.4)'
+PASS computedStyle.transitionTimingFunction is 'cubic-bezier(0.2, 2, 0.2, -0.4)'
+PASS style.webkitTransitionTimingFunction is 'cubic-bezier(0.2, 2, 0.2, -0.4)'
+PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(0.2, 2, 0.2, -0.4)'
+PASS style.transitionTimingFunction is 'cubic-bezier(0.2, -2, 0.2, 0.4)'
+PASS computedStyle.transitionTimingFunction is 'cubic-bezier(0.2, -2, 0.2, 0.4)'
+PASS style.webkitTransitionTimingFunction is 'cubic-bezier(0.2, -2, 0.2, 0.4)'
+PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(0.2, -2, 0.2, 0.4)'
+PASS style.transitionTimingFunction is 'cubic-bezier(3, 0.1, 4, 1)'
+PASS computedStyle.transitionTimingFunction is 'cubic-bezier(3, 0.1, 4, 1)'
+PASS style.webkitTransitionTimingFunction is 'cubic-bezier(3, 0.1, 4, 1)'
+PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(3, 0.1, 4, 1)'
+PASS style.transitionTimingFunction is 'cubic-bezier(1, 0.1, 3, 1)'
+PASS computedStyle.transitionTimingFunction is 'cubic-bezier(1, 0.1, 3, 1)'
+PASS style.webkitTransitionTimingFunction is 'cubic-bezier(1, 0.1, 3, 1)'
+PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(1, 0.1, 3, 1)'
 PASS style.transitionTimingFunction is 'cubic-bezier(0.1, 0, 4, 0.4)'
 PASS computedStyle.transitionTimingFunction is 'cubic-bezier(0.1, 0, 4, 0.4)'
 PASS style.webkitTransitionTimingFunction is 'cubic-bezier(0.1, 0, 4, 0.4)'
@@ -130,6 +158,14 @@ PASS style.transitionTimingFunction is 'cubic-bezier(3, 0, 0.2, 0.4)'
 PASS computedStyle.transitionTimingFunction is 'cubic-bezier(3, 0, 0.2, 0.4)'
 PASS style.webkitTransitionTimingFunction is 'cubic-bezier(3, 0, 0.2, 0.4)'
 PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(3, 0, 0.2, 0.4)'
+PASS style.transitionTimingFunction is 'cubic-bezier(-0.2, 0, 0.2, 0.4)'
+PASS computedStyle.transitionTimingFunction is 'cubic-bezier(-0.2, 0, 0.2, 0.4)'
+PASS style.webkitTransitionTimingFunction is 'cubic-bezier(-0.2, 0, 0.2, 0.4)'
+PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(-0.2, 0, 0.2, 0.4)'
+PASS style.transitionTimingFunction is 'cubic-bezier(0.2, 2, -0.2, 0.4)'
+PASS computedStyle.transitionTimingFunction is 'cubic-bezier(0.2, 2, -0.2, 0.4)'
+PASS style.webkitTransitionTimingFunction is 'cubic-bezier(0.2, 2, -0.2, 0.4)'
+PASS computedStyle.webkitTransitionTimingFunction is 'cubic-bezier(0.2, 2, -0.2, 0.4)'
 PASS style.transitionTimingFunction is 'step-start'
 PASS computedStyle.transitionTimingFunction is 'steps(1, start)'
 PASS style.webkitTransitionTimingFunction is 'step-start'
index 66ed293..569d4b6 100644 (file)
@@ -239,6 +239,48 @@ shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.1, 0, 0.23,
 shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 0.4)'");
 shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 0.4)'");
 
+style.transitionTimingFunction = "cubic-bezier(0.1, 0, 0.23, 3)";
+shouldBe("style.transitionTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 3)'");
+shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 3)'");
+shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 3)'");
+shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.1, 0, 0.23, 3)'");
+
+style.transitionTimingFunction = "cubic-bezier(0.1, 5, 0.23, 3)";
+shouldBe("style.transitionTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 3)'");
+shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 3)'");
+shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 3)'");
+shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 3)'");
+
+style.transitionTimingFunction = "cubic-bezier(0.1, 5, 0.23, 0)";
+shouldBe("style.transitionTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 0)'");
+shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 0)'");
+shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 0)'");
+shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.1, 5, 0.23, 0)'");
+
+style.transitionTimingFunction = "cubic-bezier(0.2, 2, 0.2, -0.4)";
+shouldBe("style.transitionTimingFunction", "'cubic-bezier(0.2, 2, 0.2, -0.4)'");
+shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.2, 2, 0.2, -0.4)'");
+shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(0.2, 2, 0.2, -0.4)'");
+shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.2, 2, 0.2, -0.4)'");
+
+style.transitionTimingFunction = "cubic-bezier(0.2, -2, 0.2, 0.4)";
+shouldBe("style.transitionTimingFunction", "'cubic-bezier(0.2, -2, 0.2, 0.4)'");
+shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.2, -2, 0.2, 0.4)'");
+shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(0.2, -2, 0.2, 0.4)'");
+shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.2, -2, 0.2, 0.4)'");
+
+style.transitionTimingFunction = "cubic-bezier(3, 0.1, 4, 1)";
+shouldBe("style.transitionTimingFunction", "'cubic-bezier(3, 0.1, 4, 1)'");
+shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(3, 0.1, 4, 1)'");
+shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(3, 0.1, 4, 1)'");
+shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(3, 0.1, 4, 1)'");
+
+style.transitionTimingFunction = "cubic-bezier(1, 0.1, 3, 1)";
+shouldBe("style.transitionTimingFunction", "'cubic-bezier(1, 0.1, 3, 1)'");
+shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(1, 0.1, 3, 1)'");
+shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(1, 0.1, 3, 1)'");
+shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(1, 0.1, 3, 1)'");
+
 style.transitionTimingFunction = "cubic-bezier(0.1, 0, 4, 0.4)";
 shouldBe("style.transitionTimingFunction", "'cubic-bezier(0.1, 0, 4, 0.4)'");
 shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.1, 0, 4, 0.4)'");
@@ -257,6 +299,18 @@ shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(3, 0, 0.2, 0.4
 shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(3, 0, 0.2, 0.4)'");
 shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(3, 0, 0.2, 0.4)'");
 
+style.transitionTimingFunction = "cubic-bezier(-0.2, 0, 0.2, 0.4)";
+shouldBe("style.transitionTimingFunction", "'cubic-bezier(-0.2, 0, 0.2, 0.4)'");
+shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(-0.2, 0, 0.2, 0.4)'");
+shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(-0.2, 0, 0.2, 0.4)'");
+shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(-0.2, 0, 0.2, 0.4)'");
+
+style.transitionTimingFunction = "cubic-bezier(0.2, 2, -0.2, 0.4)";
+shouldBe("style.transitionTimingFunction", "'cubic-bezier(0.2, 2, -0.2, 0.4)'");
+shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.2, 2, -0.2, 0.4)'");
+shouldBe("style.webkitTransitionTimingFunction", "'cubic-bezier(0.2, 2, -0.2, 0.4)'");
+shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.2, 2, -0.2, 0.4)'");
+
 style.transitionTimingFunction = "step-start";
 shouldBe("style.transitionTimingFunction", "'step-start'");
 shouldBe("computedStyle.transitionTimingFunction", "'steps(1, start)'");
@@ -359,19 +413,6 @@ shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.25, 0.1, 0.2
 shouldBe("style.webkitTransitionTimingFunction", "''");
 shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.25, 0.1, 0.25, 1)'");
 
-// Tracked by https://bugs.webkit.org/show_bug.cgi?id=105426.
-/*style.transitionTimingFunction = "cubic-bezier(3, 0.1, 4, 1)";
-shouldBe("style.transitionTimingFunction", "''");
-shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.25, 0.1, 0.25, 1)'");
-shouldBe("style.webkitTransitionTimingFunction", "''");
-shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.25, 0.1, 0.25, 1)'");
-
-style.transitionTimingFunction = "cubic-bezier(1, 0.1, 3, 1)";
-shouldBe("style.transitionTimingFunction", "''");
-shouldBe("computedStyle.transitionTimingFunction", "'cubic-bezier(0.25, 0.1, 0.25, 1)'");
-shouldBe("style.webkitTransitionTimingFunction", "''");
-shouldBe("computedStyle.webkitTransitionTimingFunction", "'cubic-bezier(0.25, 0.1, 0.25, 1)'");*/
-
 debug("Valid transition-delay values.");
 // Initial test.
 shouldBe("computedStyle.transitionDelay", "'0s'");