Diff
Modified: trunk/LayoutTests/ChangeLog (200359 => 200360)
--- trunk/LayoutTests/ChangeLog 2016-05-03 02:58:42 UTC (rev 200359)
+++ trunk/LayoutTests/ChangeLog 2016-05-03 03:39:51 UTC (rev 200360)
@@ -1,3 +1,20 @@
+2016-05-02 Simon Fraser <[email protected]>
+
+ Don't run transitions to/from 'auto' values
+ https://bugs.webkit.org/show_bug.cgi?id=38243
+ rdar://problem/20904225
+
+ Reviewed by Dean Jackson.
+
+ * platform/mac-wk2/transitions/default-timing-function-expected.txt: New baseline.
+ * transitions/default-timing-function.html: Set explicit start value.
+ * transitions/interrupted-all-transition.html: Set explicit start value.
+ * transitions/lengthsize-transition-to-from-auto-expected.txt: Added.
+ * transitions/lengthsize-transition-to-from-auto.html: Added.
+ * transitions/transition-to-from-auto-expected.txt: Added.
+ * transitions/transition-to-from-auto.html: Added.
+ * transitions/zero-duration-in-list.html: Set explicit start value.
+
2016-05-02 Chris Dumez <[email protected]>
Indexing CSSStyleDeclaration object with out-of-range index should return undefined
Modified: trunk/LayoutTests/platform/mac-wk2/transitions/default-timing-function-expected.txt (200359 => 200360)
--- trunk/LayoutTests/platform/mac-wk2/transitions/default-timing-function-expected.txt 2016-05-03 02:58:42 UTC (rev 200359)
+++ trunk/LayoutTests/platform/mac-wk2/transitions/default-timing-function-expected.txt 2016-05-03 03:39:51 UTC (rev 200360)
@@ -4,17 +4,17 @@
RenderBlock {HTML} at (0,0) size 800x252
RenderBody {BODY} at (8,8) size 784x236
RenderBlock {DIV} at (0,200) size 784x36
- RenderText {#text} at (0,0) size 487x18
- text run at (0,0) width 487: "PASS - \"left\" property for \"box\" element at 0.5s saw something close to: 322"
- RenderBR {BR} at (487,0) size 0x18
- RenderText {#text} at (0,18) size 600x18
- text run at (0,18) width 600: "PASS - \"-webkit-transform.4\" property for \"box2\" element at 0.5s saw something close to: 322"
- RenderBR {BR} at (600,18) size 0x18
+ RenderText {#text} at (0,0) size 493x18
+ text run at (0,0) width 493: "PASS - \"left\" property for \"box\" element at 0.5s saw something close to: 322"
+ RenderBR {BR} at (492,0) size 1x18
+ RenderText {#text} at (0,18) size 608x18
+ text run at (0,18) width 608: "PASS - \"-webkit-transform.4\" property for \"box2\" element at 0.5s saw something close to: 322"
+ RenderBR {BR} at (607,18) size 1x18
layer at (8,8) size 784x200
RenderBlock (relative positioned) {DIV} at (0,0) size 784x200
layer at (330,8) size 100x200
RenderBlock (positioned) {DIV} at (322,0) size 100x200 [bgcolor=#FF0000]
-layer at (348,8) size 100x100
+layer at (330,8) size 100x100
RenderBlock (relative positioned) {DIV} at (0,0) size 100x100 [bgcolor=#008000]
layer at (8,108) size 100x100
RenderBlock (relative positioned) {DIV} at (0,100) size 100x100 [bgcolor=#008000]
Modified: trunk/LayoutTests/transitions/default-timing-function.html (200359 => 200360)
--- trunk/LayoutTests/transitions/default-timing-function.html 2016-05-03 02:58:42 UTC (rev 200359)
+++ trunk/LayoutTests/transitions/default-timing-function.html 2016-05-03 03:39:51 UTC (rev 200360)
@@ -16,6 +16,7 @@
}
#box {
+ left: 0;
-webkit-transition-property: left;
}
Modified: trunk/LayoutTests/transitions/interrupted-all-transition.html (200359 => 200360)
--- trunk/LayoutTests/transitions/interrupted-all-transition.html 2016-05-03 02:58:42 UTC (rev 200359)
+++ trunk/LayoutTests/transitions/interrupted-all-transition.html 2016-05-03 03:39:51 UTC (rev 200360)
@@ -11,6 +11,7 @@
}
#box {
position: absolute;
+ left: 0;
height: 100px;
width: 100px;
background-color: blue;
Added: trunk/LayoutTests/transitions/lengthsize-transition-to-from-auto-expected.txt (0 => 200360)
--- trunk/LayoutTests/transitions/lengthsize-transition-to-from-auto-expected.txt (rev 0)
+++ trunk/LayoutTests/transitions/lengthsize-transition-to-from-auto-expected.txt 2016-05-03 03:39:51 UTC (rev 200360)
@@ -0,0 +1,4 @@
+PASS - "background-size" property for "test1" element at 1s saw something close to: 55,10
+PASS - "background-size" property for "test2" element at 1s saw something close to: 10
+PASS - "background-size" property for "test3" element at 1s saw something close to: 10,10
+
Added: trunk/LayoutTests/transitions/lengthsize-transition-to-from-auto.html (0 => 200360)
--- trunk/LayoutTests/transitions/lengthsize-transition-to-from-auto.html (rev 0)
+++ trunk/LayoutTests/transitions/lengthsize-transition-to-from-auto.html 2016-05-03 03:39:51 UTC (rev 200360)
@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+ <style>
+ .box {
+ position: relative;
+ height: 100px;
+ width: 100px;
+ margin: 10px;
+ background-color: gray;
+ background-image: url('../fast/backgrounds/repeat/resources/gradient.gif');
+ transition: background-size 2s linear;
+ }
+
+ #test1 {
+ background-size: 10px 10px;
+ }
+
+ body.final #test1 {
+ background-size: 100px 10px;
+ }
+
+ #test2 {
+ background-size: auto 10px;
+ }
+
+ body.final #test2 {
+ background-size: 10px auto;
+ }
+
+ #test3 {
+ background-size: auto auto;
+ }
+
+ body.final #test3 {
+ background-size: 10px 10px;
+ }
+ </style>
+ <script src=""
+ <script type="text/_javascript_">
+
+ const expectedValues = [
+ // [time, element-id, property, expected-value, tolerance]
+ [1, 'test1', 'background-size', [55, 10], 2],
+ [1, 'test2', 'background-size', [10], 2],
+ [1, 'test3', 'background-size', [10,10], 2],
+ ];
+
+ function setupTest()
+ {
+ document.body.classList.add('final');
+ }
+
+ runTransitionTest(expectedValues, setupTest, usePauseAPI);
+ </script>
+</head>
+<body>
+ <div id="test1" class="box"></div>
+ <div id="test2" class="box"></div>
+ <div id="test3" class="box"></div>
+
+ <div id="result"></div>
+</body>
+</html>
Added: trunk/LayoutTests/transitions/transition-to-from-auto-expected.txt (0 => 200360)
--- trunk/LayoutTests/transitions/transition-to-from-auto-expected.txt (rev 0)
+++ trunk/LayoutTests/transitions/transition-to-from-auto-expected.txt 2016-05-03 03:39:51 UTC (rev 200360)
@@ -0,0 +1,4 @@
+PASS - "left" property for "test1" element at 1s saw something close to: auto
+PASS - "left" property for "test2" element at 1s saw something close to: 100
+PASS - "left" property for "test3" element at 1s saw something close to: 50
+
Added: trunk/LayoutTests/transitions/transition-to-from-auto.html (0 => 200360)
--- trunk/LayoutTests/transitions/transition-to-from-auto.html (rev 0)
+++ trunk/LayoutTests/transitions/transition-to-from-auto.html 2016-05-03 03:39:51 UTC (rev 200360)
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+ <style>
+ .box {
+ position: relative;
+ height: 100px;
+ width: 100px;
+ margin: 10px;
+ background-color: gray;
+ transition: left 2s linear;
+ }
+
+ #test1 {
+ left: 100px;
+ }
+
+ body.final #test1 {
+ left: auto;
+ }
+
+ #test2 {
+ left: auto;
+ }
+
+ body.final #test2 {
+ left: 100px
+ }
+
+ #test3 {
+ left: 0;
+ }
+
+ body.final #test3 {
+ left: 100px
+ }
+ </style>
+ <script src=""
+ <script type="text/_javascript_">
+
+ const expectedValues = [
+ // [time, element-id, property, expected-value, tolerance]
+ [1, 'test1', 'left', 'auto', 2],
+ [1, 'test2', 'left', '100', 2],
+ [1, 'test3', 'left', '50', 2],
+ ];
+
+ function setupTest()
+ {
+ document.body.classList.add('final');
+ }
+
+ runTransitionTest(expectedValues, setupTest, usePauseAPI);
+ </script>
+</head>
+<body>
+ <div id="test1" class="box"></div>
+ <div id="test2" class="box"></div>
+ <div id="test3" class="box"></div>
+
+ <div id="result"></div>
+</body>
+</html>
Modified: trunk/LayoutTests/transitions/zero-duration-in-list.html (200359 => 200360)
--- trunk/LayoutTests/transitions/zero-duration-in-list.html 2016-05-03 02:58:42 UTC (rev 200359)
+++ trunk/LayoutTests/transitions/zero-duration-in-list.html 2016-05-03 03:39:51 UTC (rev 200360)
@@ -5,6 +5,7 @@
<style>
#box {
position: absolute;
+ left: 0;
height: 100px;
width: 100px;
background-color: blue;
Modified: trunk/Source/WebCore/ChangeLog (200359 => 200360)
--- trunk/Source/WebCore/ChangeLog 2016-05-03 02:58:42 UTC (rev 200359)
+++ trunk/Source/WebCore/ChangeLog 2016-05-03 03:39:51 UTC (rev 200360)
@@ -1,3 +1,24 @@
+2016-05-02 Simon Fraser <[email protected]>
+
+ Don't run transitions to/from 'auto' values
+ https://bugs.webkit.org/show_bug.cgi?id=38243
+ rdar://problem/20904225
+
+ Reviewed by Dean Jackson.
+
+ The specified behavior of transitions and animations is to not animate when either endpoint is 'auto'.
+ Previously, we were treating 'auto' as zero and interpolating, which caused unwanted animations
+ on fandango.com, airbnb.com and others.
+
+ Fix by having blend() return the from value if progress is 0, otherwise the to value. The
+ isZero() check can be removed, since this was effectively picking up auto value for one endpoint.
+
+ Tests: transitions/lengthsize-transition-to-from-auto.html
+ transitions/transition-to-from-auto.html
+
+ * platform/Length.cpp:
+ (WebCore::blend):
+
2016-05-02 Chris Dumez <[email protected]>
Indexing CSSStyleDeclaration object with out-of-range index should return undefined
Modified: trunk/Source/WebCore/platform/Length.cpp (200359 => 200360)
--- trunk/Source/WebCore/platform/Length.cpp 2016-05-03 02:58:42 UTC (rev 200359)
+++ trunk/Source/WebCore/platform/Length.cpp 2016-05-03 03:39:51 UTC (rev 200360)
@@ -298,15 +298,15 @@
Length blend(const Length& from, const Length& to, double progress)
{
+ if (from.isAuto() || to.isAuto())
+ return progress ? to : from;
+
if (from.type() == Calculated || to.type() == Calculated)
return blendMixedTypes(from, to, progress);
if (!from.isZero() && !to.isZero() && from.type() != to.type())
return blendMixedTypes(from, to, progress);
- if (from.isZero() && to.isZero())
- return progress ? to : from; // Pick up 'auto' from 'from' if progress is zero.
-
LengthType resultType = to.type();
if (to.isZero())
resultType = from.type();
