diff --git a/app/javascript/controllers/crisp_controller.js b/app/javascript/controllers/crisp_controller.js index 80f256729..97c73803f 100644 --- a/app/javascript/controllers/crisp_controller.js +++ b/app/javascript/controllers/crisp_controller.js @@ -10,11 +10,18 @@ export default class extends Controller { connect() { if (!this.displayCrispValue) { - // If the user is logged out from the app but crisp is still loaded, we loggout the user from crisp - if (window.$crisp) { this.logout(); }; + // If the user is logged out (displayCrispValue is false) but crisp is still loaded, we logout the user from crisp + if (window.$crisp) { + this.logout(); + } return; } + // safe mode is enabled to avoid console warnings related to MutationObserver modifications + window.$crisp = window.$crisp || []; + window.$crisp.push(["safe", true]); + this.#setupMutationObserverOverride(); + if (window.CRISP_TOKEN_ID === this.userCrispTokenValue) { // If the user is already logged in, we don't need to do anything return; @@ -34,6 +41,9 @@ export default class extends Controller { window.$crisp = []; window.CRISP_WEBSITE_ID = process.env.CRISP_WEBSITE_ID; + // Ajout du safe mode pour supprimer l'avertissement dans la console liƩ aux modifs du MutationObserver + window.$crisp.push(["safe", true]); + if (user) { window.CRISP_TOKEN_ID = user.crispToken; window.$crisp.push(["set", "user:email", [user.email]]); @@ -62,10 +72,61 @@ export default class extends Controller { logout() { if (window.$crisp) { - window.CRISP_TOKEN_ID = null; + window.CRISP_WEBSITE_ID = undefined; + window.CRISP_TOKEN_ID = undefined; window.$crisp.push(["do", "session:reset"]); window.$crisp.push(["do", "session:destroy"]); window.$crisp.push(["do", "chat:hide"]); } } + + #setupMutationObserverOverride() { + // Fix for solving Crisp/Turbo incompatibility : https://github.com/crisp-im/crisp-sdk-web/issues/39 + if (!window.originalMutationObserver) { + window.originalMutationObserver = window.MutationObserver + window.listOfObservers = []; + + window.MutationObserver = function(aFunction) { + /* eslint new-cap: ["error", { "newIsCap": false }] */ + + const observer = new window.originalMutationObserver(aFunction); + const { stack } = new Error(); + + if (stack?.includes("crisp")) { + window.listOfObservers.push(observer); + } + + return observer; + }; + + window.CRISP_READY_TRIGGER = () => this.#onCrispReady(); + } + } + + #disconnectAllObservers() { + window.listOfObservers?.forEach((observer) => { + observer.disconnect(); + }); + } + + #reconnectAllObservers() { + window.listOfObservers?.forEach((observer) => { + observer.reconnect(); + }); + } + + #moveCrispToPermanentContainer() { + const crispWidget = document.querySelector(".crisp-client"); + const crispWrapper = document.getElementById("crisp-wrapper"); + + if (crispWidget && crispWrapper && !crispWrapper.contains(crispWidget)) { + this.#disconnectAllObservers(); + crispWrapper.appendChild(crispWidget); + this.#reconnectAllObservers(); + } + } + + #onCrispReady() { + this.#moveCrispToPermanentContainer(); + } } diff --git a/app/views/common/_crisp.html.erb b/app/views/common/_crisp.html.erb index e70618c02..c027907a4 100644 --- a/app/views/common/_crisp.html.erb +++ b/app/views/common/_crisp.html.erb @@ -4,3 +4,4 @@ data-crisp-user-nickname-value="<%= current_agent&.to_s %>" data-crisp-user-crisp-token-value="<%= current_agent&.crisp_token %>"> +