From 86cf231bf1a4c80f4c7bccdae406287ac90d9916 Mon Sep 17 00:00:00 2001 From: Romain Derie Date: Mon, 12 Apr 2021 15:55:21 +0000 Subject: [PATCH] [FIX] web_editor, website: restore link popover behaviors This commit fixes multiple bugs related to the new link popover edition [1]. Those bugs mostly comes from new editor integration [2] conflicts, as those where merged almost at the same time and needed a quick fix of rebase conflicts. - The navbar & footer link would not load the popover link edition anymore, as it was only targetting `#wrap`. - Double click on links was re-introduced but it was supposed to be gone. - Tooltip from Edit and Unlink inside the popover remained open after popover was closed. - Some leftover code that were not related to popover but kept during the rebase. [1] Commit 8fcf930a6b6b7ffb0965b0a689c7a3117962ce7e [2] Commit 740168ce8d27da3d6a7156d2d79655a898394923 closes odoo/odoo#69389 X-original-commit: e13966cc8e04111a9e18a344132546c6baa79fea Signed-off-by: Quentin Smetz (qsm) Signed-off-by: Romain Derie --- .../static/src/js/wysiwyg/wysiwyg.js | 16 +++--- .../website/static/src/js/editor/wysiwyg.js | 18 ++----- .../static/tests/tours/edit_link_popover.js | 53 ++++++++++++++++++- 3 files changed, 64 insertions(+), 23 deletions(-) diff --git a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js index 53f8edc301e..498e716947d 100644 --- a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js +++ b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js @@ -120,12 +120,14 @@ const Wysiwyg = Widget.extend({ self.openMediaDialog(params); }); - this.$editable.on('dblclick', 'a', function () { - if (!this.getAttribute('data-oe-model') && self.toolbar.$el.is(':visible')) { - self.showTooltip = false; - self.toggleLinkTools(true, this); - } - }); + if (!this.options.preventLinkDoubleClick) { + this.$editable.on('dblclick', 'a', function () { + if (!this.getAttribute('data-oe-model') && self.toolbar.$el.is(':visible')) { + self.showTooltip = false; + self.toggleLinkTools(true, this); + } + }); + } if (options.snippets) { $('body').addClass('editor_enable'); @@ -961,7 +963,7 @@ const Wysiwyg = Widget.extend({ this._updateFaResizeButtons(); } const link = getInSelection(this.odooEditor.document, 'a'); - if (link || isInMedia) { + if (isInMedia || link && !this.options.preventLinkDoubleClick) { // Handle the media/link's tooltip. this.showTooltip = true; setTimeout(() => { diff --git a/addons/website/static/src/js/editor/wysiwyg.js b/addons/website/static/src/js/editor/wysiwyg.js index e5420c4e63b..e70769ef8fc 100644 --- a/addons/website/static/src/js/editor/wysiwyg.js +++ b/addons/website/static/src/js/editor/wysiwyg.js @@ -50,6 +50,7 @@ Wysiwyg.include({ */ start: function () { this.options.toolbarHandler = $('#web_editor-top-edit'); + this.options.preventLinkDoubleClick = true; $(document.body).on('mousedown', (ev) => { @@ -57,28 +58,15 @@ Wysiwyg.include({ // Keep popover open if clicked inside it, but not on a button if (!($target.parents('.o_edit_menu_popover').length && !$target.parent('a').addBack('a').length)) { $('.o_edit_menu_popover').popover('hide'); + $('.o_edit_menu_popover').find('[data-toggle="tooltip"]').tooltip('hide'); } - if ($target.is('a') && $target.closest('#wrap').length) { + if ($target.is('a') && !$target.attr('data-oe-model') && !$target.find('> [data-oe-model]').length && $target.closest('#wrapwrap').length) { if (!$target.data('popover-widget-initialized')) { weWidgets.LinkPopoverWidget.createFor(this, ev.target); $target.data('popover-widget-initialized', true); } } - $(document).on('mousedown.website_link_popup', (e) => { - // Keep popover open if clicked inside it, but not on a button - const $currTarget = $(e.target); - if (!($currTarget.parents('.o_edit_menu_popover').length && !$currTarget.parent('a').addBack('a').length)) { - $('.o_edit_menu_popover').popover('hide'); - } else { - return; - } - - if ($target.is(e.target)) { - return; - } - $(document).off('mousedown.website_link_popup'); - }); }); // Dropdown menu initialization: handle dropdown openings by hand diff --git a/addons/website/static/tests/tours/edit_link_popover.js b/addons/website/static/tests/tours/edit_link_popover.js index 7d058ada4af..2e01d65619a 100644 --- a/addons/website/static/tests/tours/edit_link_popover.js +++ b/addons/website/static/tests/tours/edit_link_popover.js @@ -77,7 +77,7 @@ tour.register('edit_link_popover', { trigger: '#top_menu a:contains("Home")', }, { - content: "Popover should be shown", + content: "Popover should be shown (2)", trigger: '.o_edit_menu_popover .o_we_url_link:contains("Home")', run: function () {}, // it's a check }, @@ -113,5 +113,56 @@ tour.register('edit_link_popover', { trigger: '.js_add_menu', run: function () {}, // it's a check }, + { + content: "Close modal", + trigger: '.modal-footer .btn-secondary', + }, + // 3. Test other links (CTA in navbar & links in footer) + { + content: "Click CTA in navbar", + trigger: '#top_menu_container a.btn-primary[href="/contactus"]', + }, + { + content: "Popover should be shown (3)", + trigger: '.o_edit_menu_popover .o_we_url_link:contains("Contact Us")', + run: function () {}, // it's a check + }, + { + content: "Click 'Home' link in footer", + trigger: 'footer a[href="/"]', + }, + { + content: "Popover should be shown (4)", + trigger: '.o_edit_menu_popover .o_we_url_link:contains("Home")', + run: function () {}, // it's a check + }, + // 4. Popover should close when clicking non-link element + { + content: "Ensure popover is closed", + trigger: 'footer h5', + }, + // 5. Double click shouldn't do anything + { + content: "Double click on link", + trigger: 'html:not(:has(.o_edit_menu_popover))', // popover should be closed + run: function () { + const $footerHomeLink = $('footer a[href="/"]').first(); + + // Create range to simulate real double click, see pull request + const range = document.createRange(); + range.selectNodeContents($footerHomeLink[0]); + const sel = window.getSelection(); + sel.removeAllRanges(); + sel.addRange(range); + + $footerHomeLink.click().dblclick(); + }, + }, + { + content: "Ensure nothing happened on double click (except showing popover)", + extra_trigger: 'html:not(:has(#o_link_dialog_url_input))', + trigger: '.o_edit_menu_popover', + run: function () {}, // it's a check + }, ]); });