Problem Statement
When trying to add a <script></script>
into the template via the Auth0 CLI. Storybook breaks the code as it’s unable to parse the ending </script>
tag correctly.
Steps to Reproduce
Launch Auth0 CLI + Storybook as per this article: https://auth0.com/docs/customize/universal-login-pages/universal-login-page-templates#using-the-auth0-cli-
Set the template to:
<!DOCTYPE html>
<html>
<head>
{%- auth0:head -%}
<script>console.log("test");</script>
</head>
<body>
{%- auth0:widget -%}
</body>
</html>
Using the Storybook to see live updates
Received the Uncaught SyntaxError: Unexpected end of input at insertScript
Cause
The issue is that when the browser encounters the closing tag inside an open <script>
tag, regardless of the context, it will terminate the script tag there.
Solution
As a workaround, please add the backticks and + characters to trick the system. Here is the sample template code that will inject the <script>
tag:
<!DOCTYPE html>
<html>
<head>
{%- auth0:head -%}
<scr`+`ipt>console.log("test");</scr`+`ipt>
</head>
<body>
{%- auth0:widget -%}
</body>
</html>