LayoutTests/animations/interpolation/box-shadow-interpolation.html - Issue 851633002: Animation: Add template for ListStyleInterpolation

Side by Side Diff: LayoutTests/animations/interpolation/box-shadow-interpolation.html

Issue 851633002: Animation: Add template for ListStyleInterpolation (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Add else to shadowToInterpolableValue Created 5 years, 10 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

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

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

3 <style>	3 <style>

4 .target {	4 .target {

5 display: inline-block;	5 display: inline-block;

6 width: 60px;	6 width: 60px;

7 height: 60px;	7 height: 60px;

8 font-size: 3px;	8 font-size: 3px;

9 border: 2px solid;	9 border: 2px solid;

10 margin-right: 20px;	10 margin-right: 20px;

(...skipping 13 matching lines...) Expand all Loading...
24 to: '-15px -10px 25px -4px orange'	24 to: '-15px -10px 25px -4px orange'

25 }, [	25 }, [

26 {at: -0.3, is: '24px 16px 0px 9px black'},	26 {at: -0.3, is: '24px 16px 0px 9px black'},

27 {at: 0, is: '15px 10px 5px 6px black'},	27 {at: 0, is: '15px 10px 5px 6px black'},

28 {at: 0.3, is: '6px 4px 11px 3px rgb(77, 50, 0)'},	28 {at: 0.3, is: '6px 4px 11px 3px rgb(77, 50, 0)'},

29 {at: 0.6, is: '-3px -2px 17px 0px rgb(153, 99, 0)'},	29 {at: 0.6, is: '-3px -2px 17px 0px rgb(153, 99, 0)'},

30 {at: 1, is: '-15px -10px 25px -4px orange'},	30 {at: 1, is: '-15px -10px 25px -4px orange'},

31 {at: 1.5, is: '-30px -20px 35px -9px rgb(255, 248, 0)'},	31 {at: 1.5, is: '-30px -20px 35px -9px rgb(255, 248, 0)'},

32 ]);	32 ]);

33	33

	34 assertInterpolation({

	35 property: 'box-shadow',

	36 from: '15px 10px 5px 6px black inset',

	37 to: '-15px -10px 25px -4px orange inset'

	38 }, [

	39 {at: -0.3, is: '24px 16px 0px 9px black inset'},

	40 {at: 0, is: '15px 10px 5px 6px black inset'},

	41 {at: 0.3, is: '6px 4px 11px 3px rgb(77, 50, 0) inset'},

	42 {at: 0.6, is: '-3px -2px 17px 0px rgb(153, 99, 0) inset'},

	43 {at: 1, is: '-15px -10px 25px -4px orange inset'},

	44 {at: 1.5, is: '-30px -20px 35px -9px rgb(255, 248, 0) inset'},

	45 ]);

	46

34 // Test padding shorter lists	47 // Test padding shorter lists

35 assertInterpolation({	48 assertInterpolation({

36 property: 'box-shadow',	49 property: 'box-shadow',

37 from: '10px 20px rgba(255, 255, 0, 0.5), inset 5px 10em #008000',	50 from: '10px 20px rgba(255, 255, 0, 0.5), inset 5px 10em #008000',

38 to: 'none'	51 to: 'none'

39 }, [	52 }, [

40 {at: -0.3, is: '13px 26px rgba(255, 255, 0, 0.65), inset 6.5px 39px rgb(0, 166 , 0)'},	53 {at: -0.3, is: '13px 26px rgba(255, 255, 0, 0.65), inset 6.5px 39px rgb(0, 166 , 0)'},

41 {at: 0, is: '10px 20px rgba(255, 255, 0, 0.5), inset 5px 30px #008000'},	54 {at: 0, is: '10px 20px rgba(255, 255, 0, 0.5), inset 5px 30px #008000'},

42 {at: 0.3, is: '7px 14px rgba(255, 255, 0, 0.35), inset 3.5px 21px rgba(0, 128, 0, 0.7)'},	55 {at: 0.3, is: '7px 14px rgba(255, 255, 0, 0.35), inset 3.5px 21px rgba(0, 128, 0, 0.7)'},

43 {at: 0.6, is: '4px 8px rgba(255, 255, 0, 0.2), inset 2px 12px rgba(0, 128, 0, 0.4)'},	56 {at: 0.6, is: '4px 8px rgba(255, 255, 0, 0.2), inset 2px 12px rgba(0, 128, 0, 0.4)'},

44 {at: 1, is: 'none'},	57 {at: 1, is: 'none'},

45 {at: 1.5, is: '-5px -10px transparent, inset -2.5px -15px transparent'},	58 {at: 1.5, is: '-5px -10px transparent, inset -2.5px -15px transparent'},

46 ]);	59 ]);

47	60

48 // Test unmatched inset	61 // Test unmatched inset

49 assertInterpolation({	62 assertInterpolation({

50 property: 'box-shadow',	63 property: 'box-shadow',

51 from: '10px 20px yellow, 5px 10px green',	64 from: '10px 20px yellow, 5px 10px green',

52 to: 'inset 5px 10px green, 15px 20px blue'	65 to: 'inset 5px 10px green, 15px 20px blue'

53 }, [	66 }, [

54 {at: -0.3, is: '10px 20px yellow, 5px 10px green'},	67 {at: -0.3, is: '10px 20px yellow, 5px 10px green'},

55 {at: 0, is: '10px 20px yellow, 5px 10px green'},	68 {at: 0, is: '10px 20px yellow, 5px 10px green'},

56 {at: 0.3, is: '10px 20px yellow, 5px 10px green'},	69 {at: 0.3, is: '10px 20px yellow, 5px 10px green'},

57 {at: 0.6, is: 'inset 5px 10px green, 15px 20px blue'},	70 {at: 0.6, is: 'inset 5px 10px green, 15px 20px blue'},

58 {at: 1, is: 'inset 5px 10px green, 15px 20px blue'},	71 {at: 1, is: 'inset 5px 10px green, 15px 20px blue'},

59 {at: 1.5, is: 'inset 5px 10px green, 15px 20px blue'},	72 {at: 1.5, is: 'inset 5px 10px green, 15px 20px blue'},

60 ]);	73 ]);

61 </script>	74 </script>

62 </body>	75 </body>

OLD	NEW

« no previous file with comments | « no previous file | LayoutTests/animations/interpolation/box-shadow-interpolation-expected.txt » ('j') | no next file with comments »