Intent to implement and ship: force flattening of transform-style:preserve-3d when opacity is applied

[Matt Woodrow]

Summary:

The editors draft of the 3d transforms spec [1] has been updated to say
that we need to flatten preserve-3d when the element also has an opacity
of < 1, whereas the previous spec [2] made no mention of opacity.

The current behaviour (in Gecko, WebKit and blink) is to drop the
'group' nature of opacity, and propagate the opacity effect down on to
the leaves of the preserve-3d tree. This is non-intuitive, not specified
at all, and has slightly differently rendering in all browsers (based on
the specifics of what compositable layers get created I believe - see
layout/reftests/opacity-preserve3d-N.html reftests).

The blink team intend to change their behaviour to match the new spec,
even though it might break webcompat in some cases. The initial
www-style discussion [3] and their intent to implement thread [4] covers
their motivations for wanting to do this.

Given that the existing behaviour appears to be used incredibly rarely
[5] and that it moves us to well specified behaviour that is easy to
conform to, then I think we should do the same.


Bug:

https://bugzilla.mozilla.org/show_bug.cgi?id=1283827


Link to standard:

Editors draft:
https://drafts.csswg.org/css-transforms/#grouping-property-values
<https://www.google.com/url?q=https%3A%2F%2Fdrafts.csswg.org%2Fcss-transforms%2F%23grouping-property-values&sa=D&sntz=1&usg=AFQjCNHxIkBTJ_RWvpzJWjX1oBse67N5gg><https://www.google.com/url?q=https%3A%2F%2Fdrafts.csswg.org%2Fcss-transforms%2F%23grouping-property-values&sa=D&sntz=1&usg=AFQjCNHxIkBTJ_RWvpzJWjX1oBse67N5gg>

Current spec: https://www.w3.org/TR/css-transforms-1/
<https://www.google.com/url?q=https%3A%2F%2Fwww.w3.org%2FTR%2Fcss-transforms-1%2F&sa=D&sntz=1&usg=AFQjCNEE6sBt_WfYWjONqzUtHS9rS_kaRg>


<https://www.google.com/url?q=https%3A%2F%2Fdrafts.csswg.org%2Fcss-transforms%2F%23grouping-property-values&sa=D&sntz=1&usg=AFQjCNHxIkBTJ_RWvpzJWjX1oBse67N5gg>

<https://www.google.com/url?q=https%3A%2F%2Fdrafts.csswg.org%2Fcss-transforms%2F%23grouping-property-values&sa=D&sntz=1&usg=AFQjCNHxIkBTJ_RWvpzJWjX1oBse67N5gg>

Platform coverage:

All platforms

Estimated or target release:

Firefox 52.

Preference behind which this will be implemented:

None.

- Matt

[1] https://drafts.csswg.org/css-transforms/#grouping-property-values
[2] https://www.w3.org/TR/css-transforms-1/#transform-style-property [3]
https://lists.w3.org/Archives/Public/www-style/2016May/0239.html [4]
https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/eBIp90_il1o
<https://groups.google.com/a/chromium.org/forum/#%21topic/blink-dev/eBIp90_il1o>
[5]
https://www.chromestatus.com/metrics/feature/popularity#OpacityWithPreserve3DQuirk

<https://www.google.com/url?q=https%3A%2F%2Fdrafts.csswg.org%2Fcss-transforms%2F%23grouping-property-values&sa=D&sntz=1&usg=AFQjCNHxIkBTJ_RWvpzJWjX1oBse67N5gg>

[mwoo...@mozilla.com]

Apologies, this was meant to have the estimated release as Firefox 50 (current Nightly).

- Matt