1505932 - Firefox transform-origin on SVG still misaligned with small units (63.0.1, Windows 10)

Status: RESOLVED WORKSFORME

(Core :: SVG, defect, P3)

Description

[Marcus Crowley]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.77 Safari/537.36

Steps to reproduce:

Use CSS to rotate an SVG circle around its centre when the number of viewBox units is low. Note that the stroke width seems to affect this, with some stroke widths being correctly aligned and some now.


Actual results:

The circle is shifted down and to the right when rotated through any angle, or at some stroke-width values. See https://codepen.io/MSCAU/pen/GwozbO including my comments in the CSS portion.


Expected results:

Like in Chrome and Edge, both circles should be perfectly aligned: rotation and stroke-width should not affect the position of the circle.

Comment 1

[Marcus Crowley]

Have just installed latest FF on Windows 10. The issue persists.

Comment 2

[Marcus Crowley]

Attachment: Screenshot of latest FF on Windows 10

Comment 3

[violet.bugreport]

It seems to be yet another Win10 specific problem. Can you try the testcase with hardware accelaration disabled?

Comment 4

[Marcus Crowley]

Yes it is the same issue without HW acceleration. FWIW I have 67.0.1 (64-bit).

Comment 5

[violet.bugreport]

FWIW I have 67.0.1 (64-bit).

Ah, then this is probably the problem. I did find some problem in 67, but it's not misaligned, the blue stroke simply doesn't show. I couldn't find any problem using current Beta 68, or current Nightly 69.

Comment 6

[violet.bugreport]

The 67 problem maybe has something to do with screen DPI. I can see some difference when adjusting layout.css.devPixelsPerPx in about:config between 1 and 2.