<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<script src="../../../resources/js-test.js"></script>
<style>
  body {
    padding: 0px;
    margin: 0px;
  }

  .spacer {
    position: absolute;
    left: 0px;
    top: 0px;
    margin: 0px;
    padding: 0px;
    width: 2000px;
    height: 1500px;
  }
</style>
<script language="JavaScript" type="text/javascript">
    if (window.testRunner && window.internals) {
        window.internals.setPageScaleFactorLimits(0.5, 4.0);
        window.jsTestIsAsync = true;
        testRunner.dumpAsText();
        testRunner.waitUntilDone();
    }

    description("This test makes sure the window properties related to the\
        viewport remain correct under pinch-to-zoom.");

    debug('===Unscaled===');
    debug('');
    shouldBe('window.innerWidth', '800');
    shouldBe('window.innerHeight', '600');

    function testPinchedIn() {
        debug('');
        debug('===Pinch Zoom in to 2X===');
        debug('');
        window.internals.setPageScaleFactor(2.0);
        shouldBe('window.innerWidth', '400');
        shouldBe('window.innerHeight', '300');
        shouldBe('window.scrollX', '0');
        shouldBe('window.scrollY', '0');

        window.scrollBy(10, 20);
        shouldBe('window.scrollX', '10');
        shouldBe('window.scrollY', '20');
        window.scrollBy(1590, 1180);
        shouldBe('window.scrollX', '1600');
        shouldBe('window.scrollY', '1200');
        window.scrollBy(-1600, -1200);
        shouldBe('window.scrollX', '0');
        shouldBe('window.scrollY', '0');
        window.scrollTo(1600, 1200);
        shouldBe('window.scrollX', '1600');
        shouldBe('window.scrollY', '1200');
        window.scrollTo(0, 0);
        shouldBe('window.scrollX', '0');
        shouldBe('window.scrollY', '0');
    }

    function testMaximallyPinchedOut() {
        debug('');
        debug('===Pinch Out to 0.5X===');
        debug('');
        window.internals.setPageScaleFactor(0.5);
        shouldBe('window.innerWidth', '1600');
        shouldBe('window.innerHeight', '1200');
        shouldBe('window.scrollX', '0');
        shouldBe('window.scrollY', '0');

        window.scrollBy(10, 20);
        shouldBe('window.scrollX', '10');
        shouldBe('window.scrollY', '20');
        window.scrollBy(390, 280);
        shouldBe('window.scrollX', '400');
        shouldBe('window.scrollY', '300');
        window.scrollBy(-400, -300);
        shouldBe('window.scrollX', '0');
        shouldBe('window.scrollY', '0');
        window.scrollTo(400, 300);
        shouldBe('window.scrollX', '400');
        shouldBe('window.scrollY', '300');
        window.scrollTo(0, 0);
        shouldBe('window.scrollX', '0');
        shouldBe('window.scrollY', '0');
    }

    function testOnScroll() {
        debug('');
        debug('===Test OnScroll===');
        debug('');
        window.internals.setPageScaleFactor(1.0);
        shouldBe('window.innerWidth', '800');
        shouldBe('window.innerHeight', '600');
        shouldBe('window.scrollX', '0');
        shouldBe('window.scrollY', '0');

        // First scroll scrolls only the outer viewport.
        // Second scrolls the outer and the inner.
        // Third scrolls only the inner.
        var scrolls = [100, 400, 100];
        var numScrollsReceived = 0;
        var numRAFCalls = 0;

        document.onscroll = function() {
            if (numRAFCalls == 0)
                return;

            ++numScrollsReceived;
            debug('PASS OnScroll called for scroll #' + numScrollsReceived);
            if (numScrollsReceived < scrolls.length) {
                var scrollAmount = scrolls[numScrollsReceived];
                window.scrollBy(scrollAmount, 0);
            } else if (numScrollsReceived == scrolls.length) {
                // Make sure scrollTo that moves only the inner viewport also
                // triggers a scroll event.
                window.scrollTo(1200, 0);
            } else {
                debug('');
                finishJSTest();
            }
        }

        // Scroll events are fired right before RAF so this is a good place to
        // make sure event was handled.
        var failureSentinel = function() {
            if (numRAFCalls == 0) {
                window.scrollBy(scrolls[0], 0);
            }else if (numRAFCalls > numScrollsReceived) {
                testFailed("Failed to receive scroll event #" + (numScrollsReceived+1));
                finishJSTest();
            }
            ++numRAFCalls;
            window.requestAnimationFrame(failureSentinel);
        }

        window.requestAnimationFrame(failureSentinel);
    }

    function forceLayout() {
        window.scrollTo(0, 0);
    }

    function runTests() {
        if (window.testRunner && window.internals) {
            forceLayout();
            testPinchedIn();
            testMaximallyPinchedOut();
            testOnScroll();
        }
    }

    onload = runTests;
</script>
<div class="spacer"></div>