tidioChatApi.setVisitorData not updating user name

Question

In my index.html i have the following code to display a tidio live chat. This sets the name as a guest as they haven't logged in before. (that works)

<script
      src="tidio link"
      async
></script>
<script>
  document.tidioIdentify = {
    name: "Guest", // Visitor name
  };
</script>

However, once they do login i want to get their logged in name. i have added this code to the html on the homepage (separate html from above) like this:

<script>
tidioChatApi.setVisitorData({
name: "bob",
});
</script>

However, it is never updating the name. Does anyone know why? The script doesn't seem to be getting called

Answer 1

You need to check if Tidio is ready before calling "setVisitorData" as per the following example:

<script>
    document.tidioIdentify = {
        name: "Guest", // Visitor name
    };
</script>
<script src="//code.tidio.co/xxxxxxx.js" async></script>
<script>
    (function () {
        function onTidioChatApiReady() {
            tidioChatApi.setVisitorData({
                name: "bob",
            });
        }
        if (window.tidioChatApi) {
            window.tidioChatApi.on("ready", onTidioChatApiReady);
        } else {
            document.addEventListener("tidioChat-ready", onTidioChatApiReady);
        }
    })();
</script>

References to Tidio documentation here:

https://docs.tidio.com/docs/listeners_events

https://docs.tidio.com/docs/visitor_identification