52 lines
1.5 KiB
HTML
52 lines
1.5 KiB
HTML
<html>
|
|
<head>
|
|
<title>CSS4 media query test: prefers-reduced-motion using matchMedia and addListener.</title>
|
|
<script>
|
|
if (window.testRunner) {
|
|
testRunner.dumpAsText();
|
|
testRunner.waitUntilDone();
|
|
}
|
|
|
|
function runTest()
|
|
{
|
|
if (!window.internals)
|
|
return;
|
|
|
|
var motionQuery = window.matchMedia("(prefers-reduced-motion)");
|
|
motionQuery.addListener(() => {
|
|
document.getElementById("after").textContent = motionQuery.matches ? "true" : "false";
|
|
queryFired = true;
|
|
checkDone();
|
|
});
|
|
|
|
document.getElementById("before").textContent = motionQuery.matches ? "true" : "false";
|
|
window.internals.settings.forcedPrefersReducedMotionAccessibilityValue = "on";
|
|
testRunner.runUIScript(`
|
|
(function() {
|
|
uiController.simulateAccessibilitySettingsChangeNotification(function() {
|
|
uiController.uiScriptComplete("Done");
|
|
});
|
|
})();`, function (result) {
|
|
scriptRan = true;
|
|
checkDone();
|
|
});
|
|
}
|
|
|
|
let queryFired = false;
|
|
let scriptRan = false;
|
|
|
|
function checkDone() {
|
|
if (queryFired && scriptRan)
|
|
testRunner.notifyDone();
|
|
}
|
|
|
|
window.addEventListener("load", runTest, false);
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<p>Initial value of motionQuery.matches: <span id="before">unknown</span> - should be false</p>
|
|
<p>Updated value of motionQuery.matches: <span id="after">unknown</span> - should be true</p>
|
|
<p>Note the updated value will only be filled if the listener fires.</p>
|
|
</body>
|
|
</html>
|