| Index: LayoutTests/animations/interpolation/background-position-interpolation.html
|
| diff --git a/LayoutTests/animations/interpolation/background-position-interpolation.html b/LayoutTests/animations/interpolation/background-position-interpolation.html
|
| index ca5e228f02965304378208d76d77e2ae039c2006..c384e9ed34a3390740de5226246ec9a46d4ce2be 100644
|
| --- a/LayoutTests/animations/interpolation/background-position-interpolation.html
|
| +++ b/LayoutTests/animations/interpolation/background-position-interpolation.html
|
| @@ -1,6 +1,9 @@
|
| <!DOCTYPE html>
|
| <meta charset="UTF-8">
|
| <style>
|
| +.parent {
|
| + background-position: 60px 60px;
|
| +}
|
| .target {
|
| width: 120px;
|
| height: 120px;
|
| @@ -11,6 +14,7 @@
|
| radial-gradient(20px circle at 20px 20px, yellow 18px, transparent),
|
| radial-gradient(20px circle at 20px 20px, lime 18px, transparent),
|
| radial-gradient(20px circle at 20px 20px, blue 18px, transparent);
|
| + background-position: 40px 40px;
|
| }
|
| .expected {
|
| margin-right: 10px;
|
| @@ -19,6 +23,62 @@
|
| <body>
|
| <script src="resources/interpolation-test.js"></script>
|
| <script>
|
| +assertInterpolation({
|
| + property: 'background-position',
|
| + from: '',
|
| + to: '80px 80px, 80px 80px, 80px 80px, 80px 80px',
|
| +}, [
|
| + {at: -0.25, is: '30px 30px, 30px 30px, 30px 30px, 30px 30px'},
|
| + {at: 0, is: '40px 40px, 40px 40px, 40px 40px, 40px 40px'},
|
| + {at: 0.25, is: '50px 50px, 50px 50px, 50px 50px, 50px 50px'},
|
| + {at: 0.5, is: '60px 60px, 60px 60px, 60px 60px, 60px 60px'},
|
| + {at: 0.75, is: '70px 70px, 70px 70px, 70px 70px, 70px 70px'},
|
| + {at: 1, is: '80px 80px, 80px 80px, 80px 80px, 80px 80px'},
|
| + {at: 1.25, is: '90px 90px, 90px 90px, 90px 90px, 90px 90px'},
|
| +]);
|
| +
|
| +assertInterpolation({
|
| + property: 'background-position',
|
| + from: 'initial',
|
| + to: '80px 80px, 80px 80px, 80px 80px, 80px 80px',
|
| +}, [
|
| + {at: -0.25, is: '-20px -20px, -20px -20px, -20px -20px, -20px -20px'},
|
| + {at: 0, is: ' 0% 0% , 0% 0% , 0% 0% , 0% 0% '}, // TODO(alancutter): Should these be 0px?
|
| + {at: 0.25, is: ' 20px 20px, 20px 20px, 20px 20px, 20px 20px'},
|
| + {at: 0.5, is: ' 40px 40px, 40px 40px, 40px 40px, 40px 40px'},
|
| + {at: 0.75, is: ' 60px 60px, 60px 60px, 60px 60px, 60px 60px'},
|
| + {at: 1, is: ' 80px 80px, 80px 80px, 80px 80px, 80px 80px'},
|
| + {at: 1.25, is: '100px 100px, 100px 100px, 100px 100px, 100px 100px'},
|
| +]);
|
| +
|
| +assertInterpolation({
|
| + property: 'background-position',
|
| + from: 'inherit',
|
| + to: '80px 80px, 80px 80px, 80px 80px, 80px 80px',
|
| +}, [
|
| + {at: -0.25, is: '55px 55px, 55px 55px, 55px 55px, 55px 55px'},
|
| + {at: 0, is: '60px 60px, 60px 60px, 60px 60px, 60px 60px'},
|
| + {at: 0.25, is: '65px 65px, 65px 65px, 65px 65px, 65px 65px'},
|
| + {at: 0.5, is: '70px 70px, 70px 70px, 70px 70px, 70px 70px'},
|
| + {at: 0.75, is: '75px 75px, 75px 75px, 75px 75px, 75px 75px'},
|
| + {at: 1, is: '80px 80px, 80px 80px, 80px 80px, 80px 80px'},
|
| + {at: 1.25, is: '85px 85px, 85px 85px, 85px 85px, 85px 85px'},
|
| +]);
|
| +
|
| +assertInterpolation({
|
| + property: 'background-position',
|
| + from: 'unset',
|
| + to: '80px 80px, 80px 80px, 80px 80px, 80px 80px',
|
| +}, [
|
| + {at: -0.25, is: '-20px -20px, -20px -20px, -20px -20px, -20px -20px'},
|
| + {at: 0, is: ' 0% 0% , 0% 0% , 0% 0% , 0% 0% '},
|
| + {at: 0.25, is: ' 20px 20px, 20px 20px, 20px 20px, 20px 20px'},
|
| + {at: 0.5, is: ' 40px 40px, 40px 40px, 40px 40px, 40px 40px'},
|
| + {at: 0.75, is: ' 60px 60px, 60px 60px, 60px 60px, 60px 60px'},
|
| + {at: 1, is: ' 80px 80px, 80px 80px, 80px 80px, 80px 80px'},
|
| + {at: 1.25, is: '100px 100px, 100px 100px, 100px 100px, 100px 100px'},
|
| +]);
|
| +
|
| // Test equal number of position values as background images.
|
| assertInterpolation({
|
| property: 'background-position',
|
|
|
Chromium Code Reviews
Issue 1265873002:
Add test coverage for interpolations using CSS wide keywords and neutral keyframes (Closed)
Base URL: svn://svn.chromium.org/blink/trunk