Re: Issue 231577 in chromium: SVG does not respect overflow:visible

449 views
Skip to first unread message

chro...@googlecode.com

unread,
Dec 18, 2013, 12:41:47 AM12/18/13
to chromi...@chromium.org

Comment #4 on issue 231577 by denn...@dglogik.com: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

pdr,

Can you please explain the workaround that you are referring to?

As you can see in this fiddle: http://jsfiddle.net/nSUEs/1/

The problem is that the stroke is being clipped and it seems impossible to
make it show up.

--
You received this message because this project is configured to send all
issue notifications to this address.
You may adjust your notification preferences at:
https://code.google.com/hosting/settings

chro...@googlecode.com

unread,
Dec 18, 2013, 12:52:47 AM12/18/13
to chromi...@chromium.org

Comment #5 on issue 231577 by p...@chromium.org: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

dennisk, you can work around this manually by increasing the size of your
SVG element. It's painful, but it does work.
http://jsfiddle.net/nSUEs/2

chro...@googlecode.com

unread,
Dec 18, 2013, 1:05:47 AM12/18/13
to chromi...@chromium.org

Comment #6 on issue 231577 by denn...@dglogik.com: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

pdr,

Wow, thank you for the extremely fast response. The problem with the
workaround is that that requires calculation of the boundaries of all
elements. Our use-case is for complicated SVGs with nested groups and
unpredictable stroke sizes that are set by javascript. Are there other
workarounds that will work automatically?

Should we hope that this issue will get some Chromium love? It seems to
work as expected in the latest Firefox25 and IE11.

chro...@googlecode.com

unread,
Dec 18, 2013, 4:49:46 PM12/18/13
to chromi...@chromium.org

Comment #7 on issue 231577 by p...@chromium.org: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

dennisk, you can use getBBox() or getStrokeBBox() to get bounding boxes of
things. There are some issues with those approaches though, and they are
not easy to use :/

Because 2 other browsers ship this, I think we have reached the bar for
implement this in Chrome/Blink. Personally, I have several other projects
ahead of this in my queue, but I'd be happy to review patches in this area
or give someone pointers to fixing this.

chro...@googlecode.com

unread,
Dec 26, 2013, 11:14:31 AM12/26/13
to chromi...@chromium.org

Comment #8 on issue 231577 by glaudis...@ciandt.com: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

This bug forced me to remove chrome from supported browsers of my app.

Please can any great soul fix it ?

chro...@googlecode.com

unread,
Feb 17, 2014, 10:40:27 AM2/17/14
to chromi...@chromium.org

Comment #10 on issue 231577 by e...@opera.com: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

Seems like overflow:visible on outermost svg elements that are inline in
html works in Firefox, TC: http://jsfiddle.net/7Z4KP/.

chro...@googlecode.com

unread,
Mar 31, 2014, 10:47:01 AM3/31/14
to chromi...@chromium.org
Updates:
Status: Started
Owner: e...@opera.com

Comment #11 on issue 231577 by e...@opera.com: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

(No comment was entered for this change.)

chro...@googlecode.com

unread,
Apr 1, 2014, 7:56:20 AM4/1/14
to chromi...@chromium.org

Comment #12 on issue 231577 by e...@opera.com: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

Firefox treats 'overflow: auto' as 'overflow: hidden' in svg, contrary to
what the SVG spec says, but more in line with what CSS says (even if it
doesn't make sense to display with scrollbars like CSS asks for in this
case). Opinions on this? Firefox is currently the only browser that
treats 'overflow: auto' as hidden.

Some discussion here: http://www.w3.org/2011/01/19-svg-minutes.html#item07
W3C testcase:
http://dev.w3.org/SVG/profiles/1.1F2/test/svg/painting-marker-05-f.svg

See https://codereview.chromium.org/220853002/.

chro...@googlecode.com

unread,
Apr 1, 2014, 10:51:44 AM4/1/14
to chromi...@chromium.org

Comment #13 on issue 231577 by glaudis...@ciandt.com: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

I don't think firefox is correct using hidden as auto... but hey, this
topic is about "overflow: visible", I think "overflow: auto" is out of
scope from here.

chro...@googlecode.com

unread,
Apr 22, 2014, 5:53:15 AM4/22/14
to chromi...@chromium.org

Comment #16 on issue 231577 by bugdro...@chromium.org: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577#c16

The following revision refers to this bug:
http://src.chromium.org/viewvc/blink?view=rev&rev=172126

------------------------------------------------------------------
r172126 | e...@opera.com | 2014-04-22T08:33:29.038130Z

