Bug 248003

Summary:

SVG path artifact showing up along bounding box

Product:

WebKit

Reporter:

Jonathan Olson <jonathan.olson>

Component:

SVG

Assignee:

Nobody <webkit-unassigned>

Status:

RESOLVED MOVED

Severity:

Normal

CC:

sabouhallawa, simon.fraser, support, webkit-bug-importer, x-alex-95+bugzilla, zalan, zimmermann

Priority:

Keywords:

InRadar

Version:

Safari 16

Hardware:

Mac (Apple Silicon)

OS:

macOS 13

See Also:

https://bugs.webkit.org/show_bug.cgi?id=245652

Attachments:

Description	Flags
A horizontal black line appears incorrectly above the arrow	none
Test case	none

Description Jonathan Olson 2022-11-16 17:29:29 PST

Created attachment 463562 [details]
A horizontal black line appears incorrectly above the arrow

Overview: As of Safari 16, visual artifacts (1-pixel wide lines) are showing up as if they are part of a stroked path. This is reproducible, persistent, and appears to happen along the top edge of the bounding box of the path.

Steps to reproduce:

View the following HTML:
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <title>Arrow bug test</title>
</head>
<body>
  <svg focusable="false" width="1502" height="566">
    <g transform="matrix(0.84317049365593055299,0.00000000000000000000,0.00000000000000000000,0.84317049365593055299,319.29670724816355686926,0.00000000000000000000)">
      <g transform="scale(0.80000000000000004441)">
        <path d="M 429.73685877293036128322 152.33263688218951870113 L 475.96967537052415764265 314.78633972164936949412 L 471.16063094948151501740 316.15494914600617448741 L 482.48002585411597920029 328.52916827259900856006 L 485.58776421260949973657 312.04912087293575950753 L 480.77871979156685711132 313.41773029729256450082 L 434.54590319397306075189 150.96402745783271370783 L 429.73685877293036128322 152.33263688218951870113 Z" style="fill: rgb(50,130,215); stroke: rgb(64,64,64);"></path>
      </g>
    </g>
  </svg>
</body>
</html>

Actual results: <attached> (there is a black line above the arrow)

Expected results: There should be no black line along the top. It should just show the arrow

Build Date & Hardware:

macOS 13.0.1
Safari Version 16.1 (18614.2.9.1.12)
Release 157 (Safari 16.4, WebKit 18615.1.11.7)

Additional information:

Discovered in https://github.com/phetsims/geometric-optics-basics/issues/31.

Adding "M0 0" at the end of the SVG path definition seems to prevent the bug from happening.

Comment 1 Alexey Proskuryakov 2022-11-16 22:05:23 PST

I can reproduce as described.

Comment 2 Simon Fraser (smfr) 2022-11-17 09:59:53 PST

Created attachment 463588 [details]
Test case

Comment 3 Simon Fraser (smfr) 2022-11-17 10:00:39 PST

Can you reproduce in Safari Tech Preview 157?

Comment 4 Jonathan Olson 2022-11-17 11:33:40 PST

I was able to reproduce this in Safari Tech Preview 157.

Comment 5 Radar WebKit Bug Importer 2022-11-23 17:30:16 PST

<rdar://problem/102635866>

Comment 6 Said Abou-Hallawa 2023-01-11 11:33:33 PST

I can reproduce this bug on MacBook Pro AS only. I can't reproduce it on Intel machines. Bug is in a component below WebKit.

Comment 7 Simon Fraser (smfr) 2023-02-20 11:01:33 PST

*** Bug 245652 has been marked as a duplicate of this bug. ***

Comment 8 Simon Fraser (smfr) 2023-02-20 11:02:24 PST

*** Bug 252133 has been marked as a duplicate of this bug. ***