<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form id="form">
<input id="file" type="file" />
<input id="reset" type="reset" />
</form>
<div id="console"></div>
<p>
This tests whether the label next to the file chooser button becomes "No file chosen"
when we press the reset button.
To run this test manually, choose a file and then click the reset button.
If the label next to the file chooser button changes to "No file chosen", the test passes.
</p>
<script>
if (testRunner && eventSender) {
    var file = document.getElementById("file");
    var reset = document.getElementById("reset");
    dragFilesOntoElement(file, ["foo.txt"]);
    document.getElementById("console").innerHTML = file.value + " is selected.";
    click(reset.offsetLeft + reset.offsetWidth / 2, reset.offsetTop + reset.offsetHeight / 2);
    click(reset.offsetLeft + reset.offsetWidth + 10, reset.offsetTop + reset.offsetHeight + 10); // Move a cursor out of the reset button.
}

function click(x, y) {
    eventSender.mouseMoveTo(x, y);
    eventSender.mouseDown();
    eventSender.mouseMoveTo(x, y);
    eventSender.mouseUp();
}

function dragFilesOntoElement(element, files) {
    eventSender.beginDragWithFiles(files);
    var centerX = element.offsetLeft + element.offsetWidth / 2;
    var centerY = element.offsetTop + element.offsetHeight / 2;
    eventSender.mouseMoveTo(centerX, centerY);
    eventSender.mouseUp();
}
</script>
</body>
</html>
