<!-- webkit-test-runner [ useThreadedScrolling=false ] -->
<!DOCTYPE html>

<html>
<head>
  <script src="../../../resources/js-test-pre.js"></script>
  <title>CSS scroll snapping should not conflict with user scrolling</title>
  <style>
    html {
      scroll-snap-type: y mandatory;
    }

    body {
      margin: 0;
    }

    div {
      width: 100%;
      height: 250px;
      scroll-snap-align: start;
    }
  </style>
</head>
<body>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</body>
<script>
var expectedScrollTop = 0;
var testsPassed = 0;
var testDescription;

function startScroll(startx, starty, deltaX, deltaY)
{
    eventSender.mouseMoveTo(startx, starty);
    eventSender.mouseScrollByWithWheelAndMomentumPhases(0, 0, "began", "none");
    eventSender.mouseScrollByWithWheelAndMomentumPhases(-deltaX, -deltaY, "changed", "none");
}

function continueScroll(deltaX, deltaY)
{
    eventSender.mouseScrollByWithWheelAndMomentumPhases(-deltaX, -deltaY, "changed", "none");
}

function endScroll(deltaX, deltaY)
{
    eventSender.mouseScrollByWithWheelAndMomentumPhases(-deltaX, -deltaY, "ended", "none");
}

function triggerNextTest() {
    if (testsPassed)
        debug("PASS " + testDescription);

    switch (testsPassed) {
    case 0:
        testDescription = "Scroll downwards by 25 pixels"
        expectedScrollTop = 25;
        startScroll(50, 50, 0, 25);
        return;

    case 1:
        testDescription = "Scroll downwards by another 25 pixels"
        expectedScrollTop = 50;
        continueScroll(0, 25);
        return;

    case 2:
        testDescription = "End scroll snaps back to top"
        expectedScrollTop = 0;
        endScroll(0, 0);
        return;

    case 3:
        testDescription = "Scroll downwards by 200 pixels"
        expectedScrollTop = 200;
        startScroll(50, 50, 0, 200);
        return;

    case 4:
        testDescription = "End scroll should snap to next element"
        expectedScrollTop = 250;
        endScroll(0, 0);
        return;
    }

    isSuccessfullyParsed();
    testRunner.notifyDone();

    return;
}

function scrollEventCallback() {
    if (document.scrollingElement.scrollTop == expectedScrollTop) {
        ++testsPassed;
        if (window.testRunner)
            triggerNextTest();
    }
}


document.addEventListener("scroll", scrollEventCallback, false);

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

if (window.eventSender) {
    eventSender.setWheelHasPreciseDeltas(true);
    triggerNextTest();
}
</script>
</html>