Changed paths:
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/in-html/overflow-repaint-expected.html?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/in-html/overflow-repaint.html?r1=172126&r2=172125&pathrev=172126
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/svg/different-overflow-values-expected.txt?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-visible-repaint-expected.txt?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-vertical-auto.svg?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-vertical-auto-expected.html?r1=172126&r2=172125&pathrev=172126
M
http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/svg/SVGRenderSupport.cpp?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/W3C-SVG-1.1-SE/painting-marker-05-f.svg?r1=172126&r2=172125&pathrev=172126
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-in-xhtml-visible.xhtml?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/W3C-SVG-1.1-SE/painting-marker-06-f.svg?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/in-html/overflow-svg-root-style-expected.html?r1=172126&r2=172125&pathrev=172126
M
http://src.chromium.org/viewvc/blink/trunk/Source/core/frame/FrameView.cpp?r1=172126&r2=172125&pathrev=172126
M
http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/svg/RenderSVGRoot.cpp?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/in-html/overflow-svg-root-style.html?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/in-html/overflow-svg-root-expected.html?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/in-html/overflow-svg-root.html?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-scroll-on-outermost-svg-element.svg?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-horizontal-auto.svg?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-y-hidden-on-outermost-svg-element-expected.svg?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-x-hidden-on-outermost-svg-element.svg?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-y-hidden-on-outermost-svg-element.svg?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-scroll-on-outermost-svg-element-expected.html?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/animations/animate-viewport-overflow.html?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-horizontal-auto-expected.html?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/in-html/overflow-svg-root-attr-expected.html?r1=172126&r2=172125&pathrev=172126
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/fast/svg/different-overflow-values.html?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/in-html/overflow-svg-root-attr.html?r1=172126&r2=172125&pathrev=172126
M
http://src.chromium.org/viewvc/blink/trunk/Source/core/css/resolver/StyleAdjuster.cpp?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/W3C-SVG-1.1-SE/painting-marker-05-f-expected.txt?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-x-hidden-on-outermost-svg-element-expected.svg?r1=172126&r2=172125&pathrev=172126
M
http://src.chromium.org/viewvc/blink/trunk/Source/core/rendering/svg/RenderSVGRoot.h?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/animations/animate-viewport-overflow-2-expected.html?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/animations/animate-viewport-overflow-2.html?r1=172126&r2=172125&pathrev=172126
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.txt?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/animations/animate-viewport-overflow-expected.html?r1=172126&r2=172125&pathrev=172126
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-3-expected.txt?r1=172126&r2=172125&pathrev=172126
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/W3C-SVG-1.1-SE/painting-marker-06-f-expected.txt?r1=172126&r2=172125&pathrev=172126
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/TestExpectations?r1=172126&r2=172125&pathrev=172126

SVG does not respect overflow:visible.

For standalone svg documents, always clip to the viewport ('auto' acts
as 'hidden').

For 'overflow: hidden | scroll' on any svg element: clip.
For 'overflow: auto | visible' on any svg element: don't clip.

New behaviours for stand-alone svg documents:
* overflow-x and overflow-y for controlling each scrollbar independently is
now supported.
* overflow:scroll will display scrollbars regardless of the svg overflowing
or not (as required by CSS).
* overflow:hidden will cause overflow to be clipped away and scrollbars to
be hidden.

BUG=231577

Review URL: https://codereview.chromium.org/220853002
-----------------------------------------------------------------

chro...@googlecode.com

unread,
Apr 22, 2014, 8:49:01 AM4/22/14
to chromi...@chromium.org

Comment #17 on issue 231577 by bugdro...@chromium.org: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577#c17

The following revision refers to this bug:
http://src.chromium.org/viewvc/blink?view=rev&rev=172129

------------------------------------------------------------------
r172129 | oj...@chromium.org | 2014-04-22T11:25:00.580374Z

