Allow interpolation of background-size values with keywords in CSS Animations

third_party/WebKit/LayoutTests/animations/interpolation/background-size-interpolation.html

Index: third_party/WebKit/LayoutTests/animations/interpolation/background-size-interpolation.html
diff --git a/third_party/WebKit/LayoutTests/animations/interpolation/background-size-interpolation.html b/third_party/WebKit/LayoutTests/animations/interpolation/background-size-interpolation.html
index 21b01cf0c8e20df350fe51a572244f565c5548db..51d07e9081614ee36d76cab85a662facf7137c57 100644
--- a/third_party/WebKit/LayoutTests/animations/interpolation/background-size-interpolation.html
+++ b/third_party/WebKit/LayoutTests/animations/interpolation/background-size-interpolation.html
@@ -41,7 +41,6 @@ assertInterpolation({
 ]);
 
 // initial
-// TODO(alancutter): Fix transitions: https://crbug.com/513127
 assertNoInterpolation({
   property: 'background-size',
   from: 'initial',
@@ -64,7 +63,6 @@ assertInterpolation({
 ]);
 
 // unset
-// TODO(alancutter): Fix transitions: https://crbug.com/513127

[alancutter (OOO until 2018), 2016/08/25 06:08:16]

These are stale TODOs, bug has been fixed a while ago.

 assertNoInterpolation({
   property: 'background-size',
   from: 'unset',
@@ -74,16 +72,16 @@ assertNoInterpolation({
 // Matched keywords in size value list.
 assertInterpolation({
   property: 'background-size',
-  from: '0px 0px, 0px 0px, contain, cover',
-  to: '40px 40px, 40px 40px, contain, cover',
+  from: '0px auto, 0px 0px, contain, cover',
+  to: '40px auto, 40px 40px, contain, cover',
 }, [
-  {at: -0.25, is: ' 0px  0px,  0px  0px, contain, cover'},
-  {at: 0, is:     ' 0px  0px,  0px  0px, contain, cover'},
-  {at: 0.25, is:  '10px 10px, 10px 10px, contain, cover'},
-  {at: 0.5, is:   '20px 20px, 20px 20px, contain, cover'},
-  {at: 0.75, is:  '30px 30px, 30px 30px, contain, cover'},
-  {at: 1, is:     '40px 40px, 40px 40px, contain, cover'},
-  {at: 1.25, is:  '50px 50px, 50px 50px, contain, cover'},
+  {at: -0.25, is: ' 0px auto,  0px  0px, contain, cover'},
+  {at: 0, is:     ' 0px auto,  0px  0px, contain, cover'},
+  {at: 0.25, is:  '10px auto, 10px 10px, contain, cover'},
+  {at: 0.5, is:   '20px auto, 20px 20px, contain, cover'},
+  {at: 0.75, is:  '30px auto, 30px 30px, contain, cover'},
+  {at: 1, is:     '40px auto, 40px 40px, contain, cover'},
+  {at: 1.25, is:  '50px auto, 50px 50px, contain, cover'},
 ]);
 
 // Mismatched keywords in size value list.
@@ -93,6 +91,12 @@ assertNoInterpolation({
   to: '40px 40px, 40px 40px, cover, contain',
 });
 
+assertNoInterpolation({
+  property: 'background-size',
+  from: '0px auto, 0px 0px',
+  to: 'auto 40px, 40px 40px',
+});
+
 // Equal number of size values as background images.
 assertInterpolation({
   property: 'background-size',
@@ -123,6 +127,20 @@ assertInterpolation({
   {at: 1.25, is:  '100px 100px, 100px 100px, 100px 100px, 100px 100px'},
 ]);
 
+assertInterpolation({
+  property: 'background-size',
+  from: '0px',
+  to: '80px',
+}, [
+  {at: -0.25, is: '  0px,   0px,   0px,   0px'},
+  {at: 0, is:     '  0px,   0px,   0px,   0px'},
+  {at: 0.25, is:  ' 20px,  20px,  20px,  20px'},
+  {at: 0.5, is:   ' 40px,  40px,  40px,  40px'},
+  {at: 0.75, is:  ' 60px,  60px,  60px,  60px'},
+  {at: 1, is:     ' 80px,  80px,  80px,  80px'},
+  {at: 1.25, is:  '100px, 100px, 100px, 100px'},
+]);
+
 // Mismatched numbers of size values.
 assertInterpolation({
   property: 'background-size',