<!DOCTYPE html>
<html>
<head>
<script src="../../../../resources/js-test.js"></script>
<script src="../../../../resources/ui-helper.js"></script>
</head>
<body>
<input type="file" onchange="changed(event)" webkitdirectory></input>
<script>
description("Tests choosing a folder via the file picker when using webkitdirectory.");
jsTestIsAsync = true;

function runTest()
{
    testRunner.setOpenPanelFiles(['resources/testFiles']);

    inputElement = document.getElementsByTagName('input')[0];
    shouldBeTrue("inputElement.webkitdirectory");
    UIHelper.activateAt(inputElement.offsetLeft + inputElement.offsetWidth / 2,
        inputElement.offsetTop + inputElement.offsetHeight / 2);
}

function checkFileListIncludes(files, name, relativePath)
{
    for (let _file of files) {
        file = _file;
        if (file.name === name) {
            testPassed("fileList contains file " + name);
            shouldBeEqualToString("file.webkitRelativePath", "" + relativePath);
            return;
        }
    }
    testFailed("fileList does not contain file " + name);
}

function changed(event)
{
    fileList = event.target.files;
    shouldBe("fileList.length", "5");
    checkFileListIncludes(fileList, "file1.txt", "testFiles/file1.txt");
    checkFileListIncludes(fileList, "file2.txt", "testFiles/file2.txt");
    checkFileListIncludes(fileList, "file3.txt", "testFiles/subfolder1/file3.txt");
    checkFileListIncludes(fileList, "file4.txt", "testFiles/subfolder2/file4.txt");
    checkFileListIncludes(fileList, "file5.txt", "testFiles/subfolder2/subfolder2a/file5.txt");

    finishJSTest();
}

runTest();

</script>
</body>
</html>