2007555 - x.com - Pinch-to-zoom gesture barely zooms images

Status: RESOLVED FIXED

(Web Compatibility :: Site Reports, defect, P2)

Description

[Calin Tanase]

Environment:
Operating system: Android 16
Firefox version: Firefox Mobile [phone]

Preconditions:

• must be logged in

Steps to reproduce:

1. Go to https://x.com/
2. Tap on an image.
3. Try zooming in and out.

Expected Behavior:
The image is zoomed in and out correctly.

Actual Behavior:
Image barely gets zoomed in/out.

Notes:

• Reproduces regardless of the status of ETP
• Reproduces in firefox-nightly, and firefox-release
• Does not reproduce in chrome

Created from https://github.com/webcompat/web-bugs/issues/196790

Comment 1

[Calin Tanase]

Attachment: zoom FF vs Chrome.mp4

Comment 2

[Hiroyuki Ikezoe (:hiro)]

I guess this is another sort of bug 1891595.

While pinch zooming in, I see the transform relevant styles on an element are being change, for example;

 <div class="css-175oi2r r-13awgt0" style="transform: scale(1); transform-origin: 269px 455px 0px;">

This is the element and while pinch-zooming in, the transfrom-origin is being changed, but the scale keep staying 1. It's very likely that the site fails to calculate the scale value properly.

Comment 3

[Hiroyuki Ikezoe (:hiro)]

Now I am almost 100% sure the underlying problem is same as bug 1891595.

There's a similar code pattern on x.com, similar to the mastodon case in a function which gets called via a touchmove event listener

          this._lastDistance = c,
          this.setState({
            lastX: p.x,
            lastY: p.y,
            zoom: u,
            zoomCenter: m
          })

I dumped the lastDistance value and zoom's u value;

zoom: 0.8849417288623925, lastDistance: 409.9573148511928 bundle.TweetMediaDetail.7272608a.js:formatted:425:16
zoom: 1, lastDistance: 409.9573148511928 bundle.TweetMediaDetail.7272608a.js:formatted:425:16
zoom: 0.9271265916973205, lastDistance: 264.09278672466615 bundle.TweetMediaDetail.7272608a.js:formatted:425:16
zoom: 1, lastDistance: 264.09278672466615 bundle.TweetMediaDetail.7272608a.js:formatted:425:16
zoom: 0.996639273541688, lastDistance: 263.20524310887123 bundle.TweetMediaDetail.7272608a.js:formatted:425:16
zoom: 1, lastDistance: 263.20524310887123

You can see the same lastDistance value on each 2 lines, thus the zoom value is computed to 1.0 unfortunately.

Comment 4

[Hiroyuki Ikezoe (:hiro)]

Can someone confirm that this issue has been resolved on latest Fenix nightlies?

Comment 5

[Calin Tanase]

This is working now on latest Fenix Nightly.

Comment 6

[Hiroyuki Ikezoe (:hiro)]

Thanks for the quick check!