pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] web_editor: extra history step on image paste

Browse Source 
Before this commit, when pasting or dropping an image, the insertion of
the image element to the DOM and the addition of the
"o_b64_image_to_save" class to it were recorded in two separate history
steps. This commit makes sure they are both recorded in a single step.

Additionally, the dataset was removed from the image element by the
(unnecessary) call to _prepareClipboardData. This resulted in losing the
file name information, which is useful when converting the image into an
attachment.

Before this commit, the "width: 100%" addition to the image's style
attribute had no effect, as it was later removed by the call to
_prepareClipboardData. In fact, the class "img-fluid" sets "max-width"
to 100% instead, which is offers desirable behaviour.

task-3497880

closes odoo/odoo#134832

Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
This commit is contained in:
Rodolpho Lima
2023-09-13 13:49:36 +00:00
parent 964d97358c
commit d72e471e5f
1 changed files with 12 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/js/editor/odoo-editor/src/OdooEditor.js
+12 -17
View File
@@ -4630,15 +4630,22 @@ export class OdooEditor extends EventTarget {
const promises = [];
for (const imageFile of imageFiles) {
const imageNode = document.createElement('img');
imageNode.style.width = '100%';
imageNode.classList.add('img-fluid');
// Mark images as having to be saved as attachments.
if (this.options.dropImageAsAttachment) {
imageNode.classList.add('o_b64_image_to_save');
}
imageNode.dataset.fileName = imageFile.name;
promises.push(getImageUrl(imageFile).then(url => {
imageNode.src = url;
return imageNode.outerHTML;
return imageNode;
}));
}
return Promise.all(promises).then(html => html.join(''));
return Promise.all(promises).then(nodes => {
const fragment = document.createDocumentFragment();
fragment.append(...nodes);
return fragment;
});
}
/**
* Handle safe pasting of html or plain text into the editor.
@@ -4676,13 +4683,7 @@ export class OdooEditor extends EventTarget {
// the clipboard picture.
if (files.length && !clipboardElem.querySelector('table')) {
this.addImagesFiles(files).then(html => {
const imageNodes = this._applyCommand('insert', this._prepareClipboardData(html));
if (imageNodes && this.options.dropImageAsAttachment) {
// Mark images as having to be saved as attachments.
for (const imageNode of imageNodes) {
imageNode.classList.add('o_b64_image_to_save');
}
}
this._applyCommand('insert', html);
});
} else {
if (closestElement(sel.anchorNode, 'a')) {
@@ -4873,13 +4874,7 @@ export class OdooEditor extends EventTarget {
this.execCommand('insert', this._prepareClipboardData(html));
} else if (fileTransferItems.length) {
this.addImagesFiles(fileTransferItems).then(html => {
const imageNodes = this.execCommand('insert', this._prepareClipboardData(html));
if (imageNodes && this.options.dropImageAsAttachment) {
// Mark images as having to be saved as attachments.
for (const imageNode of imageNodes) {
imageNode.classList.add('o_b64_image_to_save');
}
}
this.execCommand('insert', html);
});
} else if (htmlTransferItem) {
htmlTransferItem.getAsString(pastedText => {