| <!DOCTYPE html> |
| <iframe id="frame"></iframe> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script> |
| frame.contentDocument.open(); |
| frame.contentDocument.write(` |
| <!DOCTYPE html> |
| <style> |
| :focus #target { |
| background: green; |
| } |
| </style> |
| <div id="focus" tabindex="1"> |
| <div id="target">This test passes if it does not crash</target> |
| </div> |
| <script> |
| window.anim = target.animate([ |
| {color: 'green'}, |
| {color: 'black'}, |
| ], { |
| iterations: Infinity, |
| duration: 1000 |
| }); |
| \<\/script> |
| `); |
| frame.contentDocument.close(); |
| async_test(t => { |
| requestAnimationFrame(() => { |
| frame.contentDocument.querySelector('#focus').focus(); |
| requestAnimationFrame(() => { |
| // Update style. |
| frame.contentWindow.getComputedStyle( |
| frame.contentDocument.querySelector('#focus')).backgroundColor; |
| // Invalidate style with an animation style change. |
| frame.contentWindow.anim.currentTime += 1000; |
| frame.contentWindow.internals.setFocused(false); |
| t.done(); |
| }); |
| }); |
| }); |
| </script> |
