Adding <script> tag at the head of the application

  • Goal: I would like to add a custom analytics library at the main head of the application, ex:
<head>
   <script src="https://library.internal.com/analytics.js" app="app-name" async="true"></script>
</head>
<body>
....
</body>
  • Steps: I have tried the following:
  1. Adding the script in the preloaded app JS:
const script = document.createElement('script');
script.id = 'ANALYTICS';
script.src = 'https://library.internal.com/analytics.js';
script.type = 'text/javascript';
script.setAttribute('app', 'app-name');
script.setAttribute('async', 'true');
script.setAttribute('store-html', 'false');
document.body.appendChild(script);
  1. Adding the script in the global preloaded JS (same as above)
  2. Adding the script in a custom component and importing it in the app

Unfortunately, all of these options lead to the same unsuccessful result: the script is adding in a 1x1 iFrame that does not produce any analytic events.

The script should be at the same level as the body/main app. In this case, the iFrame isolates the script from listening to anything, so that's likely why it is not working. Does anyone know if there are any good workarounds for this?

1 Like

Hello @pablo.estrada!

I completely understand the desire to use a custom analytics library for an application, unfortunately, adding in any tags to the head of the app is not currently possible :sweat:

I had another user ask about the same functionality and the preloaded JS will only be able to add tags to the iframe which are not of any use.

We are currently working on a major feature release to support custom as well as major popular analytics tracking tools into Retool apps, so please stay tuned for that.

We currently have some built in user analytics tools, but these are only available to enterprise customers.

We will be working on allowing for users to use third party tools and seamless integration for more tiers of plans and I can add in your +1 to the feature request and keep this thread updated with any news I hear from our engineering team :sweat_smile:

3 Likes

Hi Jack! I'm facing the same issue as Pablo and was wondering if this feature has been added yet. Any updates would be greatly appreciated!

Hi @micapareddes,

Unfortunately there won't really be a possibility of Retool allow for script tags to be embedded into apps. Due to the code for the app being run and executed in a sandboxed environment.

Are you looking to track metrics on the users of your app? Are they internal users or external users? There are other tools built into Retool for tracking these and some integrations with third party tools for tracking app usage and user flows.

If you let me know about what you are looking to track and in what context I can direct you to more resources!

Thanks for the clarification! I'm on the Business plan and looking to track how external users interact with my multi-page app—mainly from a usability perspective. I’d like to see if users can easily find the features they need, how they interact with different components, and where they might face difficulties.

Is this possible within Retool, or is there a workaround? From what I’ve seen, Retool Analytics is only available on the Enterprise plan. Are there any supported third-party integrations for capturing usability insights, such as heatmaps, session recordings, or user flow tracking?

Any guidance would be greatly appreciated—thanks!

Thanks for explaining!

Let me double check with our observability team. I believe that the tools for doing such are only for enterprise plans :sweat: with Segment and Google Analytics being the two third party platforms that we have built in integrations for.

Will let you know what I hear from the team.

1 Like