Last Comment Bug 970600 - Enable background-blend-mode by default
: Enable background-blend-mode by default
Status: VERIFIED FIXED
: dev-doc-complete, feature
Product: Core
Classification: Components
Component: Layout: View Rendering (show other bugs)
: Trunk
: x86 All
-- normal (vote)
: mozilla30
Assigned To: Horia Iosif Olaru
: Catalin Varga [QA][:VarCat]
: Jet Villegas (:jet)
Mentors:
Depends on: 986524 1000907 1234649
Blocks:
  Show dependency treegraph
 
Reported: 2014-02-10 14:53 PST by Horia Iosif Olaru
Modified: 2015-12-22 12:19 PST (History)
10 users (show)
See Also:
Crash Signature:
(edit)
QA Whiteboard:
Iteration: ---
Points: ---
Has Regression Range: ---
Has STR: ---
30+


Attachments
enable-background-blend-mode-by-default (34.65 KB, patch)
2014-02-10 14:57 PST, Horia Iosif Olaru
roc: review-
Details | Diff | Splinter Review
enable-background-blend-mode-by-default.patch (979 bytes, patch)
2014-02-11 02:18 PST, Horia Iosif Olaru
roc: review+
Details | Diff | Splinter Review
screenshot.png (10.40 KB, image/png)
2014-02-14 07:52 PST, Peter Kroon
no flags Details
screenshot.JPG (37.61 KB, image/jpeg)
2014-02-14 07:52 PST, Peter Kroon
no flags Details
screenshot.JPG (37.61 KB, image/jpeg)
2014-02-14 07:54 PST, Peter Kroon
no flags Details
background-gradients-rendering.html (535 bytes, text/html)
2014-02-14 09:11 PST, Horia Iosif Olaru
no flags Details
Chorme_result.png (32.05 KB, image/png)
2014-02-14 09:11 PST, Horia Iosif Olaru
no flags Details
Firefox_result.png (209.10 KB, image/png)
2014-02-14 09:12 PST, Horia Iosif Olaru
no flags Details
picture (34.78 KB, image/png)
2014-02-28 08:07 PST, Catalin Varga [QA][:VarCat]
no flags Details

Description User image Horia Iosif Olaru 2014-02-10 14:53:04 PST
Enable the background-blend-mode CSS property be default in Release builds.
Comment 1 User image Horia Iosif Olaru 2014-02-10 14:57:16 PST
Created attachment 8373667 [details] [diff] [review]
enable-background-blend-mode-by-default
Comment 2 User image Robert O'Callahan (:roc) (email my personal email if necessary) 2014-02-11 02:02:25 PST
Comment on attachment 8373667 [details] [diff] [review]
enable-background-blend-mode-by-default

Review of attachment 8373667 [details] [diff] [review]:
-----------------------------------------------------------------

Most of your patch removes trailing whitespace from all.js. Please do that in a separate patch :-)
Comment 3 User image Horia Iosif Olaru 2014-02-11 02:18:41 PST
Created attachment 8373933 [details] [diff] [review]
enable-background-blend-mode-by-default.patch

Sorry about that :) Should be better in this patch.

