Bug: react-scan is unusable in iOS Safari

[FabianKoder]

Hi! First of all, we really like the tool and it greatly helps in various situations, so thank you very much.

We frequently test our site in the iOS Simulator on the Safari browser, and sadly react-scan is unusable there. Not only do re-renders not show up entirely, but inspect element also does not work.
That is not really the immediate problem we face though, since our main goal is not to optimize it inside the emulated Safari Browser. The issue is the the overlay cannot be moved whatsoever, the touch gesture just phases through. This impacts testing in some situations, since some elements in the viewport are blocked.

So the following immediate solutions came to mind:

• Fix the overlay not being moveable
• Hide the overlay on iOS Safari (or mobile browsers?) completely, since it does not really work anyway except for the FPS counter

Since we are using the recommended way of including the Script in the NextJS Head, we cannot decide at runtime if we want to enable it. If there is a possibility to programmatically hide the overlay, this could be an acceptable workaround as well for the time being, but to be honest I would rather wish to not write any custom global hook that checks for that.

Thank you again.

[lxsmnsyc]

Since we are using the recommended way of including the Script in the NextJS Head

I would assume there's no RDT installed so it's most likely the previous issue we had (a timing issue for the setup). It should be fixed in the next version.

[FabianKoder]

Thanks for the quick response.
After updating to 0.2.7 the issue actually seems to be that we used the NextJS <Script> tag (which is the recommended way, plus normal script tags produce ESLint errors). By default the loading strategy is afterInteractive, but after setting it manually to beforeInteractive the render indicators work as expected. Interestingly enough though it worked without issues in Chrome Desktop.
But, the overlay still cannot be moved, so it seems like it may be a different issue.

[lxsmnsyc]

I see, I'll take a look.

Would it be possible for you to switch to just a plain script element? besides the linter error of course.

[FabianKoder]

Yeah I have tried it to rule that out as an issue, seems to have the same effect though

[lxsmnsyc]

Interesting, I'll have to check a similar setup.