[FIX] web_editor: get unlink button working

f3f7bd9 improved some link editing behaviour by adding contenteditable
attribute on it.

But if contenteditable is set on a link, using command "unlink" on the
element for `document.execCommand` does not work.

Hence this commit adds a code so the first click outside the link remove
contenteditable.

closes #10436

second-part-of: opw-659772

1 files changed, 11 insertions, 3 deletions

diff --git a/addons/web_editor/static/src/js/rte.js b/addons/web_editor/static/src/js/rte.js
index 85721ba0387..becaf978d17 100644
--- a/addons/web_editor/static/src/js/rte.js
+++ b/addons/web_editor/static/src/js/rte.js
@@ -513,13 +513,21 @@ var RTE = Widget.extend({
         }
 
         if ($target.is('a')) {
+            // add contenteditable on link to improve its editing behaviour
             $target.attr('contenteditable', true);
             setTimeout(function () {
                 $editable.attr('contenteditable', false);
             });
-        } else if ($editable.attr('contenteditable') === 'false') {
-            $target.removeAttr('contenteditable');
-            $editable.attr('contenteditable', true);
+            // once clicked outside, remove contenteditable on link
+            var reactive_editable = function(e){
+                if($target.is(e.target)) {
+                    return;
+                }
+                $target.removeAttr('contenteditable');
+                $editable.attr('contenteditable', true);
+                $(document).off('mousedown', reactive_editable);
+            }
+            $(document).on('mousedown', reactive_editable);
         }
 
         if (this && this.$last && (!$editable.size() || this.$last[0] != $editable[0])) {