<!DOCTYPE html>
<style>
  body {
    height: 2000px;
    width: 2000px;
  }
</style>

<script src="../../resources/ui-helper.js"></script>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script>

    function getUIScript() {
        const pageScaleFactor = 2;
        return `(function() {
            uiController.zoomToScale(${pageScaleFactor}, function() {
                uiController.uiScriptComplete(uiController.zoomScale);
            });
        })();`;
    }

    let numScrollEvents = 0;
    window.visualViewport.addEventListener("scroll", event => numScrollEvents++);

    promise_test(async () => {
        await UIHelper.waitForEvent(window, "load");
        await new Promise(resolve => testRunner.runUIScript(getUIScript(), resolve));

        window.scrollTo(1000, 1000);
        await UIHelper.ensureStablePresentationUpdate();
        await UIHelper.animationFrame();
        assert_not_equals(numScrollEvents, 0, "Calling window.scrollTo() caused 'scroll' events to be dispatched.");

        const numScrollEventsAfterScroll = numScrollEvents;
        await UIHelper.animationFrame();
        assert_equals(numScrollEventsAfterScroll, numScrollEvents, "There were no additional scroll events after scrolling.");
    }, "Verify that a scroll event gets fired on window.visualViewport when its offset changes but not after the scroll has completed.");

</script>
