Content inside iframe fails to render when fixed element is present and height & width are set to 100%

[Oudwins]

Obligatory notice: I am still quite new to all this... Sorry for my ignorance in advance.

Description of the issue
The content inside of the iframe fails to render when using nextjs

When the issue occurs
There might be more cases, but I have identified that the issue occurs when there is a fixed positioned element outside the iframe and the iframe height & width is set to 100% when using nextjs

Minimal sandbox
https://stackblitz.com/edit/stackblitz-starters-blgci5?file=app%2Fpage.tsx

Am I willing to submit a PR
Potentially but I have no idea what is happening so if someone could at least point me in the right direction I would appreciate it.

[Oudwins]

Upon further testing, this seems like it might be related to nextjs SSR. The issue seems to be fixed if you force the entire component or page to load on the client

[edge-rps]

Obligatory notice: I am still quite new to all this... Sorry for my ignorance in advance.

Description of the issue The content inside of the iframe fails to render when using nextjs

When the issue occurs There might be more cases, but I have identified that the issue occurs when there is a fixed positioned element outside the iframe and the iframe height & width is set to 100% when using nextjs

Minimal sandbox https://stackblitz.com/edit/stackblitz-starters-blgci5?file=app%2Fpage.tsx

Am I willing to submit a PR Potentially but I have no idea what is happening so if someone could at least point me in the right direction I would appreciate it.

Thank you for reporting @Oudwins I had the same issue with NextJS Static, I switched my project to use Vite React and that fixed the problem.

[Oudwins]

Oh man. This was so long ago I don't even remember if I fixed it or what.... good to know of a work around though.