OLD | NEW |
(Empty) | |
| 1 <!doctype html> |
| 2 <html> |
| 3 <head> |
| 4 <style> |
| 5 @-webkit-keyframes anim { |
| 6 from { |
| 7 background-color: red; |
| 8 } |
| 9 to { |
| 10 background-color: green; |
| 11 } |
| 12 } |
| 13 </style> |
| 14 <script src="../../../resources/js-test.js"></script> |
| 15 </head> |
| 16 <body> |
| 17 <div id="host"></div> |
| 18 <div id="result"></div> |
| 19 <script> |
| 20 if (window.testRunner) |
| 21 testRunner.waitUntilDone(); |
| 22 |
| 23 function getColor(element) { |
| 24 return window.getComputedStyle(element).color; |
| 25 } |
| 26 |
| 27 description('Test if @keyframes works for shadow host when using :host. i.e. crb
ug.com/332577'); |
| 28 |
| 29 var host = document.getElementById('host'); |
| 30 var sr = host.createShadowRoot(); |
| 31 sr.innerHTML = '<style>@-webkit-keyframes anim {' |
| 32 + 'from { color: red; } to { color: green; } }' |
| 33 + ':host { -webkit-animation: anim 0.5s both; color: red; }</style>' |
| 34 + 'I should become green'; |
| 35 |
| 36 window.setTimeout(function() { |
| 37 shouldBe("getColor(document.getElementById('host'))", '"rgb(0, 128, 0)"'); |
| 38 if (window.testRunner) |
| 39 testRunner.notifyDone(); |
| 40 }, 1000); |
| 41 </script> |
| 42 </body> |
| 43 </html> |
OLD | NEW |