Bug 217557 - Stroking emoji with a gradient fills the emoji
Summary: Stroking emoji with a gradient fills the emoji
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Canvas (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2020-10-09 23:23 PDT by Myles C. Maxfield
Modified: 2020-10-16 23:24 PDT (History)
2 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Myles C. Maxfield 2020-10-09 23:23:27 PDT
let context = canvas.getContext("2d");
context.font = "192px 'Times'";
context.lineWidth = 2;
let gradient = context.createLinearGradient(200, 200, 400, 200);
gradient.addColorStop(0, "rgb(255, 0, 128)");
gradient.addColorStop(1, "rgb(255, 153, 51)");
context.strokeStyle = gradient;
context.strokeText("😁", 200, 200);
Comment 1 Myles C. Maxfield 2020-10-09 23:24:20 PDT
Our rendering doesn't match the other browsers.
Comment 2 Myles C. Maxfield 2020-10-09 23:36:31 PDT
Looks like, even if you fill the emoji, we fill it with the gradient when other browsers just show the emoji.
Comment 3 Radar WebKit Bug Importer 2020-10-16 23:24:13 PDT
<rdar://problem/70403450>