I want to use the JSM widget in an app I am developing using Next.js and TypeScript.
If I use the regular html <script> tag in the _document.tsx, the widget is rendered correctly in the browser and is usable.
<Html>
<Head>
<script
async
id="jira-service-desk-widget"
data-jsd-embedded="true"
data-key="some-data-key"
data-base-url="https://jsd-widget.atlassian.com"
src="https://jsd-widget.atlassian.com/assets/embed.js"></script>
...
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
But I want to use the next.js <Script> tag in order to optimise the loading of the app using the 'strategy: lazyOnLoad' prop. When I do this, the script can be seen when I inspect the html in the browser but the widget is not rendered at any point.
<Html>
<Head>
<Script
id="jira-service-desk-widget"
data-jsd-embedded
data-key="some-data-key"
data-base-url="https://jsd-widget.atlassian.com"
src="https://jsd-widget.atlassian.com/assets/embed.js"
strategy="lazyOnload"></Script>
...
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
use
strategy='beforeInteractive'
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.