blob: 25b708224ef1c2e27afd94773b4649ba16abc69f (
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
|
<!DOCTYPE html>
<meta charset=utf-8>
<title>Dynamic changes to prefers-color-scheme affecting SVG images</title>
<link rel=stylesheet type=text/css href=/tests/SimpleTest/test.css>
<script src=/tests/SimpleTest/SimpleTest.js></script>
<script src=/tests/SimpleTest/WindowSnapshot.js></script>
<body onload=run()>
<iframe id=f1 width=300 height=600></iframe>
<iframe id=f2 width=300 height=600></iframe>
<script>
SimpleTest.waitForExplicitFinish();
// Not strictly needed, but keeps eslint happy.
let f1 = window.f1;
let f2 = window.f2;
function snapshotsEqual() {
let s1 = snapshotWindow(f1.contentWindow);
let s2 = snapshotWindow(f2.contentWindow);
return compareSnapshots(s1, s2, true)[0];
}
function waitForColorSchemeToBe(scheme) {
return new Promise(resolve => {
let mq = matchMedia(`(prefers-color-scheme: ${scheme})`);
if (mq.matches) {
resolve();
} else {
mq.addEventListener("change", resolve, { once: true });
}
});
}
async function run() {
let loadedFrame1 = new Promise(resolve => f1.onload = resolve);
let loadedFrame2 = new Promise(resolve => f2.onload = resolve);
await SpecialPowers.pushPrefEnv({ set: [["layout.css.prefers-color-scheme.content-override", 1]] });
await waitForColorSchemeToBe("light");
f1.src = "mq_dynamic_svg_test.html";
f2.src = "mq_dynamic_svg_ref.html";
await loadedFrame1;
await loadedFrame2;
ok(!snapshotsEqual(), "In light mode snapshot comparison should be false");
await SpecialPowers.pushPrefEnv({ set: [["layout.css.prefers-color-scheme.content-override", 0]] });
await waitForColorSchemeToBe("dark");
ok(snapshotsEqual(), "In dark mode snapshot comparison should be true");
SimpleTest.finish();
}
</script>
|
