third_party/WebKit/LayoutTests/fast/forms/file/file-input-change-event.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../../resources/js-test.js"></script>
   5 <script src="resources/file-drag-common.js"></script>
   6 </head>
   7 <body>
   8 <input type="file" id="singleFile" name="upfile" onchange="singleFileSelected()" />
   9 <input type="file" id="multipleFiles" name="upfile[]" multiple="multiple" onchange="multipleFilesSelected()" />
  10 <div id="console"></div>
  11 <script>
  12 var changeDispatched;
  13
  14 description("This tests the condition that triggers a 'change' event on file input forms.");
  15
  16 if (window.testRunner) {
  17     var singleFileInput = document.getElementById("singleFile");
  18     var multipleFilesInput = document.getElementById("multipleFiles");
  19
  20     debug("Test that the 'change' event is triggered on a single file form when a selected file is changed:");
  21     dragFilesOntoFileInput(singleFileInput, ["foo.txt"]);
  22     shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\foo.txt");
  23     shouldBeTrue("changeDispatched");
  24
  25     dragFilesOntoFileInput(singleFileInput, ["bar.txt"]);
  26     shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\bar.txt");
  27     shouldBeTrue("changeDispatched");
  28
  29     dragFilesOntoFileInput(singleFileInput, ["bar.txt"]);
  30     shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\bar.txt");
  31     shouldBeFalse("changeDispatched");
  32
  33     dragFilesOntoFileInput(singleFileInput, ["foo.txt"]);
  34     shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\foo.txt");
  35     shouldBeTrue("changeDispatched");
  36
  37     dragFilesOntoButtonInsideFileInput(singleFileInput, ["baz.png"]);
  38     shouldBeEqualToString("singleFileInput.value", "C:\\fakepath\\baz.png");
  39     shouldBeTrue("changeDispatched");
  40
  41     debug("");
  42     debug("Test that the 'change' event is triggered on a multiple file form when a selected file is changed:");
  43     dragFilesOntoFileInput(multipleFilesInput, ["foo.txt"]);
  44     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt");
  45     shouldBeTrue("changeDispatched");
  46
  47     dragFilesOntoFileInput(multipleFilesInput, ["bar.txt"]);
  48     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\bar.txt");
  49     shouldBeTrue("changeDispatched");
  50
  51     dragFilesOntoFileInput(multipleFilesInput, ["bar.txt"]);
  52     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\bar.txt");
  53     shouldBeFalse("changeDispatched");
  54
  55     dragFilesOntoFileInput(multipleFilesInput, ["foo.txt"]);
  56     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt");
  57     shouldBeTrue("changeDispatched");
  58
  59     debug("Test that the 'change' event is triggered on a multiple file form when selected files are changed:");
  60     dragFilesOntoFileInput(multipleFilesInput, ["foo.txt", "bar.txt"]);
  61     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt");
  62     shouldBeTrue("changeDispatched");
  63
  64     dragFilesOntoFileInput(multipleFilesInput, ["foo.txt"]);
  65     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt");
  66     shouldBeTrue("changeDispatched");
  67
  68     dragFilesOntoFileInput(multipleFilesInput, ["foo.txt", "bar.txt"]);
  69     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt");
  70     shouldBeTrue("changeDispatched");
  71
  72     dragFilesOntoFileInput(multipleFilesInput, ["foo.txt", "bar.txt", "baz.txt"]);
  73     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt");
  74     shouldBeTrue("changeDispatched");
  75
  76     dragFilesOntoFileInput(multipleFilesInput, ["foo.txt", "bar.txt"]);
  77     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\foo.txt");
  78     shouldBeTrue("changeDispatched");
  79
  80     dragFilesOntoFileInput(multipleFilesInput, ["bar.txt", "foo.txt"]);
  81     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\bar.txt");
  82     shouldBeTrue("changeDispatched");
  83
  84     dragFilesOntoFileInput(multipleFilesInput, ["bar.txt", "foo.txt"]);
  85     shouldBeEqualToString("multipleFilesInput.value", "C:\\fakepath\\bar.txt");
  86     shouldBeFalse("changeDispatched");
  87 }
  88
  89 function singleFileSelected() {
  90     changeDispatched = true;
  91 }
  92
  93 function multipleFilesSelected() {
  94     changeDispatched = true;
  95 }
  96
  97 function dragFilesOntoFileInput(input, files) {
  98     changeDispatched = false;
  99     dragFilesOntoInput(input, files);
 100 }
 101
 102 function dragFilesOntoButtonInsideFileInput(input, files) {
 103     changeDispatched = false;
 104     eventSender.beginDragWithFiles(files);
 105     eventSender.mouseMoveTo(input.offsetLeft + 10, input.offsetTop + input.offsetHeight / 2);
 106     eventSender.mouseUp();
 107 }
 108 </script>
 109 </body>
 110 </html>