Append <script> content with javascript (Login of zendesk)

Question

I have a React app where i append a zendesk script to be shown only if a certain type of user is logged in.

I also want to use the auto log in proposed by zendesk : https://developer.zendesk.com/embeddables/docs/widget/api#content => ze.identify

I don't know how to do it. Here is my code of plugin zendesk, and i need to append it right after :

// Specify which user can have Zendesk
        if (this.props.user.organisation === "organisationName") {
            // Start of Zendesk Chat Script
            const script = document.createElement("script");

            script.src = "myzendesklink";
            script.async = true;
            script.id = "zendesk"

            console.log()
            document.body.appendChild(script);
            //Something here for login
            const scriptLogin = document.createElement("script");

            document.body.appendChild(scriptLogin);
            // End of Zendesk Chat Script
        }

And the code i want to append :

<script>
  zE(function() {
    zE.identify({
      name: 'John Citizen',
      email: '[email protected]',
      organization: 'VIP'
    });
  });
</script>

The first part is okay and working, however the second one I'm struggling with it.

If anyone know how to append this script i'll be happy to know :), thanks to the community

Answer 1

Based on @CBroe comment, you could try something like that:

if (this.props.user.organisation === "organisationName") {
    // Start of Zendesk Chat Script
    const script = document.createElement("script");

    script.text = "zE(function() { \
        zE.identify({ \
            name: 'John Citizen', \
            email: '[email protected]', \
            organization: 'VIP' \
        });
    });";

    document.body.appendChild(script);

    // ...
}