Bug 287719

Created attachment 474236 [details] Repro screenshot If a parent element uses a transform:scale() and a child element has a scrollbar, everything inside the parent will render as interpolated/blurry. Please see the following code: ``` <div style="position: absolute; transform: scaleX(4) scaleY(4);"> <svg width="40" height="60" xmlns="http://www.w3.org/2000/svg" style = "position: absolute; top: 0px; left: 0px;"> <rect width="40" height="60" stroke="blue" fill="none" /> </svg> <div id = "textrect" style="position: absolute; overflow: scroll; height: 100px; top:70px;"> text<br> text<br> text<br> text<br> text<br> <!-- remove this line and it renders sharply --> </div> </div> ``` See screenshot. Both the SVG and the text rectangle themselves as blurry. If you remove one line such that a scrollbar does not appear (or change the overflow to hidden), it will re-render as scaled crisp. I do not know if this is a recent regression, first noticed on: Safari Technology Preview, Release 213 (Safari 18.2, WebKit 20621.1.11.111.1) It also happens on the shipping Safari Version 18.3 (20620.2.4.11.5). This *does not* affect Chrome or Firefox.