diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
| commit | 36d22d82aa202bb199967e9512281e9a53db42c9 (patch) | |
| tree | 105e8c98ddea1c1e4784a60a5a6410fa416be2de /layout/base/tests/test_emulateMedium.html | |
| parent | Initial commit. (diff) | |
| download | firefox-esr-upstream.tar.xz firefox-esr-upstream.zip | |
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'layout/base/tests/test_emulateMedium.html')
| -rw-r--r-- | layout/base/tests/test_emulateMedium.html | 165 |
1 files changed, 165 insertions, 0 deletions
diff --git a/layout/base/tests/test_emulateMedium.html b/layout/base/tests/test_emulateMedium.html new file mode 100644 index 0000000000..535904f0c0 --- /dev/null +++ b/layout/base/tests/test_emulateMedium.html @@ -0,0 +1,165 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=819930 +--> +<meta charset="utf-8"> +<title>Test for Bug 819930</title> +<script src="/tests/SimpleTest/SimpleTest.js"></script> +<script src="/tests/SimpleTest/WindowSnapshot.js"></script> +<link rel="stylesheet" href="/tests/SimpleTest/test.css" /> +<style> + @media braille { + body { + background-color: rgb(255, 255, 0); + } + } + + @media embossed { + body { + background-color: rgb(210, 180, 140); + } + } + + @media handheld { + body { + background-color: rgb(0, 255, 0); + } + } + + @media print { + body { + background-color: rgb(0, 255, 255); + } + } + + @media projection { + body { + background-color: rgb(30, 144, 255); + } + } + + @media screen { + body { + background-color: green; + } + } + + @media speech { + body { + background-color: rgb(192, 192, 192); + } + } + + @media tty { + body { + background-color: rgb(255, 192, 203); + } + } + + @media tv { + body { + background-color: rgb(75, 0, 130); + } + } +</style> +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=819930">Mozilla Bug 819930</a> +<p id="display"></p> + +<div id="content" style="display: none"></div> + +<script> +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 }); + } + }); +} + +add_setup(async function() { + // Set a dark color scheme so that we can properly test the print override. + await SpecialPowers.pushPrefEnv({ set: [["layout.css.prefers-color-scheme.content-override", 0]] }); + await waitForColorSchemeToBe("dark"); +}); + +add_task(function() { + let tests = [ + {name: 'braille', value: 'rgb(255, 255, 0)'}, + {name: 'embossed', value: 'rgb(210, 180, 140)'}, + {name: 'handheld', value: 'rgb(0, 255, 0)'}, + {name: 'print', value: 'rgb(0, 255, 255)'}, + {name: 'projection', value: 'rgb(30, 144, 255)'}, + {name: 'speech', value: 'rgb(192, 192, 192)'}, + {name: 'tty', value: 'rgb(255, 192, 203)'}, + {name: 'tv', value: 'rgb(75, 0, 130)'}, + ]; + + let originalColor = 'rgb(0, 128, 0)'; + let body = document.body; + + let getColor = function() { + return window.getComputedStyle(body).backgroundColor; + }; + + for (let test of tests) { + // Emulate the given media + SpecialPowers.emulateMedium(window, test.name); + is(getColor(), test.value, 'emulating ' + test.name + ' produced ' + + 'correct rendering'); + + ok(matchMedia(test.name).matches, "Media matches"); + if (test.value == "print") { + ok(matchMedia("(prefers-color-scheme: light)").matches, "color-scheme is overridden when emulating print"); + } + + // Do the @media screen rules get applied after ending the emulation? + SpecialPowers.stopEmulatingMedium(window); + is(getColor(), originalColor, 'Ending ' + test.name + + ' emulation restores style for original medium'); + ok(!matchMedia(test.name).matches, "Media no longer matches"); + ok(!matchMedia("(prefers-color-scheme: light)").matches, "color-scheme override should be restored"); + + // CSS media types are case-insensitive; we should be too. + SpecialPowers.emulateMedium(window, test.name.toUpperCase()); + is(getColor(), test.value, + test.name + ' emulation is case-insensitive'); + SpecialPowers.stopEmulatingMedium(window); + } + + is(getColor(), originalColor, 'No emulation'); + + // Emulating screen should produce the same rendering as when there is + // no emulation in effect + SpecialPowers.emulateMedium(window, 'screen'); + is(getColor(), originalColor, 'Emulating screen produces original rendering'); + SpecialPowers.stopEmulatingMedium(window); + + is(getColor(), originalColor, 'No emulation, shouldn\'t change'); + + // Screen should be case-insensitive too + SpecialPowers.emulateMedium(window, 'SCREEN'); + is(getColor(), originalColor, 'screen emulation is case-insensitive'); + SpecialPowers.stopEmulatingMedium(window); + + is(getColor(), originalColor, 'No emulation, shouldn\'t change'); + + // An invalid parameter shouldn't fail. Given the CSS rules above, + // an invalid parameter should result in a different rendering from any + // produced thus far + SpecialPowers.emulateMedium(window, 'clay'); + let invalid = getColor(); + tests.push({name: 'screen', value: 'green'}); + tests.forEach(function(test) { + isnot(invalid, test.value, 'Emulating invalid type differs from ' + + test.name); + }); + + SpecialPowers.stopEmulatingMedium(window); + + is(getColor(), originalColor, 'No emulation, shouldn\'t change'); +}) +</script> |