laynecornwall | 2024-08-02 12:08:24 UTC | #1
We are attempting to deploy two messenger code snippets to a website. One messenger will be used for pre-login, and one will be deployed in post login. I have created our deployments and provided the code to the web developers. Upon testing, we have noticed that after logging in, the external messenger is still displayed. Upon refreshing the browser, the internal messenger will be displayed. From our Devs
Use case:
- Show external messenger on login page when application loads
- Show internal messenger as soon as the user logs in
- Show external messenger again once the user logs out
The script looks the same for both internal and external messenger but with a different deployment id. This script is added to the html which executes genesys.min.js asynchronously which in turn creates the iframes that render the messenger functionality. These iframes are contained within two divs with ids: genesys-messenger and genesys-thirdparty.
The issue we are seeing:
We are using this script in an Angular application, where we have an event listener that listens on user login and logout. On initial launch of login screen, we add the external messenger script to the <head> element, which loads genesys.min.js which in turn creates the iframes.
Once the user logs in, we delete the divs with ids genesys-messenger and genesys-tirdparty to get rid of the existing external messenger code, and we delete the external messenger script and the script that loads genesys.min.js that was added on login screen. Then we add the internal messenger script to the <head> element. This adds the iframes for messenger. But the body of the iframe html is an empty <div>. This causes the messenger to not show up.
Similarly, we delete the existing iframes and internal messenger code, and add the external messenger code when the user logs out. But again, the newly generated iframes have an empty <div> in the body, so the messenger does not show up.
Sample of the empty iframe code:
If the genesys-messenger div is not deleted on logout and login, then additional div is added with same id causing one of them to display the messenger and the other to have an empty <div> in the body.
What is causing the genesys-mxg-frame iframe from above snippet to not show up when we are deleting the old divs and letting the async script add new ones?
Are there any other elements that we need to delete before loading the new messenger script?
RanjithManikanteSa | 2024-08-05 18:23:40 UTC | #2
Hi @laynecornwall,
Please do not try to programmatically any write code to manipulate with Messenger HTML DOM contents or styles. They are subject to change as and when required.
For you use case - once the Messenger is loaded, it cannot be unloaded with out a page reload. Deleting the HTML DOM elements and Messenger iFrames will only remove the DOM part, but the Javascript assets (Messenger Javascript files) which were already loaded into the browser will still be there by the nature of the browser. So, just removing the HTML DOM contents and Messenger instrumentation script is not sufficient to unload the Messenger.
You can only have one instance of Messenger running at any point of time. The new Messenger is not appearing because the old instance is still present in the browser.
How to properly unload previous Messenger - do a page reload programmatically.
After successful login, you can programmatically try to reload the page using window.location.reload() that should do everything you are trying to do. Then in the login success callback function, you will run the Messenger script with the deploymentId that you prefer, in this way you are not loading the external Messenger that you don't want when user is logged in.
Similarly, on successful logout you will programmatically reload the page and only run the Messenger script with the correct deploymentId that you want when user is not logged in.
Hope this helps, thanks.
system | 2024-09-04 18:24:01 UTC | #3
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
This post was migrated from the old Developer Forum.
ref: 27549