[FIX] web: hide CopyClipboard widget button when pointless

The widget has been moved in rev. odoo/odoo@15f3bbe but was not very generic.

In particular, there was a traceback when clicking on the button if the field
had no value (the button was displayed for readonly fields in create mode).

The button is now only appended in readonly mode (a `button` inside an `input`
or a `textarea` is not very DOM friendly) if the field has a value.

Task 1941996

closes odoo/odoo#31635

Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>

1 files changed, 20 insertions, 27 deletions

diff --git a/addons/web/static/src/js/fields/basic_fields.js b/addons/web/static/src/js/fields/basic_fields.js
index a5f7649929c..2c8968ca453 100644
--- a/addons/web/static/src/js/fields/basic_fields.js
+++ b/addons/web/static/src/js/fields/basic_fields.js
@@ -1331,7 +1331,9 @@ var CopyClipboard = {
      */
     destroy: function () {
         this._super.apply(this, arguments);
-        this.clipboard.destroy();
+        if (this.clipboard) {
+            this.clipboard.destroy();
+        }
     },
 
     //--------------------------------------------------------------------------
@@ -1346,8 +1348,8 @@ var CopyClipboard = {
         var $clipboardBtn = this.$('.o_clipboard_button');
         $clipboardBtn.tooltip({title: _t('Copied !'), trigger: 'manual', placement: 'right'});
         this.clipboard = new ClipboardJS($clipboardBtn[0], {
-            text: function (_) {
-               return self.value.trim();
+            text: function () {
+                return self.value.trim();
             },
             // Container added because of Bootstrap modal that give the focus to another element.
             // We need to give to correct focus to ClipboardJS (see in ClipboardJS doc)
@@ -1363,40 +1365,31 @@ var CopyClipboard = {
             });
         });
     },
-};
-
-var TextCopyClipboard = FieldText.extend(CopyClipboard, {
-
-    //--------------------------------------------------------------------------
-    // Private
-    //--------------------------------------------------------------------------
-
     /**
      * @override
      */
-    _render: function() {
+    _render: function () {
         this._super.apply(this, arguments);
         this.$el.addClass('o_field_copy');
-        this.$el.append($(qweb.render('CopyClipboardText')));
-        this._initClipboard();
-    }
-});
-
-var CharCopyClipboard = FieldChar.extend(CopyClipboard, {
-
-    //--------------------------------------------------------------------------
-    // Private
-    //--------------------------------------------------------------------------
-
+    },
     /**
      * @override
      */
-    _render: function() {
+    _renderReadonly: function () {
         this._super.apply(this, arguments);
-        this.$el.addClass('o_field_copy');
-        this.$el.append($(qweb.render('CopyClipboardChar')));
-        this._initClipboard();
+        if (this.value) {
+            this.$el.append($(qweb.render(this.clipboardTemplate)));
+            this._initClipboard();
+        }
     }
+};
+
+var TextCopyClipboard = FieldText.extend(CopyClipboard, {
+    clipboardTemplate: 'CopyClipboardText',
+});
+
+var CharCopyClipboard = FieldChar.extend(CopyClipboard, {
+    clipboardTemplate: 'CopyClipboardChar',
 });
 
 var AbstractFieldBinary = AbstractField.extend({