Popup position moves after keyboard opens/closes on mobile

ailon / markerjs2

Add image annotation to your web apps.

https://markerjs.com

Other

142 stars 39 forks source link

Popup position moves after keyboard opens/closes on mobile #170

Closed ahaurat closed 1 year ago

ahaurat commented 1 year ago

To reproduce:

Visit the popup sandbox on mobile (iPhone in my case): https://codesandbox.io/s/9707i
Use the text tool to add text
Close the keyboard and the popup position is now too high (see screenshot) and the tools are no longer accessible

ailon commented 1 year ago

I can see the page shifting a bit on an iPhone (not on Android though). Not to the point of toolbar getting off-screen, but yeah I can see how this can become problematic. I remember fighting Safari on a text input related issue a while back but can't recall the details. Will need to investigate.

Do you experience the same issue in your own implementation or just on codesandbox? Just asking because it could be a little "special case" over there.

ahaurat commented 1 year ago

I see it in my own implementation as well; I only used the codesandbox link since it's an easy way to reproduce. Thanks for taking a look!

ailon commented 1 year ago

I've changed how the popup is positioned and it seems to have fixed it in my local tests and in the demo on markerjs.com. Still acts weird in the codesandbox demo. But the whole codesandbox UI seems to get shifted/extended, so maybe that's not a marker.js issue there.

Let me know if 2.31.2 fixes it for your case.