I has hit this as well on latest canary on Windows on another page on GitHub: https://github.com/w3c/html-aam/blob/gh-pages/index.html 

Interestingly enough, first I repro'd this on Surface Book (high DPI machine), then switched to a mixed DPI environment and can consistently repro this on high DPI screen and cannot repro on normal DPI - even if I drag window between them (repros on high, doesn't repro on normal - don't have to reload). 

Since original problem was reported on Mac - there is a chance that was high DPI (Retina) as well.

Hopefully known issue!

I can confirm it's high DPI related.

I tried changing the display scale and I have consistent reproduction of the issue too.

Tested on Chrome Stable #59.0.3071.115, Canary #61.0.3153.4 on Mac 10.12.5, Windows 10 and Ubuntu 14.04 and unable to reproduce the issue. Please find the attached screenshot for reference.

Tested on resolutions as mentioned below:
1920x1200
1440*900
1024*640

@dorian -- Could you please provide the resolutions in which mentioned issue is observed. That would help us in further triaging the issue.

Thanks in advance.

Deleted: 740720.png 600 KB

	740720.png 600 KB View Download

@pnangunoori I'm 1920 x 1200 (from https://www.whatismyscreenresolution.com/)

Thank you for providing more feedback. Adding requester "pnangunoori@chromium.org" to the cc list and removing "Needs-Feedback" label.

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

pnangunoori@ note that this isn't just about resolution, but pixel density.  You need a device (eg. Surface Pro) where window.devicePixelRatio is >1 (perhaps >= 2).  Eg. click the button at the top of https://rbyers.github.io/highdpi.html to get this value.

I can't repro on a mid-2012 retina macbook Chrome Version 61.0.3153.0 (Official Build) canary (64-bit). I suspect this might be hardware related. rbyers@, pr.dorian@, can you tell us exactly what machine you're on. Maybe add chrome://GPU output.

@rbyers I got 2 :D (classic MacOS)

Thank you for providing more feedback. Adding requester "schenney@chromium.org" to the cc list and removing "Needs-Feedback" label.

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

Can I have Google access? I can't seem to be able to add and remove labels

Thank you for providing more feedback. Adding requester "schenney@chromium.org" to the cc list and removing "Needs-Feedback" label.

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

Thanks

Version 61.0.3155.0 (Official Build) canary (64-bit)

We still need feedback on what model Mac you are using when you see this bug. This seems to be a GPU or driver issue because it does not repro on most machines.

Please note - I can't repro issue at the original link, but I can 100% repro another link I've provided: https://github.com/w3c/html-aam/blob/gh-pages/index.html  

Attaching chrome://gpu output from our test MacBook Pro (latest model with Touch Bar) that has Intel integrated GPU and AMD discrete GPU - I can repro with both.

Also attaching chrome://gpu from the Windows machine that has also Intel iGPU and NVidia dGPU. Unfortunately I couldn't make Chrome to work with dGPU for some reason (stable or canary) - so not sure if it repros there. I can try few additional configurations at the office if that helps.

Deleted: macOs-discrete-gpu.htm 49.9 KB

macOs-discrete-gpu.htm 49.9 KB View Download

Deleted: macOs-integrated-gpu.htm 52.6 KB

macOs-integrated-gpu.htm 52.6 KB View Download

Deleted: windows-integrated-gpu.html 51.4 KB

windows-integrated-gpu.html 51.4 KB View Download

The NextAction date has arrived: 2017-07-24

Able to reproduce the issue on the latest canary(62.0.3166.0) of Mac OS 10.12.5, Retina(Device pixel ratio 2). Tested with URL from C#18.

Regressed in M-61.

Last good build: 61.0.3151.4
First bad build: 61.0.3152.0

Changelog:
==========
https://chromium.googlesource.com/chromium/src/+log/5e67601472f51e96298b2b4edfa7286470bf8865..06adb5e74eb341b5a1fa68fed4e489f6f62ec5e8

sunxd@: Could you please take a look at this.

A friendly reminder that M61 Beta promotion is coming soon! Your bug is labelled as Beta ReleaseBlock, pls make sure to land the fix and request a merge to M61 branch 3163 latest by 4:00 PM PT, Thursday (07/27). Thank you.

We probably need to revert the border-radius scrolling patch, clues point out that mask tiling probably didn't solve the memory issue. Need further investigate...

I'll revert the changes if nothing can be done by Thursday.

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/2397e783b2b5a59a174d25d26f66d467a8b0a88f

