<!DOCTYPE html>
<html>
<head>
<script src="../../resources/js-test-pre.js"></script>
<script src="resources/common.js"></script>
</head>
<body>
<input id="search_input" type="search" />
<div id="console">
<p>
This tests the behavior of a cancel button in search input forms.
</p>
</div>
<script>
function click(position) {
    if (!eventSender)
        return;
    eventSender.mouseMoveTo(position.x, position.y);
    eventSender.mouseDown();
    eventSender.mouseMoveTo(position.x, position.y);
    eventSender.mouseUp();
    eventSender.leapForward(1000);
}

function keydown(character) {
    if (!eventSender)
        return;
    eventSender.keyDown(character);
    eventSender.leapForward(1000);
}

function setInputAttributes(input, value, disabled, readonly) {
    input.value = value;
    input.disabled = disabled;
    input.readOnly = !!readonly;
}

if (window.testRunner) {
    var input = $("search_input");
    var cancelButtonPosition = searchCancelButtonPosition(input);
    var middleButtonPosition = {};
    middleButtonPosition.x = input.offsetLeft + input.offsetWidth / 2;
    middleButtonPosition.y = input.offsetTop + input.offsetHeight / 2;
    var enabled = false;
    var disabled = true;
    var readonly = true;

    debug("Test on the input form with disabled=false and readonly=false");

    setInputAttributes(input, "foo", enabled);
    debug("Click the cancel button:");
    click(cancelButtonPosition);
    shouldBe('input.value', '""');
    debug("... and then input one character:");
    keydown("b");
    shouldBe('input.value', '"b"');

    setInputAttributes(input, "foo", enabled);
    debug("Click the center of the form:");
    click(middleButtonPosition);
    shouldBe('input.value', '"foo"');
    debug("... and then input one character:");
    keydown("b");
    shouldBe('input.value', '"foob"');

    debug("");
    debug("Test on the input form with disabled=false and readonly=true");

    setInputAttributes(input, "foo", enabled, readonly);
    debug("Click the cancel button:");
    click(cancelButtonPosition);
    shouldBe('input.value', '"foo"');
    debug("... and then input one character:");
    keydown("b");
    shouldBe('input.value', '"foo"');

    setInputAttributes(input, "foo", enabled, readonly);
    debug("Click the center of the form:");
    click(middleButtonPosition);
    shouldBe('input.value', '"foo"');
    debug("... and then input one character:");
    keydown("b");
    shouldBe('input.value', '"foo"');

    debug("");
    debug("Test on the input form with disabled=true and readonly=false");

    setInputAttributes(input, "foo", disabled);
    debug("Click the cancel button:");
    click(cancelButtonPosition);
    shouldBe('input.value', '"foo"');
    debug("... and then input one character:");
    keydown("b");
    shouldBe('input.value', '"foo"');

    setInputAttributes(input, "foo", disabled);
    debug("Click the center of the form:");
    click(middleButtonPosition);
    shouldBe('input.value', '"foo"');
    debug("... and then input one character:");
    keydown("b");
    shouldBe('input.value', '"foo"');

    debug("");
    debug("Test on the input form with disabled=true and readonly=true");

    setInputAttributes(input, "foo", disabled, readonly);
    debug("Click the cancel button:");
    click(cancelButtonPosition);
    shouldBe('input.value', '"foo"');
    debug("... and then input one character:");
    keydown("b");
    shouldBe('input.value', '"foo"');

    setInputAttributes(input, "foo", disabled, readonly);
    debug("Click the center of the form:");
    click(middleButtonPosition);
    shouldBe('input.value', '"foo"');
    debug("... and then input one character:");
    keydown("b");
    shouldBe('input.value', '"foo"');

    debug("");
}
</script>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>