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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/transforms/2d/transform-2d-properties.html

Issue 1158603003: CSS Independent Transform Properties (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Created 5 years, 6 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 | « LayoutTests/animations/svg-attribute-interpolation/resources/interpolation-test.js ('k') | Source/core/animation/css/CSSAnimatableValueFactory.cpp » ('j') | Source/core/animation/css/CSSAnimatableValueFactory.cpp » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
2 "http://www.w3.org/TR/html4/loose.dtd">
3
4 <html lang="en">
5 <head>
6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
7 <title>2D Transform Tests Separated</title>
8 <style type="text/css" media="screen">
9 .container {
10 height: 100px;
11 width: 200px;
12 margin: 30px;
13 outline: 1px solid black;
14 }
15 .box {
16 height: 100%;
17 width: 100%;
18 background-color: green;
19 transform: rotate(90deg);
20 }
21 #results {
22 margin-top: 100px;
23 }
24 </style>
25 <script type="text/javascript" charset="utf-8">
26 if (window.testRunner) {
27 testRunner.dumpAsText();
28 testRunner.waitUntilDone();
29 }
30
31 var gTests = [
32 // nothing
33 //{ 'transform' : 'none', 'result' : 'none' },
34 //{ 'transform' : 'inherit', 'result' : 'none' }, // parent element doesn' t have transform
Eric Willigers 2015/06/05 01:58:22 Delete this commented out code. You might want a s
35
36 // translate
37 { 'translate' : '', 'result' : 'none' },
Eric Willigers 2015/06/05 01:58:22 0px
38 { 'translate' : '80px 90px', 'result' : '80px, 90px' },
39 { 'translate' : '100% 3em', 'result' : '200px, 90px' }, // depends on f ont size
Eric Willigers 2015/06/05 01:58:22 Your test should set the font-size property.
40 { 'translate' : '50px', 'result' : '50px 0px' },
41
42 // scale
43 { 'scale' : '', 'result' : 'none' },
Eric Willigers 2015/06/05 01:58:22 1
44 { 'scale' : '1.2', 'result' : '1.2' },
45 { 'scale' : '1.2 0.8', 'result' : '1.2, 0.8' },
46 { 'scale' : '-1.2 -0.8', 'result' : '-1.2, -0.8' },
47
48 // rotate
49 { 'rotate' : '', 'result' : 'none' },
Eric Willigers 2015/06/05 01:58:22 0deg
50 { 'rotate' : '45deg', 'result' : '45deg' },
51 { 'rotate' : '90deg', 'result' : '90deg' },
52 { 'rotate' : '-90deg', 'result' : '-90deg' },
53 { 'rotate' : '180deg', 'result' : '180deg' },
54 { 'rotate' : '200grad', 'result' : '180deg' },
55 { 'rotate' : '1.2rad', 'result' : '68.754935deg' }, // Precision l evel?
56
57 { 'rotate' : '0.25turn', 'result' : '90deg' },
58 { 'rotate' : '0.5turn', 'result' : '180deg' },
59 { 'rotate' : '1.5turn', 'result' : '540deg' },
60
61 // invalid translate
62 { 'translate' : ',12deg', 'result' : 'none' }, // has comma
63 { 'translate' : '12deg,', 'result' : 'none' }, // has comma
64 { 'translate' : '12deg +', 'result' : 'none' }, // has plus
65 { 'translate' : '((50, 20))', 'result' : 'none' }, // bad syntax
66 { 'translate' : 'salad(10)', 'result' : 'none' }, // invalid function
67
68 { 'translate' : '50, 20', 'result' : 'none' }, // missing units
69 { 'translate' : '10px 20px 30px', 'result' : 'none' }, // too many argumen ts
70 { 'translate' : '10px 20px 30px 40px', 'result' : 'none' }, // too many ar guments
71 { 'translate' : '10smidgens', 'result' : 'none' }, // invalid units
72 { 'translate' : '10px 10smidgens', 'result' : 'none' }, // invalid units
73
74 // invalid scale
75 { 'scale' : ',12deg', 'result' : 'none' }, // has comma
76 { 'scale' : '12deg,', 'result' : 'none' }, // has comma
77 { 'scale' : '12deg +', 'result' : 'none' }, // has plus
78 { 'scale' : '((50, 20))', 'result' : 'none' }, // bad syntax
79 { 'scale' : 'salad(10)', 'result' : 'none' }, // invalid function
80 { 'scale' : '2px 2px', 'result' : 'none' }, // has units
81 { 'scale' : '2 2px', 'result' : 'none' }, // has units
82 { 'scale' : '1 2 3', 'result' : 'none' }, // too many arguments
83 { 'scale' : '2smidgens', 'result' : 'none' }, // invalid units
84 { 'scale' : '2 2smidgens', 'result' : 'none' }, // invalid units
85
86 // invalid rotate
87 { 'rotate' : ',12deg', 'result' : 'none' }, // has comma
88 { 'rotate' : '12deg,', 'result' : 'none' }, // has comma
89 { 'rotate' : '12deg +', 'result' : 'none' }, // has plus
90 { 'rotate' : '((50, 20))', 'result' : 'none' }, // bad syntax
91 { 'rotate' : 'salad(10)', 'result' : 'none' }, // invalid function
92 { 'rotate' : '10', 'result' : 'none' }, // no units
93 { 'rotate' : '10deg 20deg', 'result' : 'none' }, // too many arguments
94 { 'rotate' : '2turns', 'result' : 'none' }, // invalid units -- 'turn' not 'turns'
95 { 'rotate' : '2spins', 'result' : 'none' }, // invalid units
96 { 'rotate' : '2 2spins', 'result' : 'none' }, // invalid units
97 ];
98
99 function testTransforms()
100 {
101 var testBox = document.getElementById('test-box');
102 var resultsBox = document.getElementById('results');
103
104 gTests.forEach(function(curTest) {
105 testBox.style.translate = 'none';
106 testBox.style.rotate = 'none';
107 testBox.style.scale = 'none';
108
109 var computedTransform = 'none';
110 var transform = 'translate';
111
112 if ('translate' in curTest) {
113 testBox.translate = curTest.translate;
114 computedTransform = window.getComputedStyle(testbox).translate;
115
116 } else if ('scale' in curTest) {
117 testBox.scale = curTest.scale;
118 computedTransform = window.getComputedStyle(testbox).scale;
119 transform = 'scale';
120
121 } else if ('rotate' in curTest) {
122 testBox.rotate = curTest.rotate;
123 computedTransform = window.getComputedStyle(testbox).rotate;
124 transform = 'rotate';
125 }
126
127 var success = curTest.result === computedTransform;
128 var result = transform + ' "<code>' + curTest[transform] + '</code>" exp ected "<code>' + curTest.result + '</code>" : ';
129 if (success)
130 result += 'PASS';
131 else
132 result = 'FAIL';
133 resultsBox.innerHTML += result + '<br>';
134 });
135 }
136
137 function runTests()
138 {
139 testTransforms();
140
141 if (window.testRunner)
142 testRunner.notifyDone();
143 }
144
145 </script>
146 </head>
147 <body onload="runTests()">
148
149 <div class="container">
150 <div id="test-box" class="box"></div>
151 </div>
152
153 <div id="results">
154 </div>
155 </body>
156 </html>
OLDNEW
« no previous file with comments | « LayoutTests/animations/svg-attribute-interpolation/resources/interpolation-test.js ('k') | Source/core/animation/css/CSSAnimatableValueFactory.cpp » ('j') | Source/core/animation/css/CSSAnimatableValueFactory.cpp » ('J')

Powered by Google App Engine
This is Rietveld 408576698