Changed paths:
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-snowleopard/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-3-expected.txt?r1=172129&r2=172128&pathrev=172129
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-lion/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.txt?r1=172129&r2=172128&pathrev=172129
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-lion/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-3-expected.txt?r1=172129&r2=172128&pathrev=172129
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.png?r1=172129&r2=172128&pathrev=172129
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/linux/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.png?r1=172129&r2=172128&pathrev=172129
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/svg/W3C-SVG-1.1-SE/painting-marker-05-f-expected.txt?r1=172129&r2=172128&pathrev=172129
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/svg/overflow/overflow-on-outermost-svg-element-in-xhtml-visible-expected.txt?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/svg/W3C-SVG-1.1-SE/painting-marker-06-f-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/svg/overflow/overflow-on-outermost-svg-element-in-xhtml-visible-expected.txt?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/linux/svg/W3C-SVG-1.1-SE/painting-marker-06-f-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/svg/W3C-SVG-1.1-SE/painting-marker-06-f-expected.png?r1=172129&r2=172128&pathrev=172129
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-3-expected.txt?r1=172129&r2=172128&pathrev=172129
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-mountainlion/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/android/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-3-expected.txt?r1=172129&r2=172128&pathrev=172129
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/TestExpectations?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-mountainlion/svg/W3C-SVG-1.1-SE/painting-marker-06-f-expected.png?r1=172129&r2=172128&pathrev=172129
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-in-xhtml-visible-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/android/svg/overflow/overflow-on-outermost-svg-element-in-xhtml-visible-expected.png?r1=172129&r2=172128&pathrev=172129
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-snowleopard/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.png?r1=172129&r2=172128&pathrev=172129
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-lion/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/svg/W3C-SVG-1.1-SE/painting-marker-06-f-expected.txt?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/svg/W3C-SVG-1.1-SE/painting-marker-05-f-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/linux/svg/W3C-SVG-1.1-SE/painting-marker-05-f-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/svg/W3C-SVG-1.1-SE/painting-marker-05-f-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/win/svg/overflow/overflow-on-outermost-svg-element-in-xhtml-visible-expected.png?r1=172129&r2=172128&pathrev=172129
M
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac/svg/overflow/overflow-on-outermost-svg-element-in-xhtml-visible-expected.png?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/android/svg/overflow?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/android/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.png?r1=172129&r2=172128&pathrev=172129
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/svg/overflow/overflow-on-outermost-svg-element-in-xhtml-visible-expected.txt?r1=172129&r2=172128&pathrev=172129
A
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/android/svg/overflow/overflow-on-outermost-svg-element-in-xhtml-visible-expected.txt?r1=172129&r2=172128&pathrev=172129
D
http://src.chromium.org/viewvc/blink/trunk/LayoutTests/platform/mac-snowleopard/svg/overflow/overflow-on-outermost-svg-element-ignore-attribute-1-expected.txt?r1=172129&r2=172128&pathrev=172129

Auto-rebaseline for r172126

http://src.chromium.org/viewvc/blink?view=revision&revision=172126

BUG=231577
TBR=e...@opera.com

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

chro...@googlecode.com

unread,
May 15, 2014, 1:09:49 PM5/15/14
to chromi...@chromium.org

Comment #20 on issue 231577 by p...@chromium.org: SVG does not respect
overflow:visible
http://code.google.com/p/chromium/issues/detail?id=231577

artin.phares, the fix will roll out in the next few weeks/months. You can
test this using Chrome Canary or Opera Next.

chro...@googlecode.com

unread,
Jan 9, 2015, 10:59:50 AM1/9/15
to chromi...@chromium.org

Comment #22 on issue 231577 by Bas...@gmail.com: SVG does not respect
overflow:visible
https://code.google.com/p/chromium/issues/detail?id=231577

This is still an issue in Chrome Canary 41.0.2270.0 canary (64-bit) on Mac
OS X

chro...@googlecode.com

unread,
Feb 21, 2015, 7:13:19 PM2/21/15
to chromi...@chromium.org

Comment #24 on issue 231577 by r...@charlotteip.com: SVG does not respect
overflow:visible
https://code.google.com/p/chromium/issues/detail?id=231577

I believe I am still seeing a variant of this clipping behavior in Chrome
40 (with overflow:visible set in the CSS). It occurs on the ends of paths
that touch the boundaries of the viewport and have fill=none,
stroke-width=<something biggish>, so paths being used as lines essentially.
The additional stroke appears to be what is getting clipped. I can open a
new case if that is what needs to happen. A pic of the output with the
stroke width set to a large number is attached.

Attachments:
clipped_svg_path_fill-none_strokewidth-big.png 53.0 KB

chro...@googlecode.com

unread,
Sep 11, 2015, 4:55:30 PM9/11/15
to chromi...@chromium.org

Comment #27 on issue 231577 by e...@chromium.org: SVG does not respect
overflow:visible
https://code.google.com/p/chromium/issues/detail?id=231577

@jeff: confirmed, file a new bug for that please.

chro...@googlecode.com

unread,
Sep 14, 2015, 11:41:45 AM9/14/15
to chromi...@chromium.org

Comment #28 on issue 231577 by j...@skratchdot.com: SVG does not respect
overflow:visible
https://code.google.com/p/chromium/issues/detail?id=231577

For future reference, I logged a new bug here:
https://code.google.com/p/chromium/issues/detail?id=530790
("overflow:visible on svg with border-radius doesn't work")
Reply all
Reply to author
Forward
0 new messages