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

Side by Side Diff: third_party/WebKit/LayoutTests/transitions/cancel-transition.html

Issue 2521493002: CSS Transitions: Reduce usage of -webkit prefix in layout tests (Closed)
Patch Set: Created 4 years 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
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 2
3 <html> 3 <html>
4 <head> 4 <head>
5 <style> 5 <style>
6 #container { 6 #container {
7 width: 700px; 7 width: 700px;
8 background-color: #fcc; 8 background-color: #fcc;
9 } 9 }
10 10
11 #container div { 11 #container div {
12 position: relative; 12 position: relative;
13 background-color: #933; 13 background-color: #933;
14 width: 200px; 14 width: 200px;
15 height: 50px; 15 height: 50px;
16 left: 50px; 16 left: 50px;
17 margin-top: 10px; 17 margin-top: 10px;
18 } 18 }
19 #container.run #left { 19 #container.run #left {
20 left: 450px; 20 left: 450px;
21 -webkit-transition-property: left; 21 transition-property: left;
22 -webkit-transition-duration: 1s; 22 transition-duration: 1s;
23 -webkit-transition-timing-function: linear; 23 transition-timing-function: linear;
24 } 24 }
25 #container.run #translate { 25 #container.run #translate {
26 transform: translate(400px, 0px); 26 transform: translate(400px, 0px);
27 -webkit-transition-property: transform; 27 transition-property: transform;
28 -webkit-transition-duration: 1s; 28 transition-duration: 1s;
29 -webkit-transition-timing-function: linear; 29 transition-timing-function: linear;
30 } 30 }
31 </style> 31 </style>
32 <script> 32 <script>
33 if (window.testRunner) { 33 if (window.testRunner) {
34 testRunner.dumpAsText(); 34 testRunner.dumpAsText();
35 testRunner.waitUntilDone(); 35 testRunner.waitUntilDone();
36 } 36 }
37 37
38 function isEqual(actual, desired, tolerance) 38 function isEqual(actual, desired, tolerance)
39 { 39 {
(...skipping 17 matching lines...) Expand all
57 57
58 function check() 58 function check()
59 { 59 {
60 var left = parseFloat(window.getComputedStyle(document.getElementByI d('left')).left); 60 var left = parseFloat(window.getComputedStyle(document.getElementByI d('left')).left);
61 result = "left: "; 61 result = "left: ";
62 if (!isEqual(left, 250, 50)) 62 if (!isEqual(left, 250, 50))
63 result += "<span style='color:red'>FAIL (was: " + left + ", expe cted: 250)</span>"; 63 result += "<span style='color:red'>FAIL (was: " + left + ", expe cted: 250)</span>";
64 else 64 else
65 result += "<span style='color:green'>PASS</span>"; 65 result += "<span style='color:green'>PASS</span>";
66 66
67 result += ", webkitTransform: "; 67 result += ", transform: ";
68 68
69 var transform = window.getComputedStyle(document.getElementById('tra nslate')).webkitTransform; 69 var transform = window.getComputedStyle(document.getElementById('tra nslate')).transform;
70 transform = transform.split("("); 70 transform = transform.split("(");
71 transform = transform[1].split(","); 71 transform = transform[1].split(",");
72 if (!isEqual(transform[4], 200, 50)) 72 if (!isEqual(transform[4], 200, 50))
73 result += "<span style='color:red'>FAIL (was: " + transform[4] + ", expected: 200)</span>"; 73 result += "<span style='color:red'>FAIL (was: " + transform[4] + ", expected: 200)</span>";
74 else 74 else
75 result += "<span style='color:green'>PASS</span>"; 75 result += "<span style='color:green'>PASS</span>";
76 76
77 document.getElementById('result').innerHTML = result; 77 document.getElementById('result').innerHTML = result;
78 if (window.testRunner) 78 if (window.testRunner)
79 testRunner.notifyDone(); 79 testRunner.notifyDone();
(...skipping 15 matching lines...) Expand all
95 would cause the transition to continue to run (although with no visible effe ct). So when you 95 would cause the transition to continue to run (although with no visible effe ct). So when you
96 restarted, it would pick up where it left off. 96 restarted, it would pick up where it left off.
97 </p> 97 </p>
98 <div id="container"> 98 <div id="container">
99 <div id="left">left</div> 99 <div id="left">left</div>
100 <div id="translate">translate</div> 100 <div id="translate">translate</div>
101 </div> 101 </div>
102 <div id="result"></div> 102 <div id="result"></div>
103 </body> 103 </body>
104 </html> 104 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698