commit 2397e783b2b5a59a174d25d26f66d467a8b0a88f
Author: sunxd <sunxd@chromium.org>
Date: Tue Jul 25 23:17:07 2017

Revert "cc: Enable composited border-radius scrolling."

This reverts commit 06adb5e74eb341b5a1fa68fed4e489f6f62ec5e8.

Reason for revert: Composited border-radius scrolling triggers two regression bugs: 1)  crbug.com/740720 , it results in high memory usage probably due to mask tiling not saving enough memory; 2)  crbug.com/745114 , compositor's scroll snapping can sometimes result in blurry text.

Original change's description:
> cc: Enable composited border-radius scrolling.
> 
> Enable composited border-radius scrolling as mask tiling is implemented.
> We'll revert this CL if anything breaks.
> 
> Bug:  567293 ,  567296 
> Cq-Include-Trybots: master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2
> Change-Id: I70bea4c542e00d244a597d1a36857dd120fc96cd
> Reviewed-on: https://chromium-review.googlesource.com/543397
> Commit-Queue: Xianda Sun <sunxd@chromium.org>
> Reviewed-by: Chris Harrelson <chrishtr@chromium.org>
> Reviewed-by: Robert Flack <flackr@chromium.org>
> Cr-Commit-Position: refs/heads/master@{#485040}

TBR=flackr@chromium.org,trchen@chromium.org,chrishtr@chromium.org,enne@chromium.org,sunxd@chromium.org,schenney@chromium.org

# Not skipping CQ checks because original CL landed > 1 day ago.

Bug:  567293 ,  567296 ,  740720 ,  745114 
Change-Id: Ia185a9ce4310aeaff0175f0e9f0a9080dccf22e5
Cq-Include-Trybots: master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2
Reviewed-on: https://chromium-review.googlesource.com/585227
Commit-Queue: Chris Harrelson <chrishtr@chromium.org>
Reviewed-by: Chris Harrelson <chrishtr@chromium.org>
Reviewed-by: Xianda Sun <sunxd@chromium.org>
Cr-Commit-Position: refs/heads/master@{#489477}
[add] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/compositing/overflow/respect-clip-for-non-composited-scrollers-when-prefering-compositing-over-lcd-text-expected.html
[delete] https://crrev.com/737aa56bfd44b62bdebc7994da7e24711f460dc2/third_party/WebKit/LayoutTests/compositing/overflow/respect-clip-for-non-composited-scrollers-when-prefering-compositing-over-lcd-text-expected.png
[delete] https://crrev.com/737aa56bfd44b62bdebc7994da7e24711f460dc2/third_party/WebKit/LayoutTests/compositing/overflow/respect-clip-for-non-composited-scrollers-when-prefering-compositing-over-lcd-text-expected.txt
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/compositing/overflow/scroller-with-border-radius-expected.txt
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/compositing/overflow/scroller-with-border-radius.html
[delete] https://crrev.com/737aa56bfd44b62bdebc7994da7e24711f460dc2/third_party/WebKit/LayoutTests/flag-specific/enable-slimming-paint-v2/compositing/overflow/respect-clip-for-non-composited-scrollers-when-prefering-compositing-over-lcd-text-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/linux/compositing/overflow/nested-border-radius-clipping-expected.png
[delete] https://crrev.com/737aa56bfd44b62bdebc7994da7e24711f460dc2/third_party/WebKit/LayoutTests/platform/linux/virtual/disable-spinvalidation/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/linux/virtual/prefer_compositing_to_lcd_text/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/mac-mac10.9/scrollbars/border-box-rect-clips-scrollbars-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/mac-mac10.9/virtual/prefer_compositing_to_lcd_text/scrollbars/border-box-rect-clips-scrollbars-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/mac/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/mac/scrollbars/border-box-rect-clips-scrollbars-expected.png
[delete] https://crrev.com/737aa56bfd44b62bdebc7994da7e24711f460dc2/third_party/WebKit/LayoutTests/platform/mac/virtual/disable-spinvalidation/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/mac/virtual/prefer_compositing_to_lcd_text/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/mac/virtual/prefer_compositing_to_lcd_text/scrollbars/border-box-rect-clips-scrollbars-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/win/compositing/overflow/nested-border-radius-clipping-expected.png
[delete] https://crrev.com/737aa56bfd44b62bdebc7994da7e24711f460dc2/third_party/WebKit/LayoutTests/platform/win/virtual/disable-spinvalidation/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/LayoutTests/platform/win/virtual/prefer_compositing_to_lcd_text/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/Source/core/layout/compositing/CompositedLayerMappingTest.cpp
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/Source/core/page/scrolling/ScrollingCoordinatorTest.cpp
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/Source/core/paint/PaintLayerClipper.cpp
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/Source/core/paint/PaintLayerScrollableArea.cpp
[modify] https://crrev.com/2397e783b2b5a59a174d25d26f66d467a8b0a88f/third_party/WebKit/Source/web/tests/ScrollMetricsTest.cpp

Rechecked this issue on Windows 10 and MAC 10.12.5 MAC book Pro retina using chrome version 62.0.3167.0, fix is working as intended. Web page is rendered properly. Used Test URL: https://github.com/w3c/html-aam/blob/gh-pages/index.html

Adding TE-verified labels for M62 and requesting a merge for M61 as issue is tagged with a Beta blocker and M61 is pushed to Beta soon.

Thanks.!

sunxd@: with the revert in, can we mark this as fixed?

I think we can remove Release block label, as eventually we still want to enable impl side scrolling. I'll lower the pr also.

Seems like this regressed in M61, correct? If yes, do we need a merge to M61?

I think so, I'll do a merge then.

Before we approve merge to M61, could you please confirm revert listed at #24 looks good in Canary and will be a safe merge to M61?

Yes, the issue no longer reproduces on Mac Canary. This should be a safe merge as the change only disables composited scrolling for border-radius elements.

Approving merge to M61 branch 3163 based on comment #25 and #33. Please merge ASAP. Thank you.

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/58b7f637c29e9eae0b1b32b40b1056f7a93382a4

commit 58b7f637c29e9eae0b1b32b40b1056f7a93382a4
Author: sunxd <sunxd@chromium.org>
Date: Wed Jul 26 17:33:13 2017

Revert "cc: Enable composited border-radius scrolling."

This reverts commit 06adb5e74eb341b5a1fa68fed4e489f6f62ec5e8.

Reason for revert: Composited border-radius scrolling triggers two regression bugs: 1)  crbug.com/740720 , it results in high memory usage probably due to mask tiling not saving enough memory; 2)  crbug.com/745114 , compositor's scroll snapping can sometimes result in blurry text.

