<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../../../resources/js-test-pre.js"></script>
<style type="text/css">
::-webkit-scrollbar {
  background-color: #ccc;
  height: 15px;
  width: 15px;
}

::-webkit-scrollbar-button {
  display: none;
}

::-webkit-scrollbar-thumb {
  background-color: #777;
  height: 15px;
  width: 15px;
}

#scrollable {
    height: 300px;
    width: 300px;
    overflow: scroll;
}

.large {
    height: 600px;
}
</style>
</head>
<body onload="runTest();">
<div id="scrollable">
  <div class="large">
  </div>
</div>

<script type="text/javascript">

var movingDiv;

function verticalScrollTest() {
    movingDiv = document.getElementById('scrollable');
    var scrollbarX = movingDiv.offsetLeft + movingDiv.offsetWidth - 5;
    var scrollThumbSafeOffset = 80;
    var scrollbarY = movingDiv.offsetTop + scrollThumbSafeOffset;

    shouldBe('movingDiv.scrollTop', '0');
    eventSender.gestureTapDown(scrollbarX, scrollbarY);
    eventSender.gestureScrollBegin(scrollbarX, scrollbarY);
    eventSender.gestureScrollUpdate(0, 20);
    eventSender.gestureScrollEnd(0, 0);
    shouldBeGreaterThanOrEqual('movingDiv.scrollTop', '1');
    // If we've got here, we've passed.
    isSuccessfullyParsed();
}

function exitIfNecessary()
{
    debug('Gesture events not implemented on this platform or broken');
    isSuccessfullyParsed();
}

function runTest()
{
    if (window.eventSender) {
        description('This tests scroll gesture events on a scroll bar. ' +
            'The scrollable div below should be slightly scrolled down ' +
            'if successful.');

        if (eventSender.clearTouchPoints)
            verticalScrollTest();
        else
            exitIfNecessary();
    } else {
        debug("This test requires DumpRenderTree.");
    }
}
</script>
</body>
</html>