diff --git a/addons/mail/static/src/widgets/form_renderer/form_renderer.js b/addons/mail/static/src/widgets/form_renderer/form_renderer.js
index 62fbede5c70..c2c770995a9 100644
--- a/addons/mail/static/src/widgets/form_renderer/form_renderer.js
+++ b/addons/mail/static/src/widgets/form_renderer/form_renderer.js
@@ -33,6 +33,7 @@ FormRenderer.include({
         if (this.hasChatter) {
             this._chatterContainerTarget = document.createElement("div");
             this._chatterContainerTarget.classList.add("o_FormRenderer_chatterContainer");
+            this.initChatter();
         }
         /**
          * This element will be set when rendering the form view, and
@@ -40,6 +41,15 @@ FormRenderer.include({
          * when applying the rendering into the DOM.
          */
         this.chatterContainerTargetPlaceholder = undefined;
+        this.on('o_chatter_rendered', this, ev => this._onChatterRendered(ev));
+    },
+    async initChatter() {
+        this._chatterContainerComponent = new ChatterContainerWrapperComponent(
+            this,
+            ChatterContainer,
+            this._makeChatterContainerProps(),
+        );
+        await this._chatterContainerComponent.mount(this._chatterContainerTarget);
     },
     /**
      * @override
@@ -63,12 +73,7 @@ FormRenderer.include({
     async __renderView() {
         await this._super(...arguments);
         if (this.hasChatter) {
-            if (!this._chatterContainerComponent) {
-                this._makeChatterContainerComponent();
-            } else {
-                return this._updateChatterContainerComponent();
-            }
-            await this._mountChatterContainerComponent();
+            await this._updateChatterContainerComponent();
         }
     },
     /**
@@ -111,20 +116,6 @@ FormRenderer.include({
     _isChatterAside() {
         return false;
     },
-    /**
-     * @private
-     */
-    _makeChatterContainerComponent() {
-        const props = this._makeChatterContainerProps();
-        this._chatterContainerComponent = new ChatterContainerWrapperComponent(
-            this,
-            ChatterContainer,
-            props
-        );
-        // Not in custom_events because other modules may remove this listener
-        // while attempting to extend them.
-        this.on('o_chatter_rendered', this, ev => this._onChatterRendered(ev));
-    },
     /**
      * @private
      * @returns {Object}
@@ -145,24 +136,6 @@ FormRenderer.include({
             threadModel: this.state.model,
         };
     },
-    /**
-     * Mount the chatter
-     *
-     * Force re-mounting chatter component in DOM. This is necessary
-     * because each time `_renderView` is called, it puts old content
-     * in a fragment.
-     *
-     * @private
-     */
-    async _mountChatterContainerComponent() {
-        try {
-            await this._chatterContainerComponent.mount(this._chatterContainerTarget);
-        } catch (error) {
-            if (error.message !== "Mounting operation cancelled") {
-                throw error;
-            }
-        }
-    },
     /**
      * @private
      */
diff --git a/addons/project/static/src/project_sharing/views/form/renderer.js b/addons/project/static/src/project_sharing/views/form/renderer.js
index 614bb776f3a..a3468ea7736 100644
--- a/addons/project/static/src/project_sharing/views/form/renderer.js
+++ b/addons/project/static/src/project_sharing/views/form/renderer.js
@@ -1,15 +1,39 @@
 /** @odoo-module **/
 
+import '@mail/widgets/form_renderer/form_renderer'; // ensure mail overrides are applied first
+
 import FormRenderer from 'web.FormRenderer';
 import Chatter from '@project/project_sharing/components/chatter';
 import { session } from '@web/session';
 
 export default FormRenderer.extend({
-    _makeChatterContainerComponent() {
-        const props = this._makeChatterContainerProps();
-        this._chatterContainerComponent = new Chatter(this, props);
+    /**
+     * Creates the portal chatter instead of the standard chatter.
+     *
+     * This overridden method is expected to be called from proper lifecycle
+     * method of mail form renderer, when `this._chatterContainerTarget` is set.
+     *
+     * @override
+     */
+    initChatter() {
+        const options = this.makePortalChatterOptions();
+        this.portalChatter = new Chatter(this, options);
+        this.portalChatter.appendTo(this._chatterContainerTarget);
     },
-    _makeChatterContainerProps() {
+    /**
+     * Updates the options of the portal chatter instead of the props of the
+     * standard chatter.
+     *
+     * This overridden method is expected to be called from proper lifecycle
+     * method of mail form renderer.
+     *
+     * @override
+     */
+    _updateChatterContainerComponent() {
+        const options = this.makePortalChatterOptions();
+        this.portalChatter.update(options);
+    },
+    makePortalChatterOptions() {
         // FIXME: perhaps check if we have a parent in the window ?
         // Call the parent window to get the url displayed in the browser since we are in an iframe
         const query = new URLSearchParams(window.parent.location.search);
@@ -25,7 +49,4 @@ export default FormRenderer.extend({
             project_sharing_id: session.project_id,
         };
     },
-    _mountChatterContainerComponent() {
-        this._chatterContainerComponent.appendTo(this._chatterContainerTarget);
-    },
 });