1 files changed, 147 insertions, 0 deletions
diff --git a/dom/base/test/fullscreen/file_fullscreen-scrollbar.html b/dom/base/test/fullscreen/file_fullscreen-scrollbar.html
new file mode 100644
index 0000000000..05ab51431a
--- /dev/null
+++ b/dom/base/test/fullscreen/file_fullscreen-scrollbar.html
@@ -0,0 +1,147 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Test for Bug 1201798</title>
+  <script src="/tests/SimpleTest/EventUtils.js"></script>
+  <script src="/tests/SimpleTest/SimpleTest.js"></script>
+  <script type="text/javascript" src="file_fullscreen-utils.js"></script>
+  <style>
+    html, body, #measure {
+      width: 100%; height: 100%;
+      margin: 0px; border: 0px;
+    }
+    div {
+      margin: 0px; border: 0px;
+    }
+    #ref-outer { width: 100px; height: 100px; overflow: scroll; }
+    #ref-inner { width: 100%; height: 100%; }
+  </style>
+</head>
+<body>
+<div id="measure"></div>
+<div style="height: 1000vh; width: 1000vw;"></div>
+<div id="ref-outer">
+  <div id="ref-inner"></div>
+</div>
+<div id="fullscreen"></div>
+<script type="text/javascript">
+
+/** Test for Bug 1201798 */
+
+var info = msg => opener.info("[scrollbar] " + msg);
+var ok = (cond, msg) => opener.ok(cond, "[scrollbar] " + msg);
+var is = (a, b, msg) => opener.is(a, b, "[scrollbar] " + msg);
+
+var gVerticalScrollbarWidth, gHorizontalScrollbarWidth;
+var gMeasureDiv = document.getElementById("measure");
+var gFullscreenDiv = document.getElementById("fullscreen");
+
+function getMeasureRect() {
+  return gMeasureDiv.getBoundingClientRect();
+}
+
+function triggerFrameReconstruction() {
+  info("Triggering a force frame reconstruction");
+  var docElem = document.documentElement;
+  var wm = window.getComputedStyle(docElem).writingMode;
+  if (wm == "horizontal-tb") {
+    docElem.style.writingMode = "vertical-rl";
+  } else {
+    docElem.style.writingMode = "horizontal-tb";
+  }
+  docElem.getBoundingClientRect();
+}
+
+function assertHasScrollbars(elem) {
+  var rect = getMeasureRect();
+  info(`screen.width: ${screen.width}, screen.height: ${screen.height}`);
+  info(`rect.width: ${rect.width}, rect.height: ${rect.height}`);
+  ok(rect.width <= screen.width - gVerticalScrollbarWidth,
+     `Should have width less than or equal to ${screen.width - gVerticalScrollbarWidth} indicating vertical scrollbar when ${elem} is in fullscreen`);
+  ok(rect.height <= screen.height - gHorizontalScrollbarWidth,
+     `Should have height less than or equal to ${screen.height - gHorizontalScrollbarWidth} indicating horizontal scrollbar when ${elem} is in fullscreen`);
+}
+
+function assertHasNoScrollbars(elem) {
+  var rect = getMeasureRect();
+  info(`screen.width: ${screen.width}, screen.height: ${screen.height}`);
+  info(`rect.width: ${rect.width}, rect.height: ${rect.height}`);
+  is(rect.width, screen.width,
+     `Should not have vertical scrollbar when ${elem} is in fullscreen`);
+  is(rect.height, screen.height,
+     `Should not have horizontal scrollbar when ${elem} is in fullscreen`);
+}
+
+function checkScrollbars(elem, shouldHaveScrollbars) {
+  is(document.fullscreenElement, elem,
+     "Should only check the current fullscreen element");
+  var assertFunc = shouldHaveScrollbars ?
+    assertHasScrollbars : assertHasNoScrollbars;
+  assertFunc(elem);
+  triggerFrameReconstruction();
+  assertFunc(elem);
+}
+
+function begin() {
+  // Check for the use of overlay scrollbars. We can only get an accurate
+  // answer to our media query if we are Chrome-privileged. Otherwise, the
+  // media query will never match.
+  let wrappedWindow = SpecialPowers.wrap(window);
+  if (wrappedWindow.matchMedia("(-moz-overlay-scrollbars)").matches) {
+    // If overlay scrollbar is enabled, the scrollbar is not measurable,
+    // so we skip this test in that case.
+    info("Skip this test because of overlay scrollbar");
+    opener.nextTest();
+    return;
+  }
+
+  const outerElement = document.getElementById("ref-outer");
+  var rectOuter = outerElement.getBoundingClientRect();
+  var rectInner = document.getElementById("ref-inner").getBoundingClientRect();
+  info(`rectOuter: ${rectOuter.width} x ${rectOuter.height}`);
+  info(`rectInner: ${rectInner.width} x ${rectInner.height}`);
+  gVerticalScrollbarWidth = rectOuter.width - rectInner.width;
+  gHorizontalScrollbarWidth = rectOuter.height - rectInner.height;
+  ok(gVerticalScrollbarWidth != 0, "Should have vertical scrollbar");
+  ok(gHorizontalScrollbarWidth != 0, "Should have horizontal scrollbar");
+  info(`gVerticalScrollbarWidth: ${gVerticalScrollbarWidth}`);
+  info(`gHorizontalScrollbarWidth: ${gHorizontalScrollbarWidth}`);
+
+  // Remove the display of outerElement to simplify layout when window goes
+  // to fullscreen.
+  outerElement.style.display = "none";
+
+  info("Entering fullscreen on root");
+  addFullscreenChangeContinuation("enter", enteredFullscreenOnRoot);
+  document.documentElement.requestFullscreen();
+}
+
+function enteredFullscreenOnRoot() {
+  checkScrollbars(document.documentElement, true);
+  info("Entering fullscreen on div");
+  addFullscreenChangeContinuation("enter", enteredFullscreenOnDiv);
+  gFullscreenDiv.requestFullscreen();
+}
+
+function enteredFullscreenOnDiv() {
+  checkScrollbars(gFullscreenDiv, false);
+  info("Exiting fullscreen on div");
+  addFullscreenChangeContinuation("exit", exitedFullscreenOnDiv);
+  document.exitFullscreen();
+}
+
+function exitedFullscreenOnDiv() {
+  checkScrollbars(document.documentElement, true);
+  info("Exiting fullscreen on root");
+  addFullscreenChangeContinuation("exit", exitedFullscreenOnRoot);
+  document.exitFullscreen();
+}
+
+function exitedFullscreenOnRoot() {
+  opener.nextTest();
+}
+
+</script>
+</body>
+</html>