Skip to content

Instagram.com: story circle borders are black instead of colorful.#62320

Open
mattwoodrow wants to merge 1 commit intoWebKit:mainfrom
mattwoodrow:eng/stroke-arc-gradient
Open

Instagram.com: story circle borders are black instead of colorful.#62320
mattwoodrow wants to merge 1 commit intoWebKit:mainfrom
mattwoodrow:eng/stroke-arc-gradient

Conversation

@mattwoodrow
Copy link
Copy Markdown
Contributor

@mattwoodrow mattwoodrow commented Apr 9, 2026

60bbef0

Instagram.com: story circle borders are black instead of colorful.
https://bugs.webkit.org/show_bug.cgi?id=311780
<rdar://173536875>

Reviewed by NOBODY (OOPS!).

Stroked arcs with a gradient fill aren't being rendered correctly.

Fall back to strokePath if there's a gradient fill, since that requires special
handling outside of CG.  Match strokePath's behaviour for pattern fills, and
explicitly apply it.

Tests: imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc-ref.html
       imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc.html
       imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc-ref.html
       imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc.html

* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc-ref.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc-ref.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc.html: Added.
* Source/WebCore/platform/graphics/cg/GraphicsContextCG.cpp:
(WebCore::GraphicsContextCG::strokeArc):

60bbef0

Misc iOS, visionOS, tvOS & watchOS macOS Linux Windows Apple Internal
✅ 🧪 style ⏳ 🛠 ios loading 🛠 mac ⏳ 🛠 wpe ⏳ 🛠 win ⏳ 🛠 ios-apple
✅ 🧪 bindings ⏳ 🛠 ios-sim ⏳ 🛠 mac-AS-debug ⏳ 🧪 wpe-wk2 ⏳ 🧪 win-tests ⏳ 🛠 mac-apple
✅ 🧪 webkitperl ⏳ 🧪 ios-wk2 loading 🧪 api-mac ⏳ 🧪 api-wpe ⏳ 🛠 vision-apple
⏳ 🧪 ios-wk2-wpt ⏳ 🧪 api-mac-debug ⏳ 🛠 gtk3-libwebrtc
⏳ 🧪 api-ios loading 🧪 mac-wk1 ⏳ 🛠 gtk
⏳ 🛠 ios-safer-cpp loading 🧪 mac-wk2 ⏳ 🧪 gtk-wk2
⏳ 🛠 vision ⏳ 🧪 mac-AS-debug-wk2 ⏳ 🧪 api-gtk
⏳ 🛠 vision-sim loading 🧪 mac-wk2-stress ⏳ 🛠 playstation
⏳ 🧪 vision-wk2 loading 🧪 mac-intel-wk2
⏳ 🛠 tv ⏳ 🛠 mac-safer-cpp
⏳ 🛠 tv-sim
⏳ 🛠 watch
⏳ 🛠 watch-sim

@mattwoodrow mattwoodrow self-assigned this Apr 9, 2026
@mattwoodrow mattwoodrow added the Layout and Rendering For bugs with layout and rendering of Web pages. label Apr 9, 2026
@webkit-ews-buildbot webkit-ews-buildbot added the merging-blocked Applied to prevent a change from being merged label Apr 9, 2026
https://bugs.webkit.org/show_bug.cgi?id=311780
<rdar://173536875>

Reviewed by NOBODY (OOPS!).

Stroked arcs with a gradient fill aren't being rendered correctly.

Fall back to strokePath if there's a gradient fill, since that requires special
handling outside of CG.  Match strokePath's behaviour for pattern fills, and
explicitly apply it.

Tests: imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc-ref.html
       imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc.html
       imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc-ref.html
       imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc.html

* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc-ref.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.gradient.arc.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc-expected.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc-ref.html: Added.
* LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.pattern.arc.html: Added.
* Source/WebCore/platform/graphics/cg/GraphicsContextCG.cpp:
(WebCore::GraphicsContextCG::strokeArc):
@mattwoodrow mattwoodrow removed the merging-blocked Applied to prevent a change from being merged label Apr 9, 2026
@mattwoodrow mattwoodrow force-pushed the eng/stroke-arc-gradient branch from 37d00b9 to 60bbef0 Compare April 9, 2026 03:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Layout and Rendering For bugs with layout and rendering of Web pages.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants