<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../resources/js-test-pre.js"></script>
</head>
<body>
<p id="description"></p>

<input id=search type=search value=query>

<div id="console"></div>
<script>
description('Bug 46950: Search field cancel button keeps event capturing if the value is cleared in a focus event.');

var input = document.getElementById('search');
var cancelX = input.offsetLeft + input.offsetWidth - 6;
var middleX = input.offsetLeft + input.offsetWidth / 2
var middleY = input.offsetTop + input.offsetHeight / 2;
var mouseDownCount = 0;
input.addEventListener('mousedown', function(event) {
    mouseDownCount++;
}, false);

function clearValue(event) {
    this.value = '';
}
input.addEventListener('focus', clearValue, false);
// Click the cancel button.
eventSender.mouseMoveTo(cancelX, middleY);
eventSender.mouseDown();
eventSender.mouseUp();
// Click the input element. The event should not be captured by the cancel button.
eventSender.mouseMoveTo(middleX, middleY);
eventSender.mouseDown();
eventSender.mouseUp();

shouldBe('mouseDownCount', '2');
input.removeEventListener('focus', clearValue, false);
</script>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>
