| <html> |
| <head> |
| <style> |
| div { |
| position: fixed; |
| left: 50%; |
| top: 50%; |
| width: 50px; |
| height: 50px; |
| background-color: black; |
| } |
| .horizontal-animation { |
| animation: horizontal-animation 1s linear 0s infinite; |
| } |
| .vertical-animation { |
| animation: vertical-animation 1s linear 0s infinite; |
| } |
| @keyframes horizontal-animation { |
| 0% { |
| top: 50%; |
| } |
| 50% { |
| top: 0%; |
| } |
| 100% { |
| top: 50%; |
| } |
| } |
| @keyframes vertical-animation { |
| 0% { |
| left: 50%; |
| } |
| 50% { |
| left: 0%; |
| } |
| 100% { |
| left: 50%; |
| } |
| } |
| </style> |
| </head> |
| <body> |
| <div class="horizontal-animation"></div> |
| <p></p> |
| <script> |
| (async function() { |
| window.testRunner?.dumpAsText(); |
| window.testRunner?.waitUntilDone(); |
| |
| if (!window.GCController) { |
| document.getElementsByTagName("p")[0].innerText = "window.GCController is missing"; |
| return; |
| } |
| |
| const div = document.getElementsByTagName("div")[0]; |
| |
| // Call `getAnimations()` to create current animation JS wrapper object (Animation) and store weak ref to it. |
| let weakAnimation = new WeakRef(div.getAnimations()[0]); |
| |
| // Change to new animation. This way, the wrapper object should become GC-able. |
| div.className = "vertical-animation"; |
| |
| // Pass the test if GC swept the wrapper object. |
| requestAnimationFrame(async () => { |
| await window.GCController.collect(); |
| document.getElementsByTagName("p")[0].innerText = weakAnimation.deref() ? "FAIL" : "PASS"; |
| globalThis.testRunner?.notifyDone(); |
| }); |
| })(); |
| </script> |
| </body> |
| </html> |