summaryrefslogtreecommitdiffstats
path: root/layout/generic/test/test_overlay_scrollbar_position.html
blob: b70a0e7aa43e491138c5192f81fc89183315e50d (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<!doctype html>
<meta charset="utf-8">
<title>Test for overlay scrollbar positions</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<link rel="stylesheet" href="/tests/SimpleTest/test.css">
<style>
  div {
    width: 100px;
    height: 100px;
  }
</style>
<div style="overflow-x: scroll" data-expected-bottom></div>
<div style="overflow-y: scroll" data-expected-right></div>
<div style="overflow-y: scroll" dir="rtl" data-expected-left></div>
<script>
add_task(async function() {
  await SpecialPowers.pushPrefEnv({
    set: [["ui.useOverlayScrollbars", 1]],
  });
  for (let div of document.querySelectorAll("div")) {
    let rect = div.getBoundingClientRect();
    let kids = SpecialPowers.InspectorUtils.getChildrenForNode(
      div,
      /* anonymous = */ true,
      false
    );
    is(kids.length, 3, "Should create both horizontal and vertical scrollbars, and a scrollcorner");
    for (let attr of ["top", "left", "bottom", "right"]) {
      if (!div.hasAttribute(`data-expected-${attr}`)) {
        continue;
      }
      let vertical = attr == "left" || attr == "right";
      let scrollbar = kids[vertical ? 1 : 0];
      is(scrollbar.tagName, "scrollbar", "Should find scrollbar");
      is(scrollbar.getAttribute("orient"), vertical ? "vertical" : "horizontal", "Should be the right scrollbar");
      let scrollbarRect = scrollbar.getBoundingClientRect();
      let diff = scrollbarRect[attr] - rect[attr];
      is(diff, 0, `Scrollbar should be at ${attr}: ${scrollbarRect[attr]} vs. ${rect[attr]}`);
    }
  }
});
</script>