Closed
Bug 1279409
Opened 9 years ago
Closed 9 years ago
CSS mix-blend-mode and clip-path don't work when combined (on HTML element)
Categories
(Core :: CSS Parsing and Computation, defect)
Tracking
()
VERIFIED
FIXED
mozilla52
| Tracking | Status | |
|---|---|---|
| firefox52 | --- | fixed |
People
(Reporter: jonnyscholes, Assigned: u459114)
References
(Blocks 1 open bug)
Details
Attachments
(2 files)
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:48.0) Gecko/20100101 Firefox/48.0
Build ID: 20160606004039
Steps to reproduce:
Create two divs - foreground and background. Place foreground absolutely over background. Apply clip-path: url(#svgPath); OR cli-path: polygon; (with clip-path-shapes enabled). Apply mix-blend-mode - all values other than normal. Example: http://codepen.io/jonnyscholes/pen/7fb31dcb927689f551bfbbac794c0285
Actual results:
Foreground clips to an unexpected square that seems to flicker every few seconds.
Expected results:
Forground should be clipped as per the clip mask then the remaining shape should blend with the background as set by mix-bledn-mode.
|
||
Comment 1•9 years ago
|
||
Hi,
I tested this issue on Mac OS X 10.11 with FF Nightly 50.0a1 (2016-06-12) and I can reproduce it.
Status: UNCONFIRMED → NEW
Component: Untriaged → CSS Parsing and Computation
Ever confirmed: true
OS: Unspecified → Mac OS X
Product: Firefox → Core
Hardware: Unspecified → x86
Version: 48 Branch → 50 Branch
Blocks: svg-enhance
| Comment hidden (mozreview-request) |
| Comment hidden (mozreview-request) |
In nsIFrame::BuildDisplayListForStackingContext, nsDisplayBlendMode is already been created to handle mix-blend-mode, so we don't need to take care of it again in nsDisplayMask and nsDisplayFilter I thought.
Attachment #8796027 -
Flags: review?(mstange)
Attachment #8796028 -
Flags: review?(mstange)
|
||
Comment 8•9 years ago
|
||
| mozreview-review | ||
Comment on attachment 8796027 [details]
Bug 1279409 - Part 1. Remove mix-blend-mode handling code in nsSVGIntegrationUtils.
https://reviewboard.mozilla.org/r/82024/#review80634
Attachment #8796027 -
Flags: review?(mstange) → review+
|
|
||
Comment 9•9 years ago
|
||
| mozreview-review | ||
Comment on attachment 8796028 [details]
Bug 1279409 - Part 2. Reftest for clip-path with mix-blend-mode.
https://reviewboard.mozilla.org/r/82026/#review80636
Attachment #8796028 -
Flags: review?(mstange) → review+
|
|
Assignee | |
Comment 10•9 years ago
|
||
|
|
Assignee | |
Comment 11•9 years ago
|
||
|
|
Assignee | |
Comment 12•9 years ago
|
||
https://hg.mozilla.org/integration/mozilla-inbound/rev/d48849ef2b8f964e4b68c6bbe82279709aab9c13
Bug 1279409 - Part 1. Remove mix-blend-mode handling code in nsSVGIntegrationUtils.
https://hg.mozilla.org/integration/mozilla-inbound/rev/c5b5b2bbba91bde8e3b4f9dee0a5cc653f0e0062
Bug 1279409 - Part 2. Reftest for clip-path with mix-blend-mode.
|
|
||
Comment 13•9 years ago
|
||
| bugherder | ||
https://hg.mozilla.org/mozilla-central/rev/d48849ef2b8f
https://hg.mozilla.org/mozilla-central/rev/c5b5b2bbba91
Status: NEW → RESOLVED
Closed: 9 years ago
status-firefox52:
--- → fixed
Resolution: --- → FIXED
Target Milestone: --- → mozilla52
The link rel="match" in the reftest has an incorrect filename (it's missing the "1-").
(I found this with the script layout/reftests/w3c-css/submitted/check-for-references.sh .)
Flags: needinfo?(cku)
|
|
Assignee | |
Comment 15•9 years ago
|
||
https://hg.mozilla.org/integration/mozilla-inbound/rev/2da2480008f5dc8876b29673a9756b463f5aee15
Bug 1279409 - Part 3. Fix incorrect ref filename. r=me
|
||
Comment 17•9 years ago
|
||
| bugherder | ||
|
|
||
Comment 18•9 years ago
|
||
Tested on Mac OS X 10.10 with FF Nightly 52.0a1(2016-10-03) and I can't reproduce it.
Status: RESOLVED → VERIFIED
|
Reporter | |
Comment 19•9 years ago
|
||
Tested on Mac OSX 10.11.6 with FF Nightly 52.0a1 (2016-10-04) (64-bit) - everything now looking good. Thanks a million - you all rock!
You need to log in
before you can comment on or make changes to this bug.
Description
•