1 files changed, 116 insertions, 0 deletions
diff --git a/testing/web-platform/tests/window-placement/multi-screen-fullscreen-manual.tentative.https.html b/testing/web-platform/tests/window-placement/multi-screen-fullscreen-manual.tentative.https.html
new file mode 100644
index 0000000000..620cd6e507
--- /dev/null
+++ b/testing/web-platform/tests/window-placement/multi-screen-fullscreen-manual.tentative.https.html
@@ -0,0 +1,116 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<meta name="timeout" content="long">
+<title>Multi-Screen Window Placement test: element.requestFullscreen()</title>
+<link rel="help" href="https://w3c.github.io/window-placement/">
+This test uses multi-screen details to request fullscreen on different
+displays and swap between them.<br>
+It runs manually with `wpt serve` and a compatible browser.<br><br>
+<button id="setUpButton">Request screen details</button>
+<ul id="testButtons"></ul>
+<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';
+
+// Waits until `window` is located on `screen` or until 3 seconds elapses.
+async function ensureWindowOnScreen(window, screen) {
+  // Returns true if window `w` in on screen `s`.
+  const isWindowOnScreen = async (w, s) => {
+    const center = {
+      x: w.screenLeft + w.outerWidth / 2,
+      y: w.screenTop + w.outerHeight / 2
+    };
+    return center.x >= s.left && (center.x < s.left + s.width) &&
+      center.y >= s.top && (center.y < s.top + s.height) &&
+      (await w.getScreenDetails()).currentScreen == s;
+  }
+  // Checks every 100ms if window `w` is on screen `s` up to 3s maximum.
+  const waitForWindowOnScreen = async (w, s, resolve, timestamp = Date.now()) => {
+    if (!w || w.closed || Date.now() - timestamp > 3000)
+      resolve(false);
+    else if (await isWindowOnScreen(w, s))
+      resolve(true);
+    else
+      setTimeout(waitForWindowOnScreen.bind(this, w, s, resolve, timestamp), 100);
+  }
+  return new Promise(resolve => { waitForWindowOnScreen(window, screen, resolve); });
+}
+
+// Asserts that the browser window is correctly positioned on `screen`.
+// `expectFullscreen` specifies whether to expect the window to be
+// fullscreen or not.
+async function testWindowOnScreen(test, screen, expectFullscreen) {
+
+  // In chrome, the requestFullscreen promise may resolve before the
+  // transition completes and the bounds may be incorect in the meantime.
+  // Wait until the window is on the expected screen.
+  // TODO(crbug.com/1330724) Remove this.
+  await ensureWindowOnScreen(window, screen);
+
+  assert_equals(!!document.fullscreenElement, expectFullscreen);
+  assert_equals((await window.getScreenDetails()).currentScreen, screen);
+
+  if (expectFullscreen) {
+    // Window bounds should equal the bounds of the screen when in fullscreen.
+    assert_equals(window.screenX, screen.left);
+    assert_equals(window.screenY, screen.top);
+    assert_equals(window.innerWidth, screen.width);
+    assert_equals(window.innerHeight, screen.height);
+  } else {
+    // Verify the window is somewhere within the specified screen
+    assert_true(window.screenX >= screen.left);
+    assert_true(window.screenY >= screen.top);
+    assert_true(window.screenX + window.outerWidth <= screen.left + screen.width);
+    assert_true(window.screenY + window.outerHeight <= screen.top + screen.height);
+  }
+}
+
+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 originalScreen = screenDetails.currentScreen;
+    const swapFullscreen =
+      screenDetails.screens[(i + 1) % screenDetails.screens.length];
+    let testName =
+      `Fullscreen on '${fullscreenScreen.label}' and swap to ${swapFullscreen.label}`;
+    promise_test(async fullscreenTest => {
+      // Step 1: Enter Fullscreen.
+      await addTestTriggerButtonAndAwaitClick(testButtons,
+        `Step 1: ${testName} (Enter Fullscreen)`,
+        fullscreenTest);
+      log(`Requesting fullscreen on screen: ${fullscreenScreen.label}`);
+      await document.documentElement.requestFullscreen(
+        { screen: fullscreenScreen }
+      );
+      await testWindowOnScreen(fullscreenTest, fullscreenScreen,
+        /*expectFullscreen*/true);
+      // Step 2: Swap to another screen.
+      await addTestTriggerButtonAndAwaitClick(testButtons,
+        `Step 2: ${testName} (Swap screens)`,
+        fullscreenTest);
+      log(`Swapping fullscreen to screen: ${swapFullscreen.label}`);
+      await document.documentElement.requestFullscreen(
+        { screen: swapFullscreen }
+      );
+      await testWindowOnScreen(fullscreenTest, swapFullscreen,
+        /*expectFullscreen*/true);
+      // Step 3: Exit fullscreen. Should restore window to `originalScreen`.
+      await addTestTriggerButtonAndAwaitClick(testButtons,
+        `Step 3: ${testName} (Exit Fullscreen)`,
+        fullscreenTest);
+      log(`Exiting fullscreen. Window should restore to ${originalScreen.label}.`);
+      await document.exitFullscreen();
+      await testWindowOnScreen(fullscreenTest, originalScreen,
+        /*expectFullscreen*/false);
+    }, testName);
+  }
+}, 'Use multi-screen details to request fullscreen on target displays and swap between them');
+</script>