Pinch not working properly when content is fullscreen on mobile devices

[renelimonglobant]

Describe the bug
I'm trying to make an element that covers all the screen or almost all. I show you how is the code:

             <TransformWrapper
                initialScale={1}
                centerOnInit
                limitToBounds={true}
                disablePadding>
                <TransformComponent
                  wrapperStyle={{ overflow: 'visible' }}>
                  <img src="https://images.pexels.com/photos/674010/pexels-photo-674010.jpeg" />
                </TransformComponent>
              </TransformWrapper>

Pinch works fine when the content is small. The way I pinch is putting a finger outside of the image are and other inside of it and works fine. But when I put two fingers inside the image(or the image covers most of the screen), the pinch method is really hard to achieve, to make it work I need to place one finger completely still and move the other to pinch. Is a trick I found out but other user couldn't be able to pinch easily

This is happening on android devices, on ios I only tested on simulator so i can't say this is happening too

[DanielSpindler]

pls tag me as soon as you found out how to get around with this. Rn i think the problem appears when image is used inside of a dialog.

[renelimonglobant]

I tried adding a single image on a regular html code an it keeps happening, when pinching with two fingers inside the TransformComponent area it's really hard to pinch

[DanielSpindler]

#506 is the only related issue ive found so far, but downgrading does not work for me. might work for u ?

[renelimonglobant]

@DanielSpindler seems like this issue is solved in version v3.7.0

[DanielSpindler]

ye then use a real iphone. its still not resolved. iPhone 15 Safari + Chrome. empty project based off next.js. works on "software" solutions like browserstack. but they imitate the pinch. Poor Testing.