Original change's description:
> cc: Enable composited border-radius scrolling.
>
> Enable composited border-radius scrolling as mask tiling is implemented.
> We'll revert this CL if anything breaks.
>
> Bug:  567293 ,  567296 
> Cq-Include-Trybots: master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2
> Change-Id: I70bea4c542e00d244a597d1a36857dd120fc96cd
> Reviewed-on: https://chromium-review.googlesource.com/543397
> Commit-Queue: Xianda Sun <sunxd@chromium.org>
> Reviewed-by: Chris Harrelson <chrishtr@chromium.org>
> Reviewed-by: Robert Flack <flackr@chromium.org>
> Cr-Commit-Position: refs/heads/master@{#485040}

TBR=chrishtr@chromium.org, enne@chromium.org, flackr@chromium.org, schenney@chromium.org, sunxd@chromium.org, trchen@chromium.org


(cherry picked from commit 2397e783b2b5a59a174d25d26f66d467a8b0a88f)

Bug:  567293 ,  567296 ,  740720 ,  745114 
Change-Id: Ia185a9ce4310aeaff0175f0e9f0a9080dccf22e5
Cq-Include-Trybots: master.tryserver.chromium.linux:linux_layout_tests_slimming_paint_v2
Reviewed-on: https://chromium-review.googlesource.com/585227
Commit-Queue: Chris Harrelson <chrishtr@chromium.org>
Reviewed-by: Chris Harrelson <chrishtr@chromium.org>
Reviewed-by: Xianda Sun <sunxd@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#489477}
Reviewed-on: https://chromium-review.googlesource.com/586949
Cr-Commit-Position: refs/branch-heads/3163@{#61}
Cr-Branched-From: ff259bab28b35d242e10186cd63af7ed404fae0d-refs/heads/master@{#488528}
[add] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/compositing/overflow/respect-clip-for-non-composited-scrollers-when-prefering-compositing-over-lcd-text-expected.html
[delete] https://crrev.com/87fcab7b0e641287d255d235222693de248f923b/third_party/WebKit/LayoutTests/compositing/overflow/respect-clip-for-non-composited-scrollers-when-prefering-compositing-over-lcd-text-expected.png
[delete] https://crrev.com/87fcab7b0e641287d255d235222693de248f923b/third_party/WebKit/LayoutTests/compositing/overflow/respect-clip-for-non-composited-scrollers-when-prefering-compositing-over-lcd-text-expected.txt
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/compositing/overflow/scroller-with-border-radius-expected.txt
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/compositing/overflow/scroller-with-border-radius.html
[delete] https://crrev.com/87fcab7b0e641287d255d235222693de248f923b/third_party/WebKit/LayoutTests/flag-specific/enable-slimming-paint-v2/compositing/overflow/respect-clip-for-non-composited-scrollers-when-prefering-compositing-over-lcd-text-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/linux/compositing/overflow/nested-border-radius-clipping-expected.png
[delete] https://crrev.com/87fcab7b0e641287d255d235222693de248f923b/third_party/WebKit/LayoutTests/platform/linux/virtual/disable-spinvalidation/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/linux/virtual/prefer_compositing_to_lcd_text/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/mac-mac10.9/scrollbars/border-box-rect-clips-scrollbars-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/mac-mac10.9/virtual/prefer_compositing_to_lcd_text/scrollbars/border-box-rect-clips-scrollbars-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/mac/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/mac/scrollbars/border-box-rect-clips-scrollbars-expected.png
[delete] https://crrev.com/87fcab7b0e641287d255d235222693de248f923b/third_party/WebKit/LayoutTests/platform/mac/virtual/disable-spinvalidation/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/mac/virtual/prefer_compositing_to_lcd_text/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/mac/virtual/prefer_compositing_to_lcd_text/scrollbars/border-box-rect-clips-scrollbars-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/win/compositing/overflow/nested-border-radius-clipping-expected.png
[delete] https://crrev.com/87fcab7b0e641287d255d235222693de248f923b/third_party/WebKit/LayoutTests/platform/win/virtual/disable-spinvalidation/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/LayoutTests/platform/win/virtual/prefer_compositing_to_lcd_text/compositing/overflow/nested-border-radius-clipping-expected.png
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/Source/core/layout/compositing/CompositedLayerMappingTest.cpp
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/Source/core/page/scrolling/ScrollingCoordinatorTest.cpp
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/Source/core/paint/PaintLayerClipper.cpp
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/Source/core/paint/PaintLayerScrollableArea.cpp
[modify] https://crrev.com/58b7f637c29e9eae0b1b32b40b1056f7a93382a4/third_party/WebKit/Source/web/tests/ScrollMetricsTest.cpp

After a second investigation, I found that solid color analysis may not be doing the correct thing when analyzing a portion of rrect. It always return non_solid_color so we end up creating zillions of tiled draw quads instead of solid draw quads in this case, and the textures explode.

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/a5f7079f3c63aa9cec376886fddb1141527bfd53

commit a5f7079f3c63aa9cec376886fddb1141527bfd53
Author: sunxd <sunxd@chromium.org>
Date: Thu Aug 03 14:32:09 2017

cc: Support ClipRRect in SolidColorAnalyzer

We used to unconditionally return not_solid_color when analyzing the op
ClipRRect. This lead to huge memory usage of composited border-radius
scrolling because we need to store the texture for the whole mask layer.

This CL makes SolidColorAnalyzer capable of determining whether a tile
is fully covered by the clip rrect, so we can save memory by not storing
textures of solid color quads.

Bug:  567293 ,  567296 ,  740720 
Cq-Include-Trybots: master.tryserver.blink:linux_trusty_blink_rel
Change-Id: I24b10a2d68c0c608aec8e5a8bafaabb9800cd466
Reviewed-on: https://chromium-review.googlesource.com/591913
Reviewed-by: Robert Flack <flackr@chromium.org>
Reviewed-by: Walter Korman <wkorman@chromium.org>
Reviewed-by: Vladimir Levin <vmpstr@chromium.org>
Commit-Queue: Xianda Sun <sunxd@chromium.org>
Cr-Commit-Position: refs/heads/master@{#491732}
[modify] https://crrev.com/a5f7079f3c63aa9cec376886fddb1141527bfd53/cc/paint/solid_color_analyzer.cc
[modify] https://crrev.com/a5f7079f3c63aa9cec376886fddb1141527bfd53/cc/paint/solid_color_analyzer_unittest.cc

Thanks everytbody