microsoft/immersive-reader-sdk

BUG: "self is not defined" error when using npm package, but not with global UMD one (<script>)

PhilipAngelinNE opened this issue · 9 comments

As soon as an element with the launchAsync function on it renders, I see this error message. Doesn't matter if I don't click, it happens immediately on render.

Using the script tag version works fine.

Hi @PhilipAngelinNE can you let me know if is that happening for any of our samples? Or please let me know what framework/language you are using to try to reproduce the issue.

It's happening on NextJS 12.3.0. I'll let you know if it works in one of your samples.

I can confirm that it worked with your react-sample-simple app. I will try with a fresh Next v12 app later on.

And I can confirm the runtime error happens on a fresh NextJS install (via the Nx build system). So it's fully reproducible.

Is there any possibility you can share a small project that reproduces the issue? We don't have a NextJs sample for now. I also verified our two react samples and are working fine.

Here you go https://github.com/PhilipAngelinNE/immersive-reader-bug

Feel free to replace the token/subdomain strings, but I can assure you it does not matter what you set them to.
And then start with npm run dev and you see it on localhost:3000.

Do you have any updates on the issue?

please check my fork https://github.com/cristobal-buenrostro/immersive-reader-bug

It is working now using dynamic loading.
The reason is because next prerenders the page in server side but IR must be loaded on client side only.

using dynamic loading IR is only loaded in client side, but IR logic must be located in a separate component.

Thank you for the help, I must have used dynamic import incorrectly when I tried it. I can confirm it does fix the problem!