Interaction of CSS clip and transform broke in branch 66

VERIFIED FIXED in Firefox 66

Status

()

defect
P2
normal
VERIFIED FIXED
4 months ago
3 months ago

People

(Reporter: johanringmann, Assigned: emilio)

Tracking

(Blocks 1 bug, {regression})

66 Branch
mozilla67
Points:
---
Dependency tree / graph
Bug Flags:
in-testsuite +

Firefox Tracking Flags

(firefox-esr60 unaffected, firefox65 unaffected, firefox66+ verified, firefox67 verified)

Details

(Whiteboard: [wptsync upstream])

Attachments

(1 attachment)

Reporter

Description

4 months ago

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:65.0) Gecko/20100101 Firefox/65.0

Steps to reproduce:

  1. Apply a rotation transform to an element
  2. Apply a clip to the element

or see JSFiddle: https://jsfiddle.net/21mp8ec9/

Actual results:

In branch 66, the clip is applied after the transform.

In branch 65, the clip is applied before the transform, just like it is with clip-path.

Expected results:

The clip should be applied before the transform.

This is what happens in Chromium 72, and Firefox 65.

Updated

4 months ago
Status: UNCONFIRMED → NEW
Component: Untriaged → Layout
Ever confirmed: true
Keywords: regression
Product: Firefox → Core
Assignee

Updated

4 months ago
Flags: needinfo?(emilio)
Assignee

Comment 2

4 months ago

I think this is the less complex way to get the desired behavior here... The
extra AutoSaveRestore is needed to handle the clipped + transformed + fixed
case, I added a test for that too.

Assignee

Comment 3

4 months ago

[Tracking Requested - why for this release]: Regression that would be nice not to ship.

Assignee: nobody → emilio
Flags: needinfo?(emilio)
Assignee

Updated

4 months ago
Duplicate of this bug: 1524920

Tracking to keep an eye on this - once it lands on m-c please request uplift.

Flags: qe-verify+
Priority: -- → P2
Assignee

Updated

4 months ago
Blocks: 1525159

Comment 6

4 months ago
Pushed by ealvarez@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/742718306d3f
Apply CSS clip inside the transform rather than outside. r=mstange
Assignee

Comment 7

4 months ago

Comment on attachment 9041164 [details]
Bug 1524966 - Apply CSS clip inside the transform rather than outside.

Beta/Release Uplift Approval Request

Feature/Bug causing the regression

Bug 1514384

User impact if declined

Wrongly clipped elements, see this bug and duplicate.

Is this code covered by automated tests?

Yes

Has the fix been verified in Nightly?

No

Needs manual test from QE?

Yes

If yes, steps to reproduce

See comment 0.

List of other uplifts needed

None

Risk to taking this patch

Medium

Why is the change risky/not risky? (and alternatives if risky)

Changing a (relatively) well tested and isolated part of the code-base to restore previous behavior in this case.

String changes made/needed

none

Attachment #9041164 - Flags: approval-mozilla-beta?
Whiteboard: [qa-triaged]
Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/15259 for changes under testing/web-platform/tests
Whiteboard: [qa-triaged] → [qa-triaged][wptsync upstream]
Status: NEW → RESOLVED
Last Resolved: 3 months ago
Resolution: --- → FIXED
Target Milestone: --- → mozilla67

Confirmed the issue with 66.0b4, 67.0a1 (2019-02-04) on Windows 10x64.
Fix verified with 67.0a1 (2019-02-06) on Windows 10, macOS 10.13, Ubuntu 16.04.

Status: RESOLVED → VERIFIED

Comment on attachment 9041164 [details]
Bug 1524966 - Apply CSS clip inside the transform rather than outside.

[Triage Comment]
Fixes some instances of wrongly-clipped elements. Approved for 66.0b6.

Attachment #9041164 - Flags: approval-mozilla-beta? → approval-mozilla-beta+
QA Whiteboard: [qa-triaged]
Whiteboard: [qa-triaged][wptsync upstream] → [wptsync upstream]

Verified fix with 66.0b13 on the same OSs mentioned above.

Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.