Script doesn't execute second time when it's added with <script> tag then removed then added again.
In my scenario, I'm injecting wormhole-connect to a Vue app with useScriptTag which does that automatically. Switching to a page with the bridge then to a different page then back doesn't work.
The script runs the React app on step 1, but doesn't run it on step 3.
Expected behavior
The script runs the React app on both step 1 and step 3.
Solution recommendation
1) Define some global function that will could be executed manually to "re-run" the script.
2) Better yet, provide an additional CJS build for cases like this.
Cause of the problem
The script relies on the side effect in src/main.tsx:
Description and context
Script doesn't execute second time when it's added with
<script>
tag then removed then added again.In my scenario, I'm injecting wormhole-connect to a Vue app with useScriptTag which does that automatically. Switching to a page with the bridge then to a different page then back doesn't work.
Steps to reproduce
document.createElement("script")
pointing to https://www.unpkg.com/@wormhole-foundation/wormhole-connect/dist/main.js with type: module.Stackblitz reproduction: https://stackblitz.com/edit/nuxt-starter-cbmqng
Experienced behavior
The script runs the React app on step 1, but doesn't run it on step 3.
Expected behavior
The script runs the React app on both step 1 and step 3.
Solution recommendation
1) Define some global function that will could be executed manually to "re-run" the script. 2) Better yet, provide an additional CJS build for cases like this.
Cause of the problem
The script relies on the side effect in
src/main.tsx
:https://github.com/wormhole-foundation/wormhole-connect/blob/3d044b899befeeb8a1d3e535b6aea8dbd0979551/wormhole-connect/src/main.tsx#L8-L17
However, the browser won't run side effects on a module script that it has already imported before, even when the corresponding Githubissues.