blob: a4a5bd534999c4459e57fffa7d7f70104df34e26 [file] [log] [blame]
<!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>
<script>
var eventDeltaX = 0;
var eventDeltaY = 0;
var scrollDeltaX;
var scrollDeltaY;
jsTestIsAsync = true;
var testDiv;
function runTest() {
// Basic checks.
shouldBe('WheelEvent.prototype.__proto__', 'MouseEvent.prototype');
shouldBe('WheelEvent.DOM_DELTA_PIXEL', '0x00');
shouldBe('WheelEvent.DOM_DELTA_LINE', '0x01');
shouldBe('WheelEvent.DOM_DELTA_PAGE', '0x02');
testDiv = document.getElementById('target');
shouldBeNull('window.onwheel');
shouldBeNull('document.onwheel');
shouldBeNull('testDiv.onwheel');
testDiv.addEventListener('wheel', wheelHandler);
if (window.eventSender) {
eventSender.mouseMoveTo(testDiv.offsetLeft + 5, testDiv.offsetTop + 5);
eventSender.mouseScrollBy(-1, -2);
} else {
debug("FAIL: This test requires window.eventSender.");
}
}
var testEvent;
function wheelHandler(e) {
debug("Wheel event fired");
testEvent = e;
shouldBe("testEvent.__proto__", "WheelEvent.prototype");
shouldBe("testEvent.__proto__.__proto__", "MouseEvent.prototype");
shouldBeTrue("testEvent.deltaX > 0");
shouldBeTrue("testEvent.deltaY > 0");
shouldBe("testEvent.deltaZ", "0");
shouldBe("testEvent.deltaMode", "WheelEvent.DOM_DELTA_PIXEL")
eventDeltaX = e.deltaX;
eventDeltaY = e.deltaY;
}
function scrollHandler()
{
debug("Scroll event fired");
scrollDeltaX = testDiv.scrollLeft;
scrollDeltaY = testDiv.scrollTop;
shouldBe("eventDeltaX", "scrollDeltaX");
shouldBe("eventDeltaY", "scrollDeltaY");
finishJSTest();
}
</script>
</head>
<body>
<span id="parent">
<div id="target" style="border:solid 1px green; width:100px; height:70px; overflow:scroll; white-space:nowrap;" onscroll="scrollHandler()">
TOP TOP TOP TOP TOP TOP TOP TOP TOP TOP TOP TOP TOP TOP<br/>
Scroll mouse wheel over here<br/>
Scroll mouse wheel over here<br/>
Scroll mouse wheel over here<br/>
Scroll mouse wheel over here<br/>
Scroll mouse wheel over here<br/>
Scroll mouse wheel over here<br/>
END END END END END END END END END END END END END END<br/>
</div>
</span>
<div id="console"></div>
<script>
description("Tests the basic functionality of the standard wheel event");
runTest();
</script>
<script src="../../../resources/js-test-post.js"></script>
</body>
</html>