| <!DOCTYPE html> |
| <script src="../../../../resources/js-test-pre.js"></script> |
| <meta name="viewport" content="width=400"> |
| <body> |
| <video src="../../../content/test.mp4" style="position: absolute; top: 0; left: 0; width: 400px; height: 300px;" controls></video> |
| <script type="text/javascript"> |
| |
| window.jsTestIsAsync = true; |
| |
| description("Testing that we apply a CSS zoom to ensure controls are always 50 device points tall on iOS."); |
| |
| const media = document.querySelector("video"); |
| const shadowRoot = window.internals.shadowRoot(media); |
| |
| window.requestAnimationFrame(() => { |
| shouldBeEqualToString("shadowRoot.querySelector('.media-controls').style.width", "800px"); |
| shouldBeEqualToString("shadowRoot.querySelector('.media-controls').style.height", "600px"); |
| shouldBeEqualToString("shadowRoot.querySelector('.media-controls').style.transform", "scale(0.5)"); |
| shouldBeEqualToString("shadowRoot.querySelector('.media-controls').style.top", "auto"); |
| |
| debug(""); |
| media.remove(); |
| finishJSTest(); |
| }); |
| |
| </script> |
| <script src="../../../../resources/js-test-post.js"></script> |
| </body> |
