From 1814888a7f959d4412fd73d9b5a3e8d66ee06ccf Mon Sep 17 00:00:00 2001
From: Lucas Perais <lpe@odoo.com>
Date: Mon, 8 Aug 2022 11:44:15 +0000
Subject: [PATCH] [FIX] mail: text emojis field should remove its dropdown on
 destroy

Have a field with widget text_emojis.
Click Edit on the form view.
Click Save.

Before this commit, the button that opens the dropdown was still present in the dom in readonly mode.

After this commit, it is correctly removed.

closes odoo/odoo#97704

Signed-off-by: Lucas Perais (lpe) <lpe@odoo.com>
---
 .../mail/static/src/js/field_emojis_common.js |  7 +++
 .../components/field_text_emojis_tests.js     | 46 +++++++++++++++++++
 2 files changed, 53 insertions(+)
 create mode 100644 addons/mail/static/tests/qunit_suite_tests/components/field_text_emojis_tests.js

diff --git a/addons/mail/static/src/js/field_emojis_common.js b/addons/mail/static/src/js/field_emojis_common.js
index b1498c5ae05..2a32decb3fe 100644
--- a/addons/mail/static/src/js/field_emojis_common.js
+++ b/addons/mail/static/src/js/field_emojis_common.js
@@ -131,6 +131,13 @@ var FieldEmojiCommon = {
         } else {
             this.$emojisIcon.hide();
         }
+    },
+
+    destroy() {
+        this._super(...arguments);
+        if (this.$emojisIcon) {
+            this.$emojisIcon.remove();
+        }
     }
 };
 
diff --git a/addons/mail/static/tests/qunit_suite_tests/components/field_text_emojis_tests.js b/addons/mail/static/tests/qunit_suite_tests/components/field_text_emojis_tests.js
new file mode 100644
index 00000000000..b48a21bf78f
--- /dev/null
+++ b/addons/mail/static/tests/qunit_suite_tests/components/field_text_emojis_tests.js
@@ -0,0 +1,46 @@
+/**@odoo-module **/
+
+import { clickEdit, clickSave, getFixture } from "@web/../tests/helpers/utils";
+import { makeView, setupViewRegistries } from "@web/../tests/views/helpers";
+
+QUnit.module("Field text emojis", (hooks) => {
+    let target = undefined;
+    let serverData = undefined;
+    hooks.beforeEach(() => {
+        target = getFixture();
+
+        serverData = {
+            models: {
+                partner: {
+                    fields: {
+                        foo: { type: "char" }
+                    },
+                    records: [{ id: 1 }]
+                }
+            }
+        };
+
+        setupViewRegistries();
+    });
+
+    QUnit.test("emojis button is not shown in readonly", async (assert) => {
+        await makeView({
+            type: "form",
+            resId: 1,
+            resModel: "partner",
+            arch: `<form><field name="foo" widget="text_emojis" /></form>`,
+            serverData
+        });
+
+        assert.containsOnce(target, ".o_field_text_emojis");
+        assert.containsOnce(target, ".o_field_text_emojis button");
+        assert.isNotVisible(target.querySelector(".o_field_text_emojis button"));
+
+        await clickEdit(target);
+        assert.isVisible(target, ".o_field_text_emojis button .fa-smile");
+
+        await clickSave(target);
+        assert.containsOnce(target, ".o_field_text_emojis button");
+        assert.isNotVisible(target.querySelector(".o_field_text_emojis button"));
+    });
+});