<!DOCTYPE html>
<html>
<body>
<script src="../../resources/js-test.js"></script>
<script>

description('This tests listeners on MediaQueryList get called when inverted color is turned on when there are no relevant style rules');

jsTestIsAsync = true;

if (window.testRunner)
    testRunner.waitUntilDone();

let didCallListener = false;
let timer;

window.onload = () => {
    requestAnimationFrame(() => {
        window.matchMedia('(prefers-reduced-motion)').addListener((e) => {
            didCallListener = true;
            finalize();
        });

        if (!window.internals || !testRunner.runUIScript) {
            testFailed('This test requires runUIScript');
            finishJSTest();
            return;
        }

        window.internals.settings.forcedPrefersReducedMotionAccessibilityValue = "on";
        testRunner.runUIScript(`
            uiController.simulateAccessibilitySettingsChangeNotification(() => {
                uiController.uiScriptComplete("Done");
            })`, () => {
            if (!didCallListener)
                timer = setTimeout(finalize, 1000);
        });
    });
}

function finalize() {
    if (timer)
        clearTimeout(timer);

    shouldBeTrue('didCallListener');
    shouldBeTrue('matchMedia("(prefers-reduced-motion)").matches');
    finishJSTest();
}

</script>
</body>
</html>