| Summary: | A horizontal <line> is not rendered when contained in a parent group with a clip-path property. | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Patrick Ruzand <pruzand> | ||||||
| Component: | SVG | Assignee: | Nobody <webkit-unassigned> | ||||||
| Status: | RESOLVED CONFIGURATION CHANGED | ||||||||
| Severity: | Normal | CC: | ahmad.saleem792, ap, rniwa, simon.fraser, zalan, zimmermann | ||||||
| Priority: | P2 | ||||||||
| Version: | 528+ (Nightly build) | ||||||||
| Hardware: | All | ||||||||
| OS: | All | ||||||||
| Attachments: |
|
||||||||
Created attachment 460212 [details]
Safari 15.5 matches other browsers
I am unable to reproduce in Safari 15.5 on macOS 12.4 and as shown in the picture, all browser render the line. Thanks!
Thank you for testing! |
Created attachment 194032 [details] a simple testcase that reproduces the issue. A horizontal line whose parent has a clip-path attribute is not rendered, even if the clipPath geometry is "compatible" with the line geometry. For example, with the following markup: <g clip-path="url(#gfx_clip1)"> <line stroke-dasharray="none" y2="200" x2="340" y1="200" x1="10" stroke-miterlimit="4" stroke-linejoin="miter" stroke-linecap="butt" stroke-width="1" stroke-opacity="1" stroke="rgb(255, 0, 0)" fill-opacity="0" fill="none"> </line> </g> <clipPath id="gfx_clip1"> <rect height="500" width="500" y="0" x="0"></rect> </clipPath> the line is not rendered on screen. It works in FF19, IE9. Note that the issue does _not_ appear if: * the clip-path attribute is removed; or * a new shape is added to the group (provided the new shape changes the group bbox),the line is rendered. For example, the following markup does not reproduce the issue anymore: <g clip-path="url(#gfx_clip1)"> <line stroke-dasharray="none" y2="200" x2="340" y1="200" x1="10" stroke-miterlimit="4" stroke-linejoin="miter" stroke-linecap="butt" stroke-width="1" stroke-opacity="1" stroke="rgb(255, 0, 0)" fill-opacity="0" fill="none"> </line> <rect stroke-dasharray="none" width="200" height="100" y="30" x="10" stroke-miterlimit="4" stroke-linejoin="miter" stroke-linecap="butt" stroke-width="1" stroke-opacity="1" stroke="rgb(255, 0, 0)" fill-opacity="0" fill="none"> </rect> </g> <clipPath id="gfx_clip1"> <rect height="500" width="500" y="0" x="0"></rect> </clipPath> Attached a sample that reproduces the issue. Reproduced on: Safari 6.0.3 / MacOS X 10.8.3 Chrome 25.0.1364.172m / Windows 7 Chrome Canary 27.0.1446.3 / Windows 7