1178297 - CSS transforms not reflected in SVG clipPath content

Status: RESOLVED DUPLICATE of bug 1323962

(Core :: SVG, defect)

Description

[Amelia Bellamy-Royds]

User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:38.0) Gecko/20100101 Firefox/38.0
Build ID: 20150525141253

Steps to reproduce:

Create an SVG `<clipPath>` element, and apply it to content.  Transform the shapes within the <clipPath> using CSS style rules.

See http://codepen.io/AmeliaBR/pen/OVzwgb


Actual results:

The clipping region does not change when the shapes are transformed.  (It does if the SVG transform attribute is used).  Works fine in Blink.


Expected results:

CSS transforms should apply to clipped content as normal, except that the clipPath element itself flattens 3D transforms and cannot have 3D transforms itself:

http://dev.w3.org/csswg/css-transforms/#svg-three-dimensional-functions

Comment 1

[Robert Longson [:longsonr]]

See also bug 1118710. Basically CSS transforms mostly work for direct rendering but not much else so far.

Comment 2

[Josh On]

Another example.

http://codepen.io/joshon/pen/jbGyyP

Works in Chrome, broken in Firefox.