[ADD] web:tests: test utils for drag/drop files

This commit adds test helper functions to drag and drop
files:

- `createFile`: create a file that can be used for drag and
  drop in tests.
- `dragoverFile`: to drag a file created from `createFile`
  over a DOM element.
- `dropFile`: to drop a file created from `createFile` on
  a DOM element.

These utility functions are available from `testUtils.file`.

Example of usage:

```js
var testUtils = require('web.test_utils');
testUtils.file.createFile({
	name: 'text.txt',
	content: 'hello, world',
	contentType: 'text/plain',
}).then(function (file) {
	testUtils.file.dragoverFile($el, file);
	testUtils.file.dropFile($el, file);
});
```

addons/web/static/tests/helpers/test_utils.js

@@ -16,6 +16,7 @@ var session = require('web.session');
 var testUtilsCreate = require('web.test_utils_create');
 var testUtilsDom = require('web.test_utils_dom');
 var testUtilsFields = require('web.test_utils_fields');
+var testUtilsFile = require('web.test_utils_file');
 var testUtilsForm = require('web.test_utils_form');
 var testUtilsGraph = require('web.test_utils_graph');
 var testUtilsKanban = require('web.test_utils_kanban');
@@ -98,6 +99,11 @@ return $.when(
             editSelect: testUtilsFields.editSelect,
             editAndTrigger: testUtilsFields.editAndTrigger,
         },
+        file: {
+            createFile: testUtilsFile.createFile,
+            dragoverFile: testUtilsFile.dragoverFile,
+            dropFile: testUtilsFile.dropFile,
+        },
 
         createActionManager: testUtilsCreate.createActionManager,
         createDebugManager: testUtilsCreate.createDebugManager,

addons/web/static/tests/helpers/test_utils_file.js

@@ -0,0 +1,113 @@
+odoo.define('web.test_utils_file', function () {
+"use strict";
+
+/**
+ * FILE Test Utils
+ *
+ * This module defines various utility functions to help simulate events with
+ * files, such as drag-and-drop.
+ *
+ * Note that all methods defined in this module are exported in the main
+ * testUtils file.
+ */
+
+
+//------------------------------------------------------------------------------
+// Private functions
+//------------------------------------------------------------------------------
+
+/**
+ * Create a fake object 'dataTransfer', linked to a file, which is passed to
+ * drag and drop events.
+ *
+ * @param {Object} file
+ * @returns {Object}
+ */
+function _createFakeDataTransfer(file) {
+    return {
+        dropEffect: 'all',
+        effectAllowed: 'all',
+        files: [file],
+        getData: function () {
+            return file;
+        },
+        items: [],
+        types: ['Files'],
+    };
+}
+
+//------------------------------------------------------------------------------
+// Public functions
+//------------------------------------------------------------------------------
+
+/**
+ * Create a file object, which can be used for drag-and-drop.
+ *
+ * @param {Object} data
+ * @param {string} data.name
+ * @param {string} data.content
+ * @param {string} data.contentType
+ * @returns {$.Promise<Object>} resolved with file created
+ */
+function createFile(data) {
+    var def = $.Deferred();
+    var requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
+    if (!requestFileSystem) {
+        throw new Error('FileSystem API is not supported');
+    }
+    requestFileSystem(window.TEMPORARY, 1024 * 1024, function (fileSystem) {
+        fileSystem.root.getFile(data.name, { create: true }, function (fileEntry) {
+            fileEntry.createWriter(function (fileWriter) {
+                fileWriter.onwriteend = function (e) {
+                    fileSystem.root.getFile(data.name, {}, function (fileEntry) {
+                        fileEntry.file(function (file) {
+                            def.resolve(file);
+                        });
+                    });
+                };
+                fileWriter.write(new Blob([ data.content ], { type: data.contentType }));
+            });
+        });
+    });
+    return def;
+}
+
+/**
+ * Drag a file over a DOM element
+ *
+ * @param {$.Element} $el
+ * @param {Object} file must have been created beforehand (@see createFile)
+ */
+function dragoverFile($el, file) {
+    var ev = new Event('dragover', { bubbles: true });
+    Object.defineProperty(ev, 'dataTransfer', {
+        value: _createFakeDataTransfer(file),
+    });
+    $el[0].dispatchEvent(ev);
+}
+
+/**
+ * Drop a file on a DOM element.
+ *
+ * @param {$.Element} $el
+ * @param {Object} file must have been created beforehand (@see createFile)
+ */
+function dropFile($el, file) {
+    var ev = new Event('drop', { bubbles: true, });
+    Object.defineProperty(ev, 'dataTransfer', {
+        value: _createFakeDataTransfer(file),
+    });
+    $el[0].dispatchEvent(ev);
+}
+
+//------------------------------------------------------------------------------
+// Exposed API
+//------------------------------------------------------------------------------
+
+return {
+    createFile: createFile,
+    dragoverFile: dragoverFile,
+    dropFile: dropFile,
+};
+
+});

addons/web/views/webclient_templates.xml

@@ -495,6 +495,7 @@
         <script type="text/javascript" src="/web/static/tests/helpers/test_utils_create.js"></script>
         <script type="text/javascript" src="/web/static/tests/helpers/test_utils_dom.js"></script>
         <script type="text/javascript" src="/web/static/tests/helpers/test_utils_fields.js"></script>
+        <script type="text/javascript" src="/web/static/tests/helpers/test_utils_file.js"></script>
         <script type="text/javascript" src="/web/static/tests/helpers/test_utils_form.js"></script>
         <script type="text/javascript" src="/web/static/tests/helpers/test_utils_graph.js"></script>
         <script type="text/javascript" src="/web/static/tests/helpers/test_utils_kanban.js"></script>