[IMP] web, *: add utils to get dataURL (base64) from file/blob

* = partner_autocomplete, point_of_sale, web_editor,
website_forum, website_slides

This can be used for example to preview an image from a file input field.

It can also be used to send the base64 content of the input by RPC instead of
having to rely on form submit as POST with multipart/form-data.

Technically wrap FileReader.readAsDataURL in a Promise.

This will also be used in task-1930726

PR: #33508

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

1 files changed, 3 insertions, 4 deletions

diff --git a/addons/web_editor/static/src/js/wysiwyg/plugin/dropzone.js b/addons/web_editor/static/src/js/wysiwyg/plugin/dropzone.js
index 255561b02be..3561f5b071c 100644
--- a/addons/web_editor/static/src/js/wysiwyg/plugin/dropzone.js
+++ b/addons/web_editor/static/src/js/wysiwyg/plugin/dropzone.js
@@ -4,6 +4,7 @@ odoo.define('web_editor.wysiwyg.plugin.dropzone', function (require) {
 var core = require('web.core');
 var Plugins = require('web_editor.wysiwyg.plugins');
 var registry = require('web_editor.wysiwyg.plugin.registry');
+var utils = require('web.utils');
 
 var _t = core._t;
 var dom = $.summernote.dom;
@@ -83,9 +84,8 @@ var DropzonePlugin = Plugins.dropzone.extend({
             // save images as attachments
             var def = new Promise(function (resolve) {
                 // Get image's Base64 string
-                var reader = new FileReader();
-                reader.addEventListener('load', function (e) {
-                    self._uploadImage(e.target.result, file.name).then(function (attachment) {
+                utils.getDataURLFromFile(file).then(function (result) {
+                    self._uploadImage(result, file.name).then(function (attachment) {
                         // Make the HTML
                         var image = self.document.createElement('img');
                         image.setAttribute('style', 'width: 100%;');
@@ -97,7 +97,6 @@ var DropzonePlugin = Plugins.dropzone.extend({
                         $(image).trigger('dropped');
                     });
                 });
-                reader.readAsDataURL(file);
             });
             defs.push(def);
         });