New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 591015 link

Starred by 3 users

Issue metadata

Status: Available
Owner: ----
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Android , Windows , Chrome , Mac
Pri: 2
Type: Bug



Sign in to add a comment

-webkit-filter doesn't change body background color unless `background` is specified in `html`

Reported by sparan...@gmail.com, Mar 1 2016

Issue description

Chrome Version       : 48.0.2564.116 (Official Build) (64-bit)
URLs (if applicable) : http://codepen.io/sparanoid/pen/zqxRwB
Other browsers tested: OK
have tested this issue:
     Safari: 9.0.3 (11601.4.4)
    WebKit: 9.0.3 (11601.4.4, r197354)

What steps will reproduce the problem?
1. See http://codepen.io/sparanoid/pen/zqxRwB
2. Click `Toggle .invert class`
3. If you click `Toggle .invert-fix class`, a .invert-fix CSS class will be appended to `html` and the background color changed correctly. 

What is the expected result?
Background color changed from white to black.

What happens instead?
Background color is unchanged.

Please provide any additional information below. Attach a screenshot if
possible.

 
Cc: brajkumar@chromium.org
Components: Blink>HTML
Labels: Needs-Feedback
Tested on Windows 7 using chrome stable M48-48.0.2564.116 by following steps mentioned in the above comment and observed no changes in the background color .

Tested the same on earlier version of chrome M35-35.0.1851.0 and M37-37.0.2042.0 observed different results on both of these versions.

sparanoid@ - Attaching screen-shot for your reference, could you please confirm which is the expected behavior from the below snapshot.
M35.JPG
105 KB View Download
M37.JPG
101 KB View Download
Sorry maybe I didn't write it clearly:

here's how to reproduce the bug:

1. See http://codepen.io/sparanoid/pen/zqxRwB
2. Click `Toggle .invert class`
3. You should expect expect.png but you got actual.png

If you click `Toggle .invert-fix class`, a .invert-fix CSS class will be appended to `html`, you will get fix.png, this is a simple fix for this bug, but still slightly different from expect.png
expect.png
116 KB View Download
actual.png
113 KB View Download
fix.png
119 KB View Download
I'm testing on OS X 10.11.3 (15D21) with Chrome 48.0.2564.116 (Official Build) (64-bit)

Comment 4 by tkent@chromium.org, Mar 4 2016

Components: -Blink>HTML Blink>CSS>Filters
Project Member

Comment 5 by sheriffbot@chromium.org, Mar 9 2016

Labels: -Needs-Feedback Needs-Review
Owner: brajkumar@chromium.org
Status: Assigned (was: Unconfirmed)
Thank you for providing more feedback. Assigning to requester "brajkumar@chromium.org" for another review.

For more details visit https://sites.google.com/a/chromium.org/dev/issue-tracking/autotriage - Your friendly Sheriffbot
Labels: -Needs-Review Needs-Bisect
Owner: ----
Status: Unconfirmed (was: Assigned)
Need to try a repro and bisect if needed.
Labels: -Needs-Bisect M-52 hasbisect OS-All Pri-2 Type-Bug-Regression
Owner: dongseong.hwang@chromium.org
Status: Assigned (was: Unconfirmed)
Able to reproduce on Windows 7, Ubuntu 14.04 and Mac OS 10.11.4 using chrome stable M50-50.0.2661.94.

Bisect Information:
=====================
Good build: 36.0.1922.0 
Bad Build : 36.0.1924.0 

Change Log URL: https://chromium.googlesource.com/chromium/src/+log/f885a8aa36ea463e322a7051a7e957d8c6bc6b03..826053d2b7bbeff2207588b3e09f99498bbc0821

Blink Log URL:
https://chromium.googlesource.com/chromium/blink/+log/6324571d2988b487f2ef74fe63611fdb4abe1be4..901a0d538709c60c743f6efaf34d951654c6e12f?pretty=fuller&n=10000

From the above blink log suspecting below change

Review URL: https://codereview.chromium.org/216423011

dongseong.hwang@ - Could you please check whether this is caused with respect to your change, if not please help us in assigning it to the right owner.

Thanks!
Project Member

Comment 8 by sheriffbot@chromium.org, Jun 1 2016

Labels: -M-52 M-53 MovedFrom-52
Moving this nonessential bug to the next milestone.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Project Member

Comment 9 by sheriffbot@chromium.org, Jul 15 2016

Labels: -M-53 MovedFrom-53
This issue has been moved once and is lower than Pri-1. Removing the milestone.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot

Comment 10 by aho...@zendesk.com, Oct 28 2016

I just stumbled into this bug myself. It is limiting the use of my bookmarklet which applies `grayscale()` to the entire page.

Note that it could cause quite a crazy problem if the filter in question inverts colors, as this could reduce the text/background contrast to 0.  Some people with visual impairments like to invert colors, although I understand usually they do this at the OS level, not the bookmarklet/extension level.

Comment 11 by aho...@zendesk.com, Oct 28 2016

Filed against WebKit: https://bugs.webkit.org/show_bug.cgi?id=164164

Comment 12 by aho...@zendesk.com, Oct 28 2016

Demonstration of success when HTML is targeted: https://jsfiddle.net/alanhogan/vjuxcpLf/

Demonstration of failure when BODY is targeted:
https://jsfiddle.net/alanhogan/ykjLf5yr/

Comment 13 by aho...@zendesk.com, Oct 29 2016

One last note: Applying FILTER to HTML is *NOT* a successful work-around when a background is set on BODY. https://jsfiddle.net/alanhogan/yc0r43f6/

Components: -Blink>CSS>Filters Blink>Compositing>Filters
Cc: dongseong.hwang@chromium.org
Components: -Blink>Compositing>Filters Blink>Paint>Invalidation
Labels: -Type-Bug-Regression PaintTeamTriaged-20170411 Type-Bug
Owner: ----
Status: Available (was: Assigned)
Project Member

Comment 16 by sheriffbot@chromium.org, Apr 16 2018

Labels: Hotlist-Recharge-Cold
Status: Untriaged (was: Available)
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue.

Sorry for the inconvenience if the bug really should have been left as Available.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot

Comment 17 by aho...@zendesk.com, Apr 16 2018

Prompted by the last comment, I just checked the jsfiddles I linked above, and the situation changed a little. It's a good news/bad news thing. Bad news: The filter now fails when it's <HTML> that has a background color defined, too. Good news: At least the results are consistent no matter whether <HTML> or <BODY> is targeted.
Labels: -OS-All OS-Android OS-Chrome OS-Linux OS-Mac OS-Windows
Status: Available (was: Untriaged)
Thanks for the update. No idea when we'll get to it.

I think a more likely cause is one of these style commits, https://chromium.googlesource.com/chromium/blink/+/c08d1f296b5725cec4aa0217cd9f8e4f5c025cb5, that removed a software filter path. My guess is that something was still using the path.

Sign in to add a comment