<html>
<head>
<script>
function log(msg)
{
var res = document.getElementById('res');
res.innerHTML = res.innerHTML + msg + "<br>";
}
function test()
{
var slider = document.getElementById('slider');
if (window.testRunner) {
testRunner.dumpAsText();
// slider drag
eventSender.mouseMoveTo(slider.offsetLeft + 7, slider.offsetTop + 7);
eventSender.mouseDown();
eventSender.mouseMoveTo(slider.offsetLeft + 50, slider.offsetTop + 50);
eventSender.mouseUp();
// single click
eventSender.mouseMoveTo(slider.offsetLeft + 7, slider.offsetTop + 7);
eventSender.mouseDown();
eventSender.mouseUp();
// single click again, should send no onchange event
eventSender.mouseMoveTo(slider.offsetLeft + 7, slider.offsetTop + 7);
eventSender.mouseDown();
eventSender.mouseUp();
// On touch events, check if change event is dispatched at touch end
var x = slider.offsetLeft;
var y = slider.offsetTop + slider.clientHeight / 2;
var w = slider.clientWidth;
eventSender.clearTouchPoints();
eventSender.addTouchPoint(x + w / 2, y);
eventSender.touchStart();
eventSender.touchMove();
eventSender.releaseTouchPoint(0);
eventSender.touchEnd();
}
}
</script>
</head>
<body onload="test()">
This tests that slider controls get the onchange event and that it is sent after the DOMInput event.<br>
<input type="range" id="slider" onchange="log('change')" oninput="log('input')" value=0 width=200px height=300px>
<div id="res"></div>
</body>
</html>
Codebase Browser
chromium