Status Update
Comments
li...@chromium.org <li...@chromium.org> #2
The issue is reproducible in Windows 7 & not a regression
Builds Used :
22.0.1215.1 (Official Build 147996) canary
21.0.1180.54 (Official Build 148032)
Builds Used :
22.0.1215.1 (Official Build 147996) canary
21.0.1180.54 (Official Build 148032)
li...@chromium.org <li...@chromium.org> #3
[Empty comment from Monorail migration]
ke...@google.com <ke...@google.com> #4
Moving all non-blocking 22 issues to 23.
wa...@gmail.com <wa...@gmail.com> #5
The above jsfiddle seems to be fixed somehow in the current Chrome... But mine is still broken
http://jsfiddle.net/QJaXq/
http://code.google.com/p/chromium/issues/detail?can=1&start=0&num=100&q=canvas%20border&colspec=ID%20Pri%20Mstone%20ReleaseBlock%20OS%20Area%20Feature%20Status%20Owner%20Summary&groupby=&sort=&id=140733#makechanges
wa...@gmail.com <wa...@gmail.com> #6
Your fiddle seems to go hay-wire the second you make the encapsulating div position:relative;
or...@gmail.com <or...@gmail.com> #7
The bug still exists in my current version of beta Chrome (23.0.1271.22 beta-m), but only when the size is increased, as mentioned in the steps to reproduce. Changing the div to position: relative; also exposes the error.
ds...@chromium.org <ds...@chromium.org> #9
[Empty comment from Monorail migration]
[Deleted User] <[Deleted User]> #11
Moving all non essential bugs to the next Milestone
dh...@google.com <dh...@google.com> #12
Since the bug has moved few times, removing the milestone label. Please target the right milestone.
bu...@chromium.org <bu...@chromium.org> #13
[Empty comment from Monorail migration]
bu...@chromium.org <bu...@chromium.org> #14
[Empty comment from Monorail migration]
bu...@chromium.org <bu...@chromium.org> #15
[Empty comment from Monorail migration]
se...@chromium.org <se...@chromium.org> #16
[Empty comment from Monorail migration]
ju...@chromium.org <ju...@chromium.org> #17
The problem is related to GPU acceleration, which kicks in when the canvas reaches a size > 64k pixels. When that happens, the canvas becomes a composited layer. It looks like the accelerated compositor is not applying clipping correctly when drawing the texture layer associated with the canvas is drawn.
en...@chromium.org <en...@chromium.org> #18
[Empty comment from Monorail migration]
se...@chromium.org <se...@chromium.org> #19
[Empty comment from Monorail migration]
ju...@chromium.org <ju...@chromium.org> #20
[Empty comment from Monorail migration]
ju...@chromium.org <ju...@chromium.org> #21
[Empty comment from Monorail migration]
bu...@chromium.org <bu...@chromium.org> #22
The following revision refers to this bug:
http://src.chromium.org/viewvc/blink?view=rev&rev=158258
------------------------------------------------------------------------
r158258 | rosca@adobe.com | 2013-09-24T09:46:04.315825Z
Changed paths:
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-video-shadow.html?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderBox.h?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderLayerBacking.h?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/PaintPhase.h?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/platform/graphics/GraphicsLayer.cpp?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/platform/graphics/GraphicsContextAnnotation.cpp?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/platform/graphics/GraphicsLayerClient.h?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/platform/graphics/GraphicsLayer.h?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas-with-shadow-expected.html?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-video.html?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/web/painting/ContinuousPainter.cpp?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas-with-shadow.html?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderLayer.cpp?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas.html?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas-with-mask-expected.html?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderReplaced.cpp?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas-with-mask.html?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/TestExpectations?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas-padding-expected.html?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderLayer.h?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas-padding.html?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas-all-expected.html?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas-all.html?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-video-ratio.html?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderBox.cpp?r1=158258&r2=158257&pathrev=158258
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/borders/border-radius-mask-canvas-border.html?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderLayerCompositor.cpp?r1=158258&r2=158257&pathrev=158258
Mhttp://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/RenderLayerBacking.cpp?r1=158258&r2=158257&pathrev=158258
Large canvas does not honor containing div's border radius.
BUG=137818
Review URL:https://chromiumcodereview.appspot.com/16688004
------------------------------------------------------------------------
------------------------------------------------------------------------
r158258 | rosca@adobe.com | 2013-09-24T09:46:04.315825Z
Changed paths:
A
M
M
M
M
M
M
M
A
A
M
A
M
A
A
M
A
M
A
M
A
A
A
A
M
A
M
M
Large canvas does not honor containing div's border radius.
BUG=137818
Review URL:
------------------------------------------------------------------------
bu...@chromium.org <bu...@chromium.org> #23
The following revision refers to this bug:
http://src.chromium.org/viewvc/blink?view=rev&rev=158267
------------------------------------------------------------------------
r158267 | ojan@chromium.org | 2013-09-24T12:18:09.817753Z
Changed paths:
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-retina/fast/borders/border-radius-mask-canvas-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-video-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-video-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-snowleopard/fast/borders/border-radius-mask-video-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-retina/fast/borders?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-canvas-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-canvas-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-retina/fast/borders/border-radius-mask-video-shadow-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/linux/fast/borders/border-radius-mask-canvas-expected.png?r1=158267&r2=158266&pathrev=158267
Mhttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/TestExpectations?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-video-ratio-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/linux/fast/borders/border-radius-mask-video-ratio-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-video-ratio-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-canvas-border-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-video-shadow-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/linux/fast/borders/border-radius-mask-canvas-border-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-canvas-border-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-video-shadow-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/linux/fast/borders/border-radius-mask-video-shadow-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-retina/fast/borders/border-radius-mask-video-ratio-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-canvas-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-video-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/linux/fast/borders/border-radius-mask-video-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-snowleopard/fast/borders/border-radius-mask-canvas-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-retina/fast/borders/border-radius-mask-canvas-border-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-video-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-video-ratio-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-canvas-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-snowleopard/fast/borders/border-radius-mask-video-ratio-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-video-ratio-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-canvas-border-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-snowleopard/fast/borders/border-radius-mask-canvas-border-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-canvas-border-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/fast/borders/border-radius-mask-video-shadow-expected.txt?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-snowleopard/fast/borders/border-radius-mask-video-shadow-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-retina/fast/borders/border-radius-mask-video-expected.png?r1=158267&r2=158266&pathrev=158267
Ahttp://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/fast/borders/border-radius-mask-video-shadow-expected.png?r1=158267&r2=158266&pathrev=158267
Auto-rebaseline for r158258
http://src.chromium.org/viewvc/blink?view=revision&revision=158258
BUG=137818
TBR=rosca@adobe.com
Review URL:https://codereview.chromium.org/23464108
------------------------------------------------------------------------
------------------------------------------------------------------------
r158267 | ojan@chromium.org | 2013-09-24T12:18:09.817753Z
Changed paths:
A
A
A
A
A
A
A
A
A
M
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
A
Auto-rebaseline for r158258
BUG=137818
TBR=rosca@adobe.com
Review URL:
------------------------------------------------------------------------
ju...@chromium.org <ju...@chromium.org> #24
[Empty comment from Monorail migration]
ju...@chromium.org <ju...@chromium.org> #25
[Deleted User] <[Deleted User]> #26
No, I don't. I've just sent an email with a request.
ag...@gmail.com <ag...@gmail.com> #27
Hold the phone, guys. This isn't fixed.. checking in 64-bit Windows 7 Chrome 31.0.1650.63 and Canary 34.0.1777.0:
http://jsfiddle.net/LwZ6v/196/
sh...@chromium.org <sh...@chromium.org> #28
Reopening this bug. I can repro on the issue with the jsfiddle in https://crbug.com/chromium/137818#c26 , on tip of tree / canary
I have recently seen working examples of border-radius + overflow + composited. So this must be just a unique scenario that got overlooked.
I have recently seen working examples of border-radius + overflow + composited. So this must be just a unique scenario that got overlooked.
sh...@chromium.org <sh...@chromium.org> #29
Actually, wait - I wonder if this is working correctly.
inhttp://jsfiddle.net/LwZ6v/196/ the #box element is not a containing block for the canvas (as per CSS definition of containing block. In that scenario, isn't it correct for the canvas not to be clipped, because #box is not its containing block? For example, adding position: relative to the #box makes it a containing block for the canvas and does work.
Please correct me if i'm wrong.
in
Please correct me if i'm wrong.
[Deleted User] <[Deleted User]> #30
la...@gmail.com <la...@gmail.com> #31
It is still not fixed on Canary build 34.0.1779.2.
be...@gmail.com <be...@gmail.com> #32
i solve this with CSS tag to parent div to:
transform: translate3d(0,0,0);
it's work on current chrome version 36.0.1985.143 m
transform: translate3d(0,0,0);
it's work on current chrome version 36.0.1985.143 m
be...@gmail.com <be...@gmail.com> #33
ju...@chromium.org <ju...@chromium.org> #34
[Empty comment from Monorail migration]
la...@google.com <la...@google.com> #35
Migrate from Cr-Blink-Rendering to Cr-Blink-Layout
ma...@google.com <ma...@google.com> #36
Issue has owner, setting Status to Assigned.
ju...@chromium.org <ju...@chromium.org> #37
[Empty comment from Monorail migration]
ju...@chromium.org <ju...@chromium.org> #38
This will be fixed by phasing out the old GPU-accelerated code path in favor of the new display list based implementation.
ch...@chromium.org <ch...@chromium.org> #39
ju...@chromium.org <ju...@chromium.org> #40
Yes it is a duplicate indeed. What the two bugs have in common is that the CSS transform from https://crbug.com/chromium/157218 and the GPU-acceleration of canvases is that they both result in content being promoted to their own compositing layer, and that is mostly likely the root of the issue.
gi...@appspot.gserviceaccount.com <gi...@appspot.gserviceaccount.com> #41
[Comment Deleted]
is...@google.com <is...@google.com> #42
This issue was migrated from crbug.com/chromium/137818?no_tracker_redirect=1
[Multiple monorail components: Blink, Blink>Compositing, Blink>Layout, Internals>Compositing]
[Monorail blocked-on:crbug.com/chromium/477796 ]
[Monorail mergedwith:crbug.com/chromium/178700 , crbug.com/chromium/258824 ]
[Monorail mergedinto:crbug.com/chromium/157218 ]
[Monorail components added to Component Tags custom field.]
[Multiple monorail components: Blink, Blink>Compositing, Blink>Layout, Internals>Compositing]
[Monorail blocked-on:
[Monorail mergedwith:
[Monorail mergedinto:
[Monorail components added to Component Tags custom field.]
Description
Chrome Version : 22.0.1206.0http://jsfiddle.net/LwZ6v/
OS Version: 6.1 (Windows 7, Windows Server 2008 R2)
URLs (if applicable) :
Other browsers tested:
Add OK or FAIL after other browsers where you have tested this issue:
Safari 5:
Firefox 4.x: OK
IE 7/8/9: OK (IE 9)
What steps will reproduce the problem?
What is the expected result?
The canvas should not overflow the rounded corners of its parent div.
What happens instead?
The canvas displays over the rounded corners of its parent div.
Please provide any additional information below. Attach a screenshot if
possible.
UserAgentString: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.1 (KHTML, like Gecko) Chrome/22.0.1206.0 Safari/537.1
Screenshots of the jsfiddles are attached. Note how the canvas size changes the behavior of the canvas and reveals the bug.