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
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test whether settings page works.
const TEST_URI = `
<style>
body {
text-size-adjust: none;
}
div {
text-size-adjust: none;
}
</style>
<body><div></div></body>
`;
const {
COMPATIBILITY_UPDATE_TARGET_BROWSERS_COMPLETE,
} = require("resource://devtools/client/inspector/compatibility/actions/index.js");
add_task(async function () {
registerCleanupFunction(() => {
Services.prefs.clearUserPref(
"devtools.inspector.compatibility.target-browsers"
);
});
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
const { inspector, panel } = await openCompatibilityView();
const { store } = inspector;
info("Check initial state");
ok(
panel.querySelector(`.compatibility-browser-icon__image[src*="firefox"]`),
"Firefox browsers are the target"
);
info("Make Firefox browsers out of target");
await updateTargetBrowsers(panel, store, id => !id.includes("firefox"));
ok(
!panel.querySelector(`.compatibility-browser-icon__image[src*="firefox"]`),
"Firefox browsers are not the target"
);
info("Make all browsers out of target");
await updateTargetBrowsers(panel, store, () => false);
ok(
!panel.querySelector(".compatibility-browser-icon__image"),
"No browsers are the target"
);
info("Make Firefox browsers target");
await updateTargetBrowsers(panel, store, id => id.includes("firefox"));
ok(
panel.querySelector(`.compatibility-browser-icon__image[src*="firefox"]`),
"Firefox browsers are the target now"
);
});
async function updateTargetBrowsers(panel, store, isTargetBrowserFunc) {
info("Open settings pane");
const settingsButton = panel.querySelector(".compatibility-footer__button");
settingsButton.click();
await waitUntil(() => panel.querySelector(".compatibility-settings"));
const browsers = [
...new Set(
Array.from(panel.querySelectorAll("[data-id]")).map(el =>
el.getAttribute("data-id")
)
),
];
Assert.deepEqual(
// Filter out IE, to be removed in an upcoming browser compat data sync.
// TODO: Remove the filter once D150961 lands. see Bug 1778009
browsers.filter(browser => browser != "ie"),
[
"chrome",
"chrome_android",
"edge",
"firefox",
"firefox_android",
"safari",
"safari_ios",
],
"The expected browsers are displayed"
);
info("Change target browsers");
const settingsPane = panel.querySelector(".compatibility-settings");
for (const checkbox of settingsPane.querySelectorAll(
".compatibility-settings__target-browsers-item input"
)) {
if (checkbox.checked !== isTargetBrowserFunc(checkbox.id)) {
// Need to click to toggle since the input is designed as controlled component.
checkbox.click();
}
}
info("Close settings pane");
const onUpdated = waitForDispatch(
store,
COMPATIBILITY_UPDATE_TARGET_BROWSERS_COMPLETE
);
const closeButton = settingsPane.querySelector(
".compatibility-settings__header-button"
);
closeButton.click();
await onUpdated;
}
|
