| <!DOCTYPE html> |
| <html> |
| <body> |
| <div id="host"></div> |
| <button onclick="goFullscreen()">Enter fullscreen</button> |
| <script src="../../resources/js-test.js"></script> |
| <script> |
| |
| description('Test that webkitfullscreenchange from shadow tree should be propagated to the shadow host.'); |
| |
| const shadowHost = document.getElementById('host'); |
| const shadowRoot = shadowHost.attachShadow({mode: 'closed'}); |
| shadowRoot.innerHTML = '<span>full screen content</span>'; |
| |
| function logFullScreenChangeEvent(subroot) { |
| return new Promise((resolve, reject) => { |
| subroot.addEventListener('webkitfullscreenchange', event => { |
| shouldBe(() => event.composed, 'true'); |
| shouldBe(() => event.currentTarget, () => subroot); |
| resolve(); |
| }, { |
| once: true, |
| }); |
| }); |
| } |
| |
| async function goFullscreen() { |
| shadowRoot.querySelector('span').webkitRequestFullScreen(); |
| |
| try { |
| await Promise.all([ |
| logFullScreenChangeEvent(shadowRoot), |
| logFullScreenChangeEvent(document), |
| ]); |
| } finally { |
| finishJSTest(); |
| } |
| } |
| |
| if (window.eventSender) { |
| const button = document.querySelector('button'); |
| jsTestIsAsync = true; |
| eventSender.mouseMoveTo(button.offsetLeft + 5, button.offsetTop + 5); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| } else |
| document.write('To test manually, click "Enter Fullscreen" above.'); |
| |
| </script> |
| </body> |
| </html> |