third_party/WebKit/LayoutTests/css3/motion-path/motion.html - Issue 2828503002: CSS Motion Path: delete implementation of motion shorthand

Side by Side Diff

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Keyboard Shortcuts

	File
u :	up to issue
j / k :	jump to file after / before current file
J / K :	jump to next file with a comment after / before current file
	Side-by-side diff
i :	toggle intra-line diffs
e :	expand all comments
c :	collapse all comments
s :	toggle showing all comments
n / p :	next / previous diff chunk or comment
N / P :	next / previous comment
<Up> / <Down> :	next / previous line

	Issue
u :	up to list of issues
j / k :	jump to patch after / before current patch
o / <Enter> :	open current patch in side-by-side view
i :	open current patch in unified diff view

	Issue List
j / k :	jump to issue after / before current issue
o / <Enter> :	open current issue

Side by Side Diff: third_party/WebKit/LayoutTests/css3/motion-path/motion.html

Issue 2828503002: CSS Motion Path: delete implementation of motion shorthand (Closed)

Patch Set: test update Created 3 years, 8 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/css3/motion-path/combine-motion-translation-and-rotation-expected.html ('k') | third_party/WebKit/LayoutTests/css3/motion-path/motion-shorthand-deprecated.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 <html>

3 <head>

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

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

6 <style>

7 #div2 {

8 motion: none 50% auto 400grad;

9 }

10 #div3 {

11 motion: path('M 10 20 h 30 v 150') 0rad 70px;

12 }

13 #div4 {

14 motion: 10px 90deg reverse none;

15 }

16 </style>

17 </head>

18 <body>

19 <div id="div1"></div>

20 <div id="div2"></div>

21 <div id="div3"></div>

22 <div id="div4"></div>

23 <span id="span1" style="motion: path('M 1 2 V 3') 4px 5deg"></span>

24 <script>

25 "use strict";

26

27 test(function() {

28 assert_equals(getComputedStyle(div1, null).motionPath, 'none');

29 assert_equals(getComputedStyle(div1, null).motionOffset, '0px');

30 assert_equals(getComputedStyle(div1, null).motionRotation, 'auto 0deg');

31 assert_equals(getComputedStyle(div1, null).motion, 'none 0px auto 0deg');

32 assert_equals(getComputedStyle(div1, null).transform, 'none');

33 }, 'motion default is none 0px auto 0deg');

34

35 test(function() {

36 assert_equals(getComputedStyle(div2, null).motionPath, 'none');

37 assert_equals(getComputedStyle(div2, null).motionOffset, '50%');

38 assert_equals(getComputedStyle(div2, null).motionRotation, 'auto 360deg');

39 assert_equals(getComputedStyle(div2, null).motion, 'none 50% auto 360deg');

40 assert_equals(getComputedStyle(div2, null).transform, 'none');

41 }, 'motion supports various angle units');

42

43 test(function() {

44 assert_equals(getComputedStyle(div3, null).motionPath, "path('M 10 20 h 30 v 150')");

45 assert_equals(getComputedStyle(div3, null).motionOffset, '70px');

46 assert_equals(getComputedStyle(div3, null).motionRotation, '0deg');

47 assert_equals(getComputedStyle(div3, null).motion, "path('M 10 20 h 30 v 150 ') 70px 0deg");

48 assert_equals(getComputedStyle(div3, null).transform, 'matrix(1, 0, 0, 1, 0, 0)');

49 }, 'motion supports SVG path data');

50

51 test(function() {

52 assert_equals(getComputedStyle(div4, null).motionPath, 'none');

53 assert_equals(getComputedStyle(div4, null).motionOffset, '10px');

54 assert_equals(getComputedStyle(div4, null).motionRotation, 'auto 270deg');

55 assert_equals(getComputedStyle(div4, null).motion, 'none 10px auto 270deg');

56 assert_equals(getComputedStyle(div4, null).transform, 'none');

57 }, 'motion property data can be supplied in any order');

58

59 test(function() {

60 assert_equals(span1.style.motionPath, "path('M 1 2 V 3')");

61 assert_equals(span1.style.motionOffset, '4px');

62 assert_equals(span1.style.motionRotation, '5deg');

63 assert_equals(span1.style.motion, "path('M 1 2 V 3') 4px 5deg");

64 assert_equals(span1.style.transform, '');

65 }, 'motion style can be set inline');

66

67 </script>

68 </body>

69 </html>

OLD	NEW