<html>
<head>
<script src="../../../resources/js-test-pre.js"></script>
</head>
<body onload="test()">
<form id="form" method="post" enctype="multipart/form-data">
<input id="text-input" type="text" name="posted-text">
<input id="file-input" type="file" name="posted-file">
<input id="multiple-file-input" type="file" multiple="multiple" name="posted-files">
</form>
<div id="manual-instructions">
To run this test manually:
<ul>
<li>Enter something to the text field and choose files with the files choosers.
<li>Click <u><a onclick="navigateAway()">here</a></u> to navigate away from the page.
<li>Click <u><a onclick="navigateBack()">here</a></u> to navigate back to the page.
<li>Check that the state of the form was restored.
</ul>
</div>
<div id="console"></div>
<script>
var jsTestIsAsync = true;

description("Test that the state of a file chooser is recovered when navigating away and navigating back.");

// Structure of the test:
// Start of the test (document.location.search == "")
// - Fill out a form.
// - Navigate to a different location.
// On the different page (document.location.search == "?differentpage")
// - Navigate back.
// Back on the original page (document.location.search == "" && window.name == "wentback")
// - Check the form data.

function test() {
    if (!window.testRunner)
        return;
    if (document.location.search == "" && window.name == "") {
        // Start of the test. Set the values to the input elements.
        document.getElementById("text-input").value = "text to be posted";
        dragFilesOntoInput(document.getElementById("file-input"), ["../resources/test.txt"]);
        dragFilesOntoInput(document.getElementById("multiple-file-input"),
                           ["../resources/test.txt", "../resources/test2.txt"]);
        navigateAway();
    } else if (document.location.search == "?differentpage") {
        // We have navigated to a different page. Now navigate back.
        navigateBack();
    } else if (document.location.search == "" && window.name == "wentback") {
        // We have navigated back. Now check the form values.
        shouldBeEqualToString("document.getElementById('text-input').value", "text to be posted");

        // The real file paths cannot be read from the file chooser element, but
        // we can verify that the path was restored properly by reading the
        // file.
        expectFileContents(document.getElementById("file-input").files[0], "Hello");
        expectFileContents(document.getElementById("multiple-file-input").files[0], "Hello");
        expectFileContents(document.getElementById("multiple-file-input").files[1], "Another");
    }
}

function navigateAway() {
    // Navigate away; do it with a timeout so that it will create a history entry.
    setTimeout(function() {document.location = document.location + "?differentpage";}, 0);
}

function navigateBack() {
    window.name = "wentback";
    history.back();
}

var filesRead = 0;

function checkFileContents(expected, evt) {
    document.readFileContents = evt.target.result;
    shouldBeEqualToString("document.readFileContents", expected);
    ++filesRead;
    if (filesRead == 3) {
        finishJSTest();
    }
}

function expectFileContents(file, contents) {
    var reader = new FileReader();
    reader.readAsText(file, "UTF-8");
    reader.onload = checkFileContents.bind(undefined, contents);
}

function moveMouseToCenterOfElement(element) {
    var centerX = element.offsetLeft + element.offsetWidth / 2;
    var centerY = element.offsetTop + element.offsetHeight / 2;
    eventSender.mouseMoveTo(centerX, centerY);
}

function dragFilesOntoInput(input, files) {
    eventSender.beginDragWithFiles(files);
    moveMouseToCenterOfElement(input);
    eventSender.mouseUp();
}
</script>
<script src="../../../resources/js-test-post.js"></script>
</body>
</html>