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>
<rdar://problem/117528790>