| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../../resources/js-test.js"></script> |
| <script src="resources/file-drag-common.js"></script> |
| </head> |
| <body> |
| <input type="file" id="singleFile" name="upfile" onchange="singleFileSelected()" /> |
| <input type="file" id="multipleFiles" name="upfile[]" multiple="multiple" onchange="multipleFilesSelected()" /> |
| <div id="console"></div> |
| <script> |
| var changeDispatched; |
| |
| description("This tests the condition that triggers a 'change' event on file input forms."); |
| |
| if (window.testRunner) { |
| var singleFileInput = document.getElementById("singleFile"); |
| var multipleFilesInput = document.getElementById("multipleFiles"); |
| |
| debug("Test that the 'change' event is triggered on a single file form when a selected file is changed:"); |
| dragFilesOntoFileInput(singleFileInput, ["foo.txt"]); |
| shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\foo.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(singleFileInput, ["bar.txt"]); |
| shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\bar.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(singleFileInput, ["bar.txt"]); |
| shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\bar.txt"); |
| shouldBeFalse("changeDispatched"); |
| |
| dragFilesOntoFileInput(singleFileInput, ["foo.txt"]); |
| shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\foo.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoButtonInsideFileInput(singleFileInput, ["baz.png"]); |
| shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\baz.png"); |
| shouldBeTrue("changeDispatched"); |
| |
| debug(""); |
| debug("Test that the 'change' event is triggered on a multiple file form when a selected file is changed:"); |
| dragFilesOntoFileInput(multipleFilesInput, ["foo.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(multipleFilesInput, ["bar.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\bar.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(multipleFilesInput, ["bar.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\bar.txt"); |
| shouldBeFalse("changeDispatched"); |
| |
| dragFilesOntoFileInput(multipleFilesInput, ["foo.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| debug("Test that the 'change' event is triggered on a multiple file form when selected files are changed:"); |
| dragFilesOntoFileInput(multipleFilesInput, ["foo.txt", "bar.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(multipleFilesInput, ["foo.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(multipleFilesInput, ["foo.txt", "bar.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(multipleFilesInput, ["foo.txt", "bar.txt", "baz.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(multipleFilesInput, ["foo.txt", "bar.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(multipleFilesInput, ["bar.txt", "foo.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\bar.txt"); |
| shouldBeTrue("changeDispatched"); |
| |
| dragFilesOntoFileInput(multipleFilesInput, ["bar.txt", "foo.txt"]); |
| shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\bar.txt"); |
| shouldBeFalse("changeDispatched"); |
| } |
| |
| function singleFileSelected() { |
| changeDispatched = true; |
| } |
| |
| function multipleFilesSelected() { |
| changeDispatched = true; |
| } |
| |
| function dragFilesOntoFileInput(input, files) { |
| changeDispatched = false; |
| dragFilesOntoInput(input, files); |
| } |
| |
| function dragFilesOntoButtonInsideFileInput(input, files) { |
| changeDispatched = false; |
| eventSender.beginDragWithFiles(files); |
| eventSender.mouseMoveTo(input.offsetLeft + 10, input.offsetTop + input.offsetHeight / 2); |
| eventSender.mouseUp(); |
| } |
| </script> |
| </body> |
| </html> |
