Bug 264954

Created attachment 468619 [details] Small testcase. Zoom with +/-. Toggle content layer with spacebar. We use a zooming setup, and to keep things sharp, do: 1. a global transform to zoom in or out (adding will-change: transform) 2. zoom content layers to match the size they are displayed at (adding will-change: transform) 3. zoom an inner layer back down to not distort actual content (no will-change) 4. actual content Which works great normally. Element 1 becomes a transformation layer, element 2 becomes a layer backed by the appropriate amount of pixels. As users zoom, we sometimes switch the size and scale of that layer. Until the content contains layers itself (backdrop filters, or simply will-change: transform set), then element 3 becomes a layer on its own, and it's amount of backing pixels is insufficient, making everything blurry. This is unexpected and inconsistent. This setup works in all other browsers. (It works also in Firefox, though it doesn't use layers like this.) I suspect that in Safari 14 this setup works, but I cannot test this, it used to work. In Safari 15.6 and Safari 16 that element 3 becoming a layer is unavoidable. One workaround is to use `zoom: X` instead of `transform: scale(X)` for 3, except that texts don't behave the same at all zoom levels. See the attachment for a minimal setup. If you turn on "Show Compositing Borders" in the inspector layer panel, you can see what is happening.