third_party/WebKit/LayoutTests/imported/wpt/web-animations/animation-model/keyframes/effect-value-context.html - Issue 1999243002: Import wpt@5df9b57edb3307a87d5187804b29c8ddd2aa14e1

Side by Side Diff: third_party/WebKit/LayoutTests/imported/wpt/web-animations/animation-model/keyframes/effect-value-context.html

Issue 1999243002: Import wpt@5df9b57edb3307a87d5187804b29c8ddd2aa14e1 (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: Add expectations files (using run-webkit-tests --new-baseline) Created 4 years, 7 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

« no previous file with comments | « third_party/WebKit/LayoutTests/imported/wpt/web-animations/animation-model/keyframe-effects/the-effect-value-of-a-keyframe-effect-expected.txt ('k') | third_party/WebKit/LayoutTests/imported/wpt/web-animations/animation-timeline/document-timeline.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
	(Empty)
1 <!DOCTYPE html>

2 <meta charset=utf-8>

3 <title>Tests that property values respond to changes to their context</title>

4 <link rel="help" href="https://w3c.github.io/web-animations/#keyframes-section">

5 <script src="../../../../../resources/testharness.js"></script>

6 <script src="../../../../../resources/testharnessreport.js"></script>

7 <script src="../../testcommon.js"></script>

8 <link rel="stylesheet" href="../../../../../resources/testharness.css">

9 <body>

10 <div id="log"></div>

11 <script>

12

13 test(function(t) {

14 var div = createDiv(t);

15 div.style.fontSize = '10px';

16 var animation = div.animate([ { marginLeft: '10em' },

17 { marginLeft: '20em' } ], 1000);

18 animation.currentTime = 500;

19 assert_equals(getComputedStyle(div).marginLeft, '150px',

20 'Effect value before updating font-size');

21 div.style.fontSize = '20px';

22 assert_equals(getComputedStyle(div).marginLeft, '300px',

23 'Effect value after updating font-size');

24 }, 'Effect values reflect changes to font-size on element');

25

26 test(function(t) {

27 var parentDiv = createDiv(t);

28 var div = createDiv(t);

29 parentDiv.appendChild(div);

30 parentDiv.style.fontSize = '10px';

31

32 var animation = div.animate([ { marginLeft: '10em' },

33 { marginLeft: '20em' } ], 1000);

34 animation.currentTime = 500;

35 assert_equals(getComputedStyle(div).marginLeft, '150px',

36 'Effect value before updating font-size on parent element');

37 parentDiv.style.fontSize = '20px';

38 assert_equals(getComputedStyle(div).marginLeft, '300px',

39 'Effect value after updating font-size on parent element');

40 }, 'Effect values reflect changes to font-size on parent element');

41

42 promise_test(function(t) {

43 var parentDiv = createDiv(t);

44 var div = createDiv(t);

45 parentDiv.appendChild(div);

46 parentDiv.style.fontSize = '10px';

47 var animation = div.animate([ { marginLeft: '10em' },

48 { marginLeft: '20em' } ], 1000);

49

50 animation.pause();

51 animation.currentTime = 500;

52 parentDiv.style.fontSize = '20px';

53

54 return animation.ready.then(function() {

55 assert_equals(getComputedStyle(div).marginLeft, '300px',

56 'Effect value after updating font-size on parent element');

57 });

58 }, 'Effect values reflect changes to font-size when computed style is not'

59 + ' immediately flushed');

60

61 promise_test(function(t) {

62 var divWith10pxFontSize = createDiv(t);

63 divWith10pxFontSize.style.fontSize = '10px';

64 var divWith20pxFontSize = createDiv(t);

65 divWith20pxFontSize.style.fontSize = '20px';

66

67 var div = createDiv(t);

68 div.remove(); // Detach

69 var animation = div.animate([ { marginLeft: '10em' },

70 { marginLeft: '20em' } ], 1000);

71 animation.pause();

72

73 return animation.ready.then(function() {

74 animation.currentTime = 500;

75

76 divWith10pxFontSize.appendChild(div);

77 assert_equals(getComputedStyle(div).marginLeft, '150px',

78 'Effect value after attaching to font-size:10px parent');

79 divWith20pxFontSize.appendChild(div);

80 assert_equals(getComputedStyle(div).marginLeft, '300px',

81 'Effect value after attaching to font-size:20px parent');

82 });

83 }, 'Effect values reflect changes to font-size from reparenting');

84

85 </script>

86 </body>

OLD	NEW