[FIX] web_editor: review snippet drag and drop technical flow

This commit completes [1] by further reviewing the drag and drop
technical flow order:

- The content_changed event should be triggered before starting snippets
  as well as it is only useful to signal the snippet modifications made
  by onBuilt.

- The undroppable snippets update which was done first could probably be
  done anywhere -> best to put it at the end when everything in the DOM
  is done, and it is also the last thing the user expects to be done.

Note: in the new editor the role of 'content_changed' became however
unclear and should be further reviewed. This commit fixes problems with
the old flow in master though (problems around removing items in a
snippet during its onBuilt call).

[1]: https://github.com/odoo/odoo/commit/60d7bf6d7daea83db9332b4fc47a4ac6892d21d7

closes odoo/odoo#75596

X-original-commit: efdfe261afd933972869305fd3358c764f7c18c3
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
qsm-odoo
2021-08-26 10:21:32 +00:00
parent 5afd3b996b
commit ea108e3910
2 changed files with 33 additions and 8 deletions
@@ -2392,20 +2392,42 @@ var SnippetsMenu = Widget.extend({
await self._scrollToSnippet($target, self.$scrollable);
_.defer(async function () {
self._disableUndroppableSnippets();
// Free the mutex now to allow following operations
// (mutexed as well).
dragAndDropResolve();
// First call the onBuilt of all options of each
// item in the snippet (and so build their editor
// instance first).
await self._callForEachChildSnippet($target, function (editor, $snippet) {
return editor.buildSnippet();
});
self.trigger_up('snippet_dropped', {$target: $target});
// The snippet is now fully built, notify the
// editor for changed content.
$target.trigger('content_changed');
// Now notifies that a snippet was dropped (at the
// moment, useful to start public widgets for
// instance (no saved content)).
await self._mutex.exec(() => {
const proms = [];
self.trigger_up('snippet_dropped', {
$target: $target,
addPostDropAsync: prom => proms.push(prom),
});
return Promise.all(proms);
});
// Lastly, ensure that the snippets or its related
// parts are added to the invisible DOM list if
// needed.
await self._updateInvisibleDOM();
// Restore editor to its normal edition state, also
// make sure the undroppable snippets are updated.
self._disableUndroppableSnippets();
self.options.wysiwyg.odooEditor.unbreakableStepUnactive();
self.options.wysiwyg.odooEditor.historyStep();
self.$el.find('.oe_snippet_thumbnail').removeClass('o_we_already_dragging');
});
} else {
+7 -4
View File
@@ -486,10 +486,13 @@ var EditPageMenu = websiteNavbarData.WebsiteNavbarActionWidget.extend({
_onSnippetDropped: function (ev) {
this._targetForEdition().find('.oe_structure.oe_empty, [data-oe-type="html"]')
.attr('contenteditable', true);
this.trigger_up('widgets_start_request', {
editableMode: true,
$target: ev.data.$target,
});
ev.data.addPostDropAsync(new Promise(resolve => {
this.trigger_up('widgets_start_request', {
editableMode: true,
$target: ev.data.$target,
onSuccess: () => resolve(),
});
}));
},
/**
* Called when a snippet is removed from the page. If the wrapper element is