Bug 253540 – View->Zoom In makes text sized with viewport units bigger (contrary to other browsers)

• Component: Layout and Rendering
• Status: RESOLVED WONTFIX

[Nick Sherman]

Created attachment 465346 [details]
Screenshot comparing the result of zooming in different browsers

Recent versions of Safari seem to have changed/broken how zooming affects type sized with viewport units (perhaps when used in combination with `calc()` and/or custom properties?).

I noticed the bug when viewing the home page for last year’s Typographics website:
https://2022.typographics.com

In previous versions of Safari, zooming the homepage changed the size of the body type but retained the large type’s size relationship with the viewport – similar to how it works in Chrome and Firefox. Unfortunately I don't know which version of Safari was the one where the bug first appeared, but it is presumably a recent release, since I don't recall seeing this bug when testing page zooming on that same page last year, and the code hasn't changed since then.

If it's helpful, I'm attaching a screenshot showing the homepage zoomed to similar levels in Chrome v110.0.5481.177 on the left, Firefox v110.0.1 in the middle, and Safari v16.3 (18614.4.6.1.6) on the right, all running in macOS Ventura 13.2.1 (22D68).

[Alexey Proskuryakov]

Thank you for the report! Do you happen to know when this last worked as expected?

[Radar WebKit Bug Importer]

<rdar://problem/106396794>

[Nick Sherman]

(In reply to Alexey Proskuryakov from comment #1)
> Thank you for the report! Do you happen to know when this last worked as
> expected?

Unfortunately no. As I mentioned before I don't know which version this first became an issue in but I believe it would have been within the last year.

[Nick Sherman]

Coincidentally, this bug also affects the new 2023 Typographics website too. Compare the difference in zooming this page between the latest versions of Safari and Chrome/Firefox:
https://2023.typographics.com

[Myles C. Maxfield]

When you say "zooming the homepage" can you be more specific? We have like at least 4 different ways of zooming, and I'll need to know which kind you're describing in order to investigate.

[Nick Sherman]

(In reply to Myles C. Maxfield from comment #5)
> When you say "zooming the homepage" can you be more specific? We have like
> at least 4 different ways of zooming, and I'll need to know which kind
> you're describing in order to investigate.

The technique I tested against was pressing Command-Plus Sign (+) or Command-Minus Sign (-)

[Myles C. Maxfield]

This is because the content has font-size:16vw;

When the user does command-plus in WebKit, we increase the size of the text, but other browsers don't.

There is no spec here, and it's not obvious which behavior is correct. On one hand, not matching the other browsers is bad; but on the other hand, having command-plus do nothing in those other browsers is also bad.

How confident are we that this is a regression?

[Myles C. Maxfield]

Created attachment 465544 [details]
Reduction

[Antti Koivisto]

`vw` unit resolution is not affected here. Cmd-+ mutates the `zoom` property which increases the computed font size after unit resolution.

[Antti Koivisto]

You can ignore the zoom with

<div style="font-size: 16vw; zoom: reset">Hello</div>

[Simon Fraser (smfr)]

`zoom` is not a standardized property, however.

[Myles C. Maxfield]

Given that we want command-+ to do things, even when the sizes are in viewport units, and given that there's a workaround (using zoom:reset), I'm inclined to close this as WONTFIX.

[Myles C. Maxfield]

I'm going to do so. Please feel free to re-open this, if you disagree with this conclusion.