Set a delay for showing the TWC icon/callout on website

Deployment
1

I hope this is the right place to ask this!

Back Story:

If a user clicks to open the TWC window before the page is completely loaded, errors occur with some of the functions I want to perform once TWC is loaded. Most of these are related to pulling information and getting Agent Status/agent information from a third part live agent application. It is unlikely that an end user ends up clicking within the first 5 seconds, but it is possible. (the only reason I discovered this was an issue was from my own testing).

To solve this I was considering adding a time out delay in showing the “Open Chat” icon and the callout we have, but I am unsure of what element actually controls how/when/where the icon appears on the users screen. I only want to delay the icon, not the loading of the engine. I reviewed the documentation on the developer website and I am still unclear on how i would go about doing this!

2

Hi,

when TWC is fully initialized, the “ready” listener is executed. You can add your own one like this:

TeneoWebChat.on('ready', () => {
    // Your code here:
    ...
});

Just to be clear: we are talking here about the TWC code, not about any 3rd party additions that can have their own initialization logic and “readiness” criteria.

If your goal is to allow the user open TWC first after some other code has been executed, I can see two ways to implement it:

Call window.TeneoWebChat.initialize(...) first after your code has been executed, not just directly in the window’s “load” listener. This would be the easiest approach. If for whatever reason it is not feasible, then you can preventively hide the TWC launch icon and “unhide” it first when your code is ready. I don’t think you can do it via any standard TWC API though so you will have to act on the HTML structure directly. Depending on how you implement it, you might get competing executions in your additional code and regarding the TWC initialization readiness (as per the “ready” listener above), something you might have to take into account as well.