LayoutTests/animations/interpolation/background-size-interpolation.html - Issue 1265873002: Add test coverage for interpolations using CSS wide keywords and neutral keyframes

Side by Side Diff: LayoutTests/animations/interpolation/background-size-interpolation.html

Issue 1265873002: Add test coverage for interpolations using CSS wide keywords and neutral keyframes (Closed) Base URL: svn://svn.chromium.org/blink/trunk

Patch Set: Rebased Created 5 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 unified diff | Download patch | Annotate | Revision Log

« no previous file with comments | « LayoutTests/animations/interpolation/background-position-origin-interpolation-expected.txt ('k') | LayoutTests/animations/interpolation/background-size-interpolation-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!DOCTYPE html>	1 <!DOCTYPE html>

2 <meta charset="UTF-8">	2 <meta charset="UTF-8">

3 <style>	3 <style>

	4 .parent {

	5 background-size: 100px 100px;

	6 }

4 .target {	7 .target {

5 width: 80px;	8 width: 80px;

6 height: 100px;	9 height: 100px;

7 display: inline-block;	10 display: inline-block;

8 border: 10px solid black;	11 border: 10px solid black;

9 background-repeat: no-repeat;	12 background-repeat: no-repeat;

10 background-image: url(../resources/stripes-100.png),	13 background-image: url(../resources/stripes-100.png),

11 url(../resources/stripes-100.png),	14 url(../resources/stripes-100.png),

12 url(../resources/blue-100.png),	15 url(../resources/blue-100.png),

13 url(../resources/green-100.png);	16 url(../resources/green-100.png);

14 background-position: left top, right top, left bottom, right bottom;	17 background-position: left top, right top, left bottom, right bottom;

	18 background-size: 10px 10px;

15 }	19 }

16 .expected {	20 .expected {

17 margin-right: 10px;	21 margin-right: 10px;

18 border-color: green;	22 border-color: green;

19 }	23 }

20 </style>	24 </style>

21 <body>	25 <body>

22 <script src="resources/interpolation-test.js"></script>	26 <script src="resources/interpolation-test.js"></script>

23 <script>	27 <script>

	28 // neutral

	29 assertInterpolation({

	30 property: 'background-size',

	31 from: '',

	32 to: '20px 20px, 0px 0px',

	33 }, [

	34 {at: -0.25, is: ' 7.5px 7.5px, 12.5px 12.5px, 7.5px 7.5px, 12.5px 12.5px'},

	35 {at: 0, is: '10.0px 10.0px, 10.0px 10.0px, 10.0px 10.0px, 10.0px 10.0px'},

	36 {at: 0.25, is: '12.5px 12.5px, 7.5px 7.5px, 12.5px 12.5px, 7.5px 7.5px'},

	37 {at: 0.5, is: '15.0px 15.0px, 5.0px 5.0px, 15.0px 15.0px, 5.0px 5.0px'},

	38 {at: 0.75, is: '17.5px 17.5px, 2.5px 2.5px, 17.5px 17.5px, 2.5px 2.5px'},

	39 {at: 1, is: '20.0px 20.0px, 0.0px 0.0px, 20.0px 20.0px, 0.0px 0.0px'},

	40 {at: 1.25, is: '22.5px 22.5px, 0.0px 0.0px, 22.5px 22.5px, 0.0px 0.0px'},

	41 ]);

	42

	43 // initial

	44 // TODO(alancutter): Fix transitions: https://crbug.com/513127

	45 assertNoInterpolation({

	46 property: 'background-size',

	47 from: 'initial',

	48 to: '20px 20px, 0px 0px',

	49 });

	50

	51 // inherit

	52 assertInterpolation({

	53 property: 'background-size',

	54 from: 'inherit',

	55 to: '20px 20px, 0px 0px',

	56 }, [

	57 {at: -0.25, is: '120px 120px, 125px 125px, 120px 120px, 125px 125px'},

	58 {at: 0, is: '100px 100px, 100px 100px, 100px 100px, 100px 100px'},

	59 {at: 0.25, is: ' 80px 80px, 75px 75px, 80px 80px, 75px 75px'},

	60 {at: 0.5, is: ' 60px 60px, 50px 50px, 60px 60px, 50px 50px'},

	61 {at: 0.75, is: ' 40px 40px, 25px 25px, 40px 40px, 25px 25px'},

	62 {at: 1, is: ' 20px 20px, 0px 0px, 20px 20px, 0px 0px'},

	63 {at: 1.25, is: ' 0px 0px, 0px 0px, 0px 0px, 0px 0px'},

	64 ]);

	65

	66 // unset

	67 // TODO(alancutter): Fix transitions: https://crbug.com/513127

	68 assertNoInterpolation({

	69 property: 'background-size',

	70 from: 'unset',

	71 to: '20px 20px, 0px 0px',

	72 });

	73

24 // Matched keywords in size value list.	74 // Matched keywords in size value list.

25 assertNoInterpolation({	75 assertNoInterpolation({

26 property: 'background-size',	76 property: 'background-size',

27 from: '0px 0px, 0px 0px, contain, cover',	77 from: '0px 0px, 0px 0px, contain, cover',

28 to: '40px 40px, 40px 40px, contain, cover',	78 to: '40px 40px, 40px 40px, contain, cover',

29 });	79 });

30	80

31 // Mismatched keywords in size value list.	81 // Mismatched keywords in size value list.

32 assertNoInterpolation({	82 assertNoInterpolation({

33 property: 'background-size',	83 property: 'background-size',

(...skipping 40 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
74 {at: -0.25, is: ' 0px 0px, 80px 0px, 0px 0px, 90px 0px'},	124 {at: -0.25, is: ' 0px 0px, 80px 0px, 0px 0px, 90px 0px'},

75 {at: 0, is: ' 0px 0px, 80px 0px, 0px 0px, 80px 0px'},	125 {at: 0, is: ' 0px 0px, 80px 0px, 0px 0px, 80px 0px'},

76 {at: 0.25, is: '10px 10px, 80px 20px, 0px 20px, 70px 10px'},	126 {at: 0.25, is: '10px 10px, 80px 20px, 0px 20px, 70px 10px'},

77 {at: 0.5, is: '20px 20px, 80px 40px, 0px 40px, 60px 20px'},	127 {at: 0.5, is: '20px 20px, 80px 40px, 0px 40px, 60px 20px'},

78 {at: 0.75, is: '30px 30px, 80px 60px, 0px 60px, 50px 30px'},	128 {at: 0.75, is: '30px 30px, 80px 60px, 0px 60px, 50px 30px'},

79 {at: 1, is: '40px 40px, 80px 80px, 0px 80px, 40px 40px'},	129 {at: 1, is: '40px 40px, 80px 80px, 0px 80px, 40px 40px'},

80 {at: 1.25, is: '50px 50px, 80px 100px, 0px 100px, 30px 50px'},	130 {at: 1.25, is: '50px 50px, 80px 100px, 0px 100px, 30px 50px'},

81 ]);	131 ]);

82 </script>	132 </script>

83 </body>	133 </body>

OLD	NEW