<!DOCTYPE html>
<html>
<head>
<link rel="help" href="http://www.w3.org/TR/DOM-Level-3-Events/#events-WheelEvent">
<script src="../../resources/js-test-pre.js"></script>
</head>
<body onload="setupTopLevel();">
<script>
window.jsTestIsAsync = true;

var iframeTarget;
var selectLeft;
var selectRight;
var previousSelectLeftScrollPosition;

function checkForScroll()
{
    if (selectLeft.scrollTop == previousSelectLeftScrollPosition)
        testPassed("Leftmost <select> was not scrolled by the latch state logic");
    else
        testFailed("Leftmost <select> was incorrectly scrolled by wrong latch logic." + " " + selectLeft.scrollTop + " " + previousSelectLeftScrollPosition);

    if (selectRight.scrollTop > 0)
        testPassed("Rightmost <select> was properly scrolled.");
    else
        testFailed("Rightmost <select> was not scrolled though it should.");

    finishJSTest();
}
function scrollRightMostSelect()
{
    if (selectLeft.scrollTop > 0)
        testPassed("Leftmost <select> was scrolled");
    else
        testFailed("Leftmost <select> was not scrolled");
    previousSelectLeftScrollPosition = selectLeft.scrollTop;

    var startPosX = Math.round(selectRight.offsetLeft) + 10;
    var startPosY = Math.round(selectRight.offsetTop) + 10;
    eventSender.mouseMoveTo(startPosX, startPosY);
    eventSender.mouseScrollByWithWheelAndMomentumPhases(0, -1, "began", "none");
    eventSender.mouseScrollByWithWheelAndMomentumPhases(0, -1, "changed", "none");
    eventSender.mouseScrollByWithWheelAndMomentumPhases(0, 0, "ended", "none");
    eventSender.callAfterScrollingCompletes(checkForScroll);
}

function scrollLeftMostSelect()
{
    var startPosX = Math.round(selectLeft.offsetLeft) + 10;
    var startPosY = Math.round(selectLeft.offsetTop) + 10;
    eventSender.mouseMoveTo(startPosX, startPosY);
    eventSender.mouseScrollByWithWheelAndMomentumPhases(0, -1, "began", "none");
    eventSender.mouseScrollByWithWheelAndMomentumPhases(0, -1, "changed", "none");
    eventSender.mouseScrollByWithWheelAndMomentumPhases(0, 0, "ended", "none");
    eventSender.callAfterScrollingCompletes(scrollRightMostSelect);
}

function setupTopLevel()
{
    if (window.eventSender) {
        eventSender.monitorWheelEvents();

        iframeTarget = document.getElementById("target");
        selectLeft = window.frames["target"].document.getElementById("selectLeft");
        selectRight = window.frames["target"].document.getElementById("selectRight");

        setTimeout(scrollLeftMostSelect, 0);
    }
}
</script>
<iframe id="target" name="target" height="400" width="400" src="resources/selects-iframe.html"></iframe>
<div id="console"></div>
<script>
description("Tests that latched state logic does not get stuck scrolling a specific &lt;select&gt;. To manually run this test, place the mouse pointer<br>" +
            "within one left &lt;select&gt; boundary, and then use the mouse wheel or a two-finger to scroll down the list, without momentum scrolling.<br>" +
            "Do the same for the right &lt;select&gt;. The left &lt;select&gt; should not scroll when trying to scroll the right &lt;select&gt;.");
</script>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>