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

Issue 651580 link

Starred by 3 users
Status: Duplicate
Merged: issue 521364
Owner:
█ trchen@chromium.org
Last visit > 30 days ago
Closed: Nov 2016
Cc:
█ trchen@chromium.org
schenney@chromium.org
Components:
EstimatedDays: ----
NextAction: ----
OS: Windows
Pri: 2
Type: Bug



Sign in to add a comment

Composited layers blur text when page is zoomed

Reported by papp.rob...@gmail.com, Sep 29 2016 
UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.116 Safari/537.36

Example URL:
https://regex101.com/

Steps to reproduce the problem:
1. Change browser zoom level to 110%
2. Click the flag on the right end of the regular expression input box.
3. Observe the popup

What is the expected behavior?
Crisp, easy to read text.

What went wrong?
Text is blurry.

Does it occur on multiple sites: Yes

Is it a problem with a plugin? No 

Did this work before? N/A 

Does this work in other browsers? No FF 49.0.1 works fine, IE 11 doesn't

Chrome version: 53.0.2785.116  Channel: n/a
OS Version: 10.0
Flash Version: Shockwave Flash 23.0 r0

Here's an isolated repro: https://jsfiddle.net/TWiStErRob/ksfoqowt/4/

We suspect that there's a regression conflict between this change: https://developers.google.com/web/updates/2016/09/re-rastering-composite?hl=en and the browser zoom level.

(The investigation to create the isolated case was triggered by a user report: https://github.com/firasdib/Regex101/issues/666)
regex101_flags.png
70.7 KB View Download
jsfiddle_repro.png
146 KB View Download

Comment 1 by papp.rob...@gmail.com, Sep 29 2016 

We also tried many of these workarounds/hacks on the live site:
http://stackoverflow.com/q/15464055/253468
http://stackoverflow.com/q/8024061/253468
but none resulted in the expected result.

Comment 2 by schenney@chromium.org, Sep 30 2016

Cc: trchen@chromium.org schenney@chromium.org
 Issue 648794  has been merged into this issue.

Comment 3 by schenney@chromium.org, Sep 30 2016

Owner: chrishtr@chromium.org
Status: Assigned (was: Unconfirmed)
Confirmed with the given jsfiddle. chrishtr@, could this be a problem with zoom and the re-raster code?

Comment 4 by schenney@chromium.org, Sep 30 2016

Components: -Blink Blink>Compositing

Comment 5 by ru...@starset.net, Sep 30 2016 

I'm starting to feel like this isn't exclusively tied to zoomed text. Here's a calendar invite sent to a Gmail account. At 100% zoom level, with --force-device-scale-factor=1.5.
20160930162413-Selection.png
42.9 KB View Download

Comment 6 by papp.rob...@gmail.com, Oct 1 2016 

Re #5:

1. check if that is part of a composite layer (yellow border, see regex101 attachment above) by enabling layer borders (see my fiddle above)

2. doesn't "--force-device-scale-factor=1.5" mean "I want 100% zoom level to mean 150%, and 200% to mean 300%, etc..."? Which means that it "is" a zooming issue.

Comment 7 by ru...@starset.net, Oct 2 2016 

Attachment shows blurryness of the drop down from the repro steps.

I'm unsure how --force-device-scale-factor=1.5 other than it also scales the UI around the view port too. I use it as I'm running a High DPI display.
20161002140859-Online regex tester and debugger: PHP, PCRE, Python, Golang and JavaScript - Google Chrome.png
311 KB View Download

Comment 8 by papp.rob...@gmail.com, Oct 2 2016 

I meant for you to check if your blurry calendar invite is on a composite layer.

Comment 9 by ru...@starset.net, Oct 2 2016 

Sorry, attached, this is at 100% zoom and a scale factor of 1.5.

So I went through a couple of these Google Calendar invite emails before I came across one that would exhibit the issue. This is intermittent and random, and if I reloaded Gmail, this specific email might show up just fine.
20161002154243-Selection.png
238 KB View Download

Comment 10 by chrishtr@chromium.org, Oct 3 2016

Owner: ----
Status: Available (was: Assigned)
This is a known bug fractional translate and scale transforms on composited layers can lead to 
blurry text. We are currently working on fixing the translate part, as well as device-scale-factor 
not being an integer.

Comment 11 by flackr@chromium.org, Nov 16 2016 

Should this be duped into issue 521364?

Comment 12 by chrishtr@chromium.org, Nov 17 2016

Owner: trchen@chromium.org
Status: Assigned (was: Available)
Tien-ren is it fixed with --enable-use-zoom-for-dsf?

Comment 13 by trchen@chromium.org, Nov 17 2016 

I think yes as long as no CSS transform is used.

Comment 14 by chrishtr@google.com, Nov 17 2016 

Yes in that you tested it?

Comment 15 by trchen@chromium.org, Nov 18 2016

Mergedinto: 521364
Status: Duplicate (was: Assigned)
Just tried it. No it is not fixed. The popup menu is positioned by a translation transform. The translation value was some rounded integer (which maps to some fractional value after zoom). This is a dupe of 521364.
►

Sign in to add a comment