| <!DOCTYPE html> |
| <meta charset="utf-8"> |
| <meta name=timeout content=long> |
| <!-- user agents are not required to support open features other than `noopener` |
| and on some platforms position and size features don't make sense --> |
| <meta name="flags" content="may"> |
| <title>Multi-Screen Window Placement test: Fullscreen Companion Window</title> |
| <link rel="help" href="https://w3c.github.io/window-placement"> |
| This test uses multi-screen details to request fullscreen and open a pop-up<br> |
| (companion window) in the same user activation.<br> |
| It runs manually with `wpt serve` and a compatible browser.<br><br> |
| <button id="setUpButton">Request screen details</button> |
| <ul id="popupButtons"></ul> |
| <button id="cleanUpButton">Close any open popups</button><br> |
| <input id="autoCleanUp" type="checkbox" checked=true>Auto-close popups</input> |
| <ul id="logger"></ul> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="/resources/testdriver.js"></script> |
| <script src="/resources/testdriver-vendor.js"></script> |
| <script src="resources/helpers.js"></script> |
| |
| <script> |
| 'use strict'; |
| let popups = []; |
| |
| cleanUpButton.addEventListener('click', async () => { |
| popups.forEach(p => p.close()); |
| }); |
| |
| // expectPopup should be true if the test should expect the pop-up to be |
| // created, or false if the popup is not expected to be created (blocked). |
| async function testPopupOnScreen(popupTest, screen, expectPopup) { |
| // Show a popup child window on the associated screen. |
| const left = screen.availLeft + Math.floor(screen.availWidth / 2) - 150; |
| const top = screen.availTop + Math.floor(screen.availHeight / 2) - 50; |
| log(`Opening a popup on '${screen.label}' at (${left}, ${top})`); |
| let popup = window.open( |
| '/resources/blank.html', '', |
| `left=${left},top=${top},width=300,height=100`); |
| assert_equals(!!popup, expectPopup, 'Popup reference'); |
| if (popup === null) |
| return; |
| assert_equals(!popup.closed, expectPopup, 'Popup open'); |
| popups.push(popup); |
| if (autoCleanUp.checked) |
| popupTest.add_cleanup(popup.close); |
| } |
| |
| promise_test(async setUpTest => { |
| await setUpWindowPlacement(setUpTest, setUpButton); |
| const screenDetails = await getScreenDetails(); |
| assert_true(!!screenDetails, 'Error getting screen details'); |
| for (const [i, fullscreenScreen] of screenDetails.screens.entries()) { |
| const popupScreen = |
| screenDetails.screens[(i + 1) % screenDetails.screens.length]; |
| let testName = |
| `Fullscreen on '${fullscreenScreen.label}' and open popup on '${popupScreen.label}'`; |
| promise_test(async popupTest => { |
| const button = document.createElement('button'); |
| button.innerHTML = testName; |
| const entry = document.createElement('li'); |
| entry.appendChild(button); |
| popupButtons.appendChild(entry); |
| const popupWatcher = new EventWatcher(popupTest, button, ['click']); |
| const popupClick = popupWatcher.wait_for('click'); |
| try { // Support manual testing where test_driver is not running. |
| await test_driver.click(button); |
| } catch { |
| } |
| await popupClick; |
| button.disabled = true; |
| await document.documentElement.requestFullscreen( |
| { screen: fullscreenScreen } |
| ); |
| await testPopupOnScreen(popupTest, popupScreen, |
| /*expectPopup=*/fullscreenScreen !== popupScreen); |
| }, testName); |
| } |
| }, 'Use multi-screen details to request fullscreen and open a pop-up in the same user activation.'); |
| </script> |
