summaryrefslogtreecommitdiffstats
path: root/widget/tests/browser/browser_test_scrollbar_colors.js
blob: 21524120714cca863f7a6579f9434fb0bae0ccaa (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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
/* -*- Mode: indent-tabs-mode: nil; js-indent-level: 2 -*- */
/* vim: set sts=2 sw=2 et tw=80: */

"use strict";

add_task(async () => {
  const URL_ROOT = getRootDirectory(gTestPath).replace(
    "chrome://mochitests/content/",
    "http://mochi.test:8888/"
  );

  const tab = await BrowserTestUtils.openNewForegroundTab(
    gBrowser,
    URL_ROOT + "helper_scrollbar_colors.html"
  );

  await SpecialPowers.spawn(tab.linkedBrowser, [], () => {
    ChromeUtils.defineESModuleGetters(this, {
      WindowsVersionInfo:
        "resource://gre/modules/components-utils/WindowsVersionInfo.sys.mjs",
    });

    Services.scriptloader.loadSubScript(
      "chrome://mochikit/content/tests/SimpleTest/WindowSnapshot.js",
      this
    );

    // == Native theme ==

    const WIN_REFERENCES = [
      // Yellow background
      ["255,255,0", 6889],
      // Blue scrollbar face
      ["0,0,255", 540],
      // Cyan scrollbar track
      ["0,255,255", 2487],
    ];

    const MAC_REFERENCES = [
      // Yellow background
      ["255,255,0", 7225],
      // Blue scrollbar face
      ["0,0,255", 416],
      // Cyan scrollbar track
      ["0,255,255", 1760],
    ];

    // Values have been updated from 8100, 720, 1180 for linux1804
    const LINUX_REFERENCES = [
      // Yellow background
      ["255,255,0", 7744],
      // Blue scrollbar face
      ["0,0,255", 1104],
      // Cyan scrollbar track
      ["0,255,255", 1152],
    ];

    // == Non-native theme ==

    const WIN10_NNT_REFERENCES = [
      // Yellow background
      ["255,255,0", 6889],
      // Blue scrollbar face
      ["0,0,255", 612],
      // Cyan scrollbar track
      ["0,255,255", 2355],
    ];

    const WIN11_NNT_REFERENCES = [
      // Yellow background
      ["255,255,0", 6889],
      // Blue scrollbar face
      ["0,0,255", 324],
      // Cyan scrollbar track
      ["0,255,255", 2787],
    ];

    const MAC_NNT_REFERENCES = MAC_REFERENCES;

    const LINUX_NNT_REFERENCES = [
      // Yellow background
      ["255,255,0", 7744],
      // Blue scrollbar face
      ["0,0,255", 368],
      // Cyan scrollbar track
      ["0,255,255", 1852],
    ];

    function countPixels(canvas) {
      let result = new Map();
      let ctx = canvas.getContext("2d");
      let image = ctx.getImageData(0, 0, canvas.width, canvas.height);
      let data = image.data;
      let size = image.width * image.height;
      for (let i = 0; i < size; i++) {
        let key = data.subarray(i * 4, i * 4 + 3).toString();
        let value = result.get(key);
        value = value ? value : 0;
        result.set(key, value + 1);
      }
      return result;
    }

    let outer = content.document.querySelector(".outer");
    let outerRect = outer.getBoundingClientRect();
    if (
      outerRect.width == outer.clientWidth &&
      outerRect.height == outer.clientHeight
    ) {
      ok(true, "Using overlay scrollbar, skip this test");
      return;
    }
    content.document.querySelector("#style").textContent = `
        .outer { scrollbar-color: blue cyan; }
      `;

    let canvas = snapshotRect(content.window, outerRect);
    let stats = countPixels(canvas);
    let isNNT = SpecialPowers.getBoolPref("widget.non-native-theme.enabled");

    let references;
    if (content.navigator.platform.startsWith("Win")) {
      if (!isNNT) {
        references = WIN_REFERENCES;
      } else if (WindowsVersionInfo.get().buildNumber >= 22000) {
        // Windows 11 NNT
        references = WIN11_NNT_REFERENCES;
      } else {
        // Windows 10 NNT
        references = WIN10_NNT_REFERENCES;
      }
    } else if (content.navigator.platform.startsWith("Mac")) {
      references = isNNT ? MAC_NNT_REFERENCES : MAC_REFERENCES;
    } else if (content.navigator.platform.startsWith("Linux")) {
      references = isNNT ? LINUX_NNT_REFERENCES : LINUX_REFERENCES;
    } else {
      ok(false, "Unsupported platform");
    }
    for (let [color, count] of references) {
      let value = stats.get(color);
      is(value, count, `Pixel count of color ${color}`);
    }
  });

  BrowserTestUtils.removeTab(tab);
});