1612347 - SVG CSS "transform" animation breaks with nested transform-box: fill-box property

Status: NEW

(Core :: SVG, defect, P3)

Description

[Max Hoffmann]

Attachment: workshop-pass.svg

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.130 Safari/537.36

Steps to reproduce:

Open the SVG file in Firefox

Actual results:

The node with the class .card in the SVG does not stay on the rope. It seems it is still adjusting its transformation to the rotating child node (.diesdas), which has transform-box: fill-box; applied.

Expected results:

Like in Safari or Chrome, a SVG child node’s transform-box property is taken into account, so that the parent’s node (.card) transformation is applied properly.

Comment 1

[Marco Perez [:mpk]]

Attachment: reduced testcase

I can confirm this for fairly current trunk builds, tested on FreeBSD stable.
The correct component may be CSS..., though.
This reduced testcase might be a bit easier to debug than the original one.

Comment 2

[Daniel Holbert [:dholbert]]

Attachment: testcase 3 (more reduced)

Here's a further-reduced testcase.

Comment 3

[Daniel Holbert [:dholbert]]

Attachment: testcase 3 (more reduced)

(er sorry, that was the wrong file and was slightly over-hacked. here's the right one)

Comment 4

[edA-qa mort-ora-y]

Attachment: sample.html

An example with a more pronounced breakage.

Comment 5

[edA-qa mort-ora-y]

Comment on attachment 9264757 [details]
sample.html

wrong file uploaded.

Comment 6

[edA-qa mort-ora-y]

Attachment: sample.html

A simple example with a more pronounced visual anomaly.