I don't mind adding a patch that removes trailing whitespace later, but isn't that a bit disruptive for source control history?
Comment 4 User image Robert O'Callahan (:roc) (email my personal email if necessary) 2014-02-11 02:29:43 PST
(In reply to Horia Iosif Olaru from comment #3)
> I don't mind adding a patch that removes trailing whitespace later, but
> isn't that a bit disruptive for source control history?

We generally don't see that as a problem.
Comment 5 User image Rik Cabanier 2014-02-11 08:54:42 PST
try build: https://tbpl.mozilla.org/?tree=Try&rev=a3784a6acc0e
Comment 6 User image Ryan VanderMeulen [:RyanVM] 2014-02-11 14:37:57 PST
https://hg.mozilla.org/integration/mozilla-inbound/rev/01fd47b5eb1d
Comment 7 User image Ryan VanderMeulen [:RyanVM] 2014-02-12 05:51:11 PST
https://hg.mozilla.org/mozilla-central/rev/01fd47b5eb1d
Comment 8 User image Peter Kroon 2014-02-14 07:52:06 PST
Created attachment 8376310 [details]
screenshot.png

Just tested this in latest Nightly windows7 32 bit.
In all the test the purple color is displayed. See attachment.
Comment 9 User image Peter Kroon 2014-02-14 07:52:59 PST
Created attachment 8376312 [details]
screenshot.JPG
Comment 10 User image Peter Kroon 2014-02-14 07:54:31 PST
Created attachment 8376313 [details]
screenshot.JPG
Comment 11 User image Horia Iosif Olaru 2014-02-14 09:09:44 PST
(In reply to Peter Kroon from comment #8)
> Created attachment 8376310 [details]
> screenshot.png
> 
> Just tested this in latest Nightly windows7 32 bit.
> In all the test the purple color is displayed. See attachment.

There seems to be a rendering difference for gradients between Firefox and Chrome. The violet you are seeing happens when the gradient goes from a fully transparent color to a fully opaque one. 

The color is violet because the starting point is a fully transparent blue (0, 0, 255, 0). If the color components would be black (0, 0, 0, 0) you would see a grey that appears between the two gradient start points.

I have not looked into which would be the correct behavior. I will attach a test and some screenshots.
Comment 12 User image Horia Iosif Olaru 2014-02-14 09:11:03 PST
Created attachment 8376346 [details]
background-gradients-rendering.html
Comment 13 User image Horia Iosif Olaru 2014-02-14 09:11:34 PST
Created attachment 8376347 [details]
Chorme_result.png
Comment 14 User image Horia Iosif Olaru 2014-02-14 09:12:24 PST
Created attachment 8376349 [details]
Firefox_result.png
Comment 15 User image Horia Iosif Olaru 2014-02-14 09:15:17 PST
An interesting observation is when interpolating from or to a transparent color
- Firefox takes the color components of the transparent stop point into account
- Chrome seems to take the color components of the non transparent stop point for both ends when interpolating (it looks like a gradient from (255, 0, 0, 0) to (255, 0, 0, 1))
Comment 16 User image Rik Cabanier 2014-02-14 09:25:16 PST
(In reply to Horia Iosif Olaru from comment #15)
> An interesting observation is when interpolating from or to a transparent
> color
> - Firefox takes the color components of the transparent stop point into
> account
> - Chrome seems to take the color components of the non transparent stop
> point for both ends when interpolating (it looks like a gradient from (255,
> 0, 0, 0) to (255, 0, 0, 1))

This is because the CSS WG defined that gradients should interpolate in premultiplied colorspace (see my objection over this here: http://w3cmemes.tumblr.com/post/34628700024/when-worf-says-transparent-he-means)
Chrome is following the spec here and firefox is not.
Comment 17 User image Peter Kroon 2014-02-14 12:57:50 PST
(In reply to Rik Cabanier from comment #16)
> (In reply to Horia Iosif Olaru from comment #15)
> > An interesting observation is when interpolating from or to a transparent
> > color
> > - Firefox takes the color components of the transparent stop point into
> > account
> > - Chrome seems to take the color components of the non transparent stop
> > point for both ends when interpolating (it looks like a gradient from (255,
> > 0, 0, 0) to (255, 0, 0, 1))
> 
> This is because the CSS WG defined that gradients should interpolate in
> premultiplied colorspace (see my objection over this here:
> http://w3cmemes.tumblr.com/post/34628700024/when-worf-says-transparent-he-
> means)
> Chrome is following the spec here and firefox is not.

Has this been reported yet?
Comment 18 User image Horia Iosif Olaru 2014-02-17 07:10:55 PST
(In reply to Peter Kroon from comment #17)
> (In reply to Rik Cabanier from comment #16)
> > (In reply to Horia Iosif Olaru from comment #15)
> > > An interesting observation is when interpolating from or to a transparent
> > > color
> > > - Firefox takes the color components of the transparent stop point into
> > > account
> > > - Chrome seems to take the color components of the non transparent stop
> > > point for both ends when interpolating (it looks like a gradient from (255,
> > > 0, 0, 0) to (255, 0, 0, 1))
> > 
> > This is because the CSS WG defined that gradients should interpolate in
> > premultiplied colorspace (see my objection over this here:
> > http://w3cmemes.tumblr.com/post/34628700024/when-worf-says-transparent-he-
> > means)
> > Chrome is following the spec here and firefox is not.
> 
> Has this been reported yet?

Yes - this seems to be the exact same issue:
https://bugzilla.mozilla.org/show_bug.cgi?id=591600
Comment 19 User image Catalin Varga [QA][:VarCat] 2014-02-28 08:07:24 PST
Created attachment 8383724 [details]
picture

I verified this bug using:

Firefox 30
Build id: 20140228030206
Os Win 7, Ubuntu 12.04 x 32 and Mac Os 10.9

I've used the following test:
http://html.adobe.com/webplatform/graphics/blendmodes/browser-support/?filter=background

During the test I've noticed that most of the images were different and the difference extended on to the circles not just the background. 
My assumption is that due to the bug  https://bugzilla.mozilla.org/show_bug.cgi?id=591600 the backround is changing and those changes in addition to the backround blending and rendering are changing the aspect of the circles.

I've attached and example that shows the differences that I was talking about.
Comment 20 User image Rik Cabanier (don't use this account) 2014-02-28 09:32:22 PST
(In reply to Catalin Varga [QA][:VarCat] from comment #19)
> Created attachment 8383724 [details]
> picture
> 
> I verified this bug using:
> 
> Firefox 30
> Build id: 20140228030206
> Os Win 7, Ubuntu 12.04 x 32 and Mac Os 10.9
> 
> I've used the following test:
> http://html.adobe.com/webplatform/graphics/blendmodes/browser-support/
> ?filter=background
> 
> During the test I've noticed that most of the images were different and the
> difference extended on to the circles not just the background. 
> My assumption is that due to the bug 
> https://bugzilla.mozilla.org/show_bug.cgi?id=591600 the backround is
> changing and those changes in addition to the backround blending and
> rendering are changing the aspect of the circles.

I'm unsure if that's the case. The background has no alpha so it should make no difference is the gradient is premultiplied.
 
> I've attached and example that shows the differences that I was talking
> about.

This looks more like a color management issue.
Comment 21 User image Sylvestre Ledru [:sylvestre] 2014-03-06 01:31:47 PST
Added in the release note database for 30.
Comment 22 User image Rik Cabanier 2014-04-24 10:18:32 PDT
This is not a bug with blending.
Notice how the gradient itself is rendered differently.
Comment 24 User image Catalin Varga [QA][:VarCat] 2014-09-15 06:38:13 PDT
Marking this bug as Verified as the feature was released with Firefox 30.

Note You need to log in before you can comment on or make changes to this bug.