Created attachment 356954 [details]
webkit-transform-bug.svg test case
Transforms for SVG elements are not reset when a style with a CSS transform becomes inactive.
Steps to reproduce:
1. Open https://codepen.io/anon/pen/QzwLyG?editors=1100 (or the attached test case which shows the same test)
2. Move the mouse over the blue box - it is scaled by 2. (using :hover style)
3. Move the mouse out of the blue box - the transform isn't set back to the initial non-scaled transform.
This works in Firefox 63 and Chrome 71. The blue box returns to the initial non-scaled transform.
The bug doesn't happen if the initial transform is given as a style in the stylesheet. The bug is visible only when setting the initial transform as an attribute. So, there seems to be something wrong how the transform attribute is handled.
Tested on Safari Technology Preview Release 71 (Safari 12.1, WebKit 14607.1.15). At least Safari 12.0 and 11 have the same bug.
Possibly related bugs (the SVG transform attribute has been promoted to a presentation attribute only recently):
Transforms tracking bug
Harmonize HTML & SVG rendering
Merge CSS and SVG Transforms according to CSS3 Transforms
Master bug: Turn more SVG attributes to presentation attributes
Scaled SVG elements are leaving artifacts during animation
SVG transitions of transforms are not properly reset after the transition is removed
This codepen shows that the opacity, width and height presentation attributes work just fine in a similar situation. So, the issue seems to be specific to the transform attribute and property.