Bug 252320

Summary:

Incorrect rendering of crossing SVG paths when fill is "none"

Product:

WebKit

Reporter:

samuel

Component:

SVG

Assignee:

Nobody <webkit-unassigned>

Status:

RESOLVED MOVED

Severity:

Normal

CC:

sabouhallawa, webkit-bug-importer, zimmermann

Priority:

Keywords:

InRadar

Version:

Safari 16

Hardware:

iPhone / iPad

OS:

iOS 16

Attachments:

Description	Flags
minimal SVG displaying the issue	none
Screenshot of the rendering issue	none

samuel

Reported 2023-02-15 09:43:54 PST

Created attachment 465002 [details] minimal SVG displaying the issue When two paths cross and fill is set to “none” a tiny piece of the background shines through. If the fill-attribute of the path is removed, things are rendered correctly. This seems to only happen if the SVG is placed inside a <button> in the HTML, it doesn't happen when placed in a regular <div>. Have seen the issue in Safari on an iPad with iOS 16.3.1. Does not happen in Safari 16.3 on macOS 13 nor in Epiphany 43, Chrome 110 or Firefox 109 on Fedora 37.

Attachments
minimal SVG displaying the issue (337 bytes, text/html) 2023-02-15 09:43 PST, samuel	no flags	Details
Screenshot of the rendering issue (43.92 KB, image/png) 2023-02-15 09:48 PST, samuel	no flags	Details
View All Add attachment proposed patch, testcase, etc.

samuel

Comment 1 2023-02-15 09:48:03 PST

Created attachment 465003 [details] Screenshot of the rendering issue

Radar WebKit Bug Importer

Comment 2 2023-02-22 09:44:19 PST

<rdar://problem/105783947>

Said Abou-Hallawa

Comment 3 2023-02-23 09:34:29 PST

I can reproduce this bug on iOS only. Bug is in a component below WebKit.

Note You need to log in before you can comment on or make changes to this bug.