Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(775)

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

Issue 2241993002: CSS Motion Path: New names for properties (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: rebase Created 4 years, 3 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
OLDNEW
(Empty)
1 <!DOCTYPE html>
suzyh_UTC10 (ex-contributor) 2016/09/19 01:21:04 I'm surprised these tests didn't already exist for
Eric Willigers 2016/09/19 01:54:40 I am copying the existing tests. motion-path.html
suzyh_UTC10 (ex-contributor) 2016/09/19 03:32:30 Oh, codereview just showed them up as completely n
2 <html>
3 <head>
4 <script src="../../resources/testharness.js"></script>
5 <script src="../../resources/testharnessreport.js"></script>
6 <style>
7 #div2 {
8 offset: none 50% auto 400grad;
9 }
10 #div3 {
11 offset: path('M 10 20 h 30 v 150') 70px 0rad;
12 }
13 #div4 {
14 offset: none 10px 90deg reverse;
15 }
alancutter (OOO until 2018) 2016/09/19 00:49:54 These tests would be easier to read if the offset
Eric Willigers 2016/09/19 01:54:40 Sure, I can refactor when adding new tests. For th
alancutter (OOO until 2018) 2016/09/19 04:20:02 Ah, didn't realise this was a copy + rename. Never
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="offset: path('M 1 2 V 3') 4px 5deg"></span>
24 <script>
25 "use strict";
26
27 test(function() {
28 assert_equals(getComputedStyle(div1, null).offsetPath, 'none');
29 assert_equals(getComputedStyle(div1, null).offsetDistance, '0px');
30 assert_equals(getComputedStyle(div1, null).offsetRotation, 'auto 0deg');
31 assert_equals(getComputedStyle(div1, null).offset, 'none 0px auto 0deg');
32 assert_equals(getComputedStyle(div1, null).transform, 'none');
33 }, 'offset default is none 0px auto 0deg');
34
35 test(function() {
36 assert_equals(getComputedStyle(div2, null).offsetPath, 'none');
37 assert_equals(getComputedStyle(div2, null).offsetDistance, '50%');
38 assert_equals(getComputedStyle(div2, null).offsetRotation, 'auto 360deg');
39 assert_equals(getComputedStyle(div2, null).offset, 'none 50% auto 360deg');
40 assert_equals(getComputedStyle(div2, null).transform, 'none');
41 }, 'offset supports various angle units');
42
43 test(function() {
44 assert_equals(getComputedStyle(div3, null).offsetPath, "path('M 10 20 h 30 v 150')");
45 assert_equals(getComputedStyle(div3, null).offsetDistance, '70px');
46 assert_equals(getComputedStyle(div3, null).offsetRotation, '0deg');
47 assert_equals(getComputedStyle(div3, null).offset, "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 }, 'offset supports SVG path data');
50
51 test(function() {
52 assert_equals(getComputedStyle(div4, null).offsetPath, 'none');
53 assert_equals(getComputedStyle(div4, null).offsetDistance, '10px');
54 assert_equals(getComputedStyle(div4, null).offsetRotation, 'auto 270deg');
55 assert_equals(getComputedStyle(div4, null).offset, 'none 10px auto 270deg');
56 assert_equals(getComputedStyle(div4, null).transform, 'none');
57 }, 'offset property data can be supplied in any order');
58
59 test(function() {
60 assert_equals(span1.style.offsetPath, "path('M 1 2 V 3')");
61 assert_equals(span1.style.offsetDistance, '4px');
62 assert_equals(span1.style.offsetRotation, '5deg');
63 assert_equals(span1.style.offset, "path('M 1 2 V 3') 4px 5deg");
64 assert_equals(span1.style.transform, '');
65 }, 'offset style can be set inline');
66
67 </script>
68 </body>
69 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698