Bug 263375
| Summary: | display-p3 stroke color is invisible in canvas | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Starli0n <s_theroude> |
| Component: | Canvas | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Major | CC: | dino, heycam, webkit-bug-importer |
| Priority: | P2 | Keywords: | InRadar |
| Version: | Safari 16 | ||
| Hardware: | Mac (Apple Silicon) | ||
| OS: | macOS 12 | ||
Starli0n
In a context of using a canvas, a display-p3 color stroke becomes invisible.
It happens after creating a line with a color.
Then, if the line width is changed but not the color,
a second stroke will be invisible.
The bug is not present for hexa colors.
If the color is changed between the two stoke, the bug is not present.
Here is a sample to easily reproduce the bug:
(The code needs to be copy/paste)
// https://www.w3schools.com/jsref/tryit.asp?filename=tryhtml5_canvas_stroke
<!DOCTYPE html>
<html>
<body>
<h1>HTML5 Canvas</h1>
<h2>The stroke() Method</h2>
<canvas id="myCanvas" width="300" height="150" style="border:1px solid grey"></canvas>
<script>
const c = document.getElementById("myCanvas");
const ctx = c.getContext("2d");
ctx.strokeStyle = "color(display-p3 1 0 0 / 1)";
ctx.lineWidth = 1;
ctx.beginPath();
ctx.moveTo(20, 20);
ctx.lineTo(20, 100);
ctx.stroke();
// ctx.strokeStyle = "color(display-p3 0 0 1 / 1)";
ctx.lineWidth = 2;
ctx.beginPath();
ctx.moveTo(40, 20);
ctx.lineTo(40, 100);
ctx.stroke();
</script>
</body>
</html>
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Radar WebKit Bug Importer
<rdar://problem/117528790>