Bug 119434 - [CSS Background Blending] Specifying background-image and background-color with opaque image doesn't trigger blending
Summary: [CSS Background Blending] Specifying background-image and background-color wi...
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks: 108546
  Show dependency treegraph
 
Reported: 2013-08-02 00:51 PDT by Mihai Tica
Modified: 2014-03-04 00:28 PST (History)
8 users (show)

See Also:


Attachments
Patch (8.78 KB, patch)
2013-08-02 00:56 PDT, Mihai Tica
no flags Details | Formatted Diff | Diff
Patch (4.53 KB, patch)
2013-08-02 07:02 PDT, Mihai Tica
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from webkit-ews-04 for mac-mountainlion (541.41 KB, application/zip)
2013-08-02 08:09 PDT, Build Bot
no flags Details
Patch (4.53 KB, patch)
2013-08-02 10:30 PDT, Mihai Tica
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Mihai Tica 2013-08-02 00:51:19 PDT
From https://code.google.com/p/chromium/issues/detail?id=266427:

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36

Example URL:
http://jsfiddle.net/cjgammon/Dxkpr/1/

Steps to reproduce the problem:
1. apply a background color
2. apply a background image
3. multiply the bg color or apply other blend mode (non solid color)

What is the expected behavior?
it should blend with the background color

What went wrong?
it does not blend

Does it occur on multiple sites: Yes

Is it a problem with a plugin? No 

Did this work before? Yes seems to work in canary here: https://git.corp.adobe.com/pages/gammon/background-blending-demo/index.html

Does this work in other browsers? N/A 

Chrome version: 28.0.1500.95  Channel: stable
OS Version: OS X 10.8.4
Flash Version: Shockwave Flash 11.8 r800

the short-hand syntax seems to blend correctly.
For example: 
    background: url(''https://www.google.com/images/srpr/logo4w.png''), #fefefe;
Comment 1 Mihai Tica 2013-08-02 00:56:51 PDT
Created attachment 207989 [details]
Patch
Comment 2 Dirk Schulze 2013-08-02 01:05:37 PDT
Comment on attachment 207989 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=207989&action=review

> LayoutTests/ChangeLog:12
> +        * css3/compositing/background-blend-mode-separate-layer-declaration.html: Added.
> +        * platform/mac/css3/compositing/background-blend-mode-separate-layer-declaration-expected.png: Added.
> +        * platform/mac/css3/compositing/background-blend-mode-separate-layer-declaration-expected.txt: Added.

Patch looks great! Can you please use an ref test instead of an pixel test? r- until you added a ref test.
Comment 3 Mihai Tica 2013-08-02 01:25:10 PDT
(In reply to comment #2)
> (From update of attachment 207989 [details])
> View in context: https://bugs.webkit.org/attachment.cgi?id=207989&action=review
> 
> > LayoutTests/ChangeLog:12
> > +        * css3/compositing/background-blend-mode-separate-layer-declaration.html: Added.
> > +        * platform/mac/css3/compositing/background-blend-mode-separate-layer-declaration-expected.png: Added.
> > +        * platform/mac/css3/compositing/background-blend-mode-separate-layer-declaration-expected.txt: Added.
> 
> Patch looks great! Can you please use an ref test instead of an pixel test? r- until you added a ref test.

The bug isn't showing up when specifying background-image with an SVG.
Instead, the problem seems to be related only to opaque images, so I'm guessing we can't add a ref test.
Comment 4 Mihai Tica 2013-08-02 07:02:05 PDT
Created attachment 208013 [details]
Patch

Adding reference test
Comment 5 Build Bot 2013-08-02 08:09:12 PDT
Comment on attachment 208013 [details]
Patch

Attachment 208013 [details] did not pass mac-ews (mac):
Output: http://webkit-queues.appspot.com/results/1329181

New failing tests:
media/track/text-track-cue-is-reachable.html
Comment 6 Build Bot 2013-08-02 08:09:14 PDT
Created attachment 208020 [details]
Archive of layout-test-results from webkit-ews-04 for mac-mountainlion

The attached test failures were seen while running run-webkit-tests on the mac-ews.
Bot: webkit-ews-04  Port: mac-mountainlion  Platform: Mac OS X 10.8.4
Comment 7 Mihai Tica 2013-08-02 10:30:27 PDT
Created attachment 208030 [details]
Patch
Comment 8 Dirk Schulze 2013-08-02 11:15:23 PDT
Comment on attachment 208030 [details]
Patch

r=me
Comment 9 WebKit Commit Bot 2013-08-05 00:14:50 PDT
Comment on attachment 208030 [details]
Patch

Clearing flags on attachment: 208030

Committed r153702: <http://trac.webkit.org/changeset/153702>
Comment 10 WebKit Commit Bot 2013-08-05 00:14:54 PDT
All reviewed patches have been landed.  Closing bug.