LWR Sites for Experience Cloud
jNewer Version Available
Integrate Third-Party Libraries Using the Privileged Script Tag
An LWR site encapsulates all of its elements in shadow DOM, which prevents global
interaction with any component on the page. As a result, third-party JavaScript libraries, such
as Google Analytics and Google Tag Manager, often can’t interact with page components as needed.
But with the <x-oasis-script> privileged script tag,
you can allow these third-party libraries to bypass shadow DOM in your LWR site.
Use the custom <x-oasis-script> tag in place of the standard <script> in the head markup or inline. Scripts loaded within this custom tag run inside a special iframe that’s exempt from shadow DOM and are always executed asynchronously.
<x-oasis-script> uses the same syntax as the <script> tag.
You can also use the tag to add event listeners and to import and export global variables with the imported-global-names and exported-global-names attributes.
For example, this code sample defines a global variable—testVar—on the outer window, which is then
imported for use in the x-oasis-script window. The
global variable must be imported to define it in the privileged
scope.
In turn, this example exports the testVar global
variable from x-oasis-script.