198628 2019-06-06 16:04:32 -0700 SVG fill gradients don't support P3 color space 2020-05-24 18:05:09 -0700 1 1 1 Unclassified WebKit SVG Safari 12 Mac macOS 10.14 NEW https://bugs.webkit.org/show_bug.cgi?id=212231 InRadar P2 Normal --- 1 wk1 webkit-unassigned dino sabouhallawa sam simon.fraser thorton webkit-bug-importer zimmermann oldest_to_newest 1542591 0 371534 wk1 2019-06-06 16:04:32 -0700 Created attachment 371534 Test case WebKit doesn't render gradients containing display-p3 colors correctly. The attached SVG file shows a square filled with a blue linear gradient and a circle filled with a flat purple color. All colors are in display-p3 color space and are specified using CSS color() syntax. The circle renders as expected, but the fill of the square is white. Environment: Safari 12.1.1 (14607.2.6.1.1) macOS 10.14.5 (18F132) 1542724 1 webkit-bug-importer 2019-06-06 22:18:18 -0700 <rdar://problem/51511996> 1543459 2 wk1 2019-06-10 14:15:53 -0700 The bug is related to how WebCore incorporates the opacity of the stop into the color of the stop. For combining the stop's color and opacity, the color is converted to RGBA32, which doesn't work for extended (i.e. P3) colors. There is a FIXME comment present that the current approach should be changed, but it notes that the corresponding member function of Color rounds the alpha component differently and is therefore not used. https://trac.webkit.org/browser/webkit/trunk/Source/WebCore/svg/SVGStopElement.cpp#L98 What is the suggested way to proceed? 1655770 3 simon.fraser 2020-05-24 13:38:08 -0700 As of https://trac.webkit.org/changeset/262035/webkit, the gradient now shows up. I'm not sure if it's using extended color correctly. yet. 1655779 4 sam 2020-05-24 18:03:17 -0700 Cool. We should probably add a test case for this then. Not sure what our best bet is. Ref-test vs. the same css gradient? Some pixel poking getImageData()? 1655780 5 sam 2020-05-24 18:05:09 -0700 As for accuracy, I am also not sure. The general gradient code uses a color space called kCGColorSpaceExtendedSRGB when any stop contains an extended color. I haven't been able to find any good documentation on that colorspace and whether P3 is a subset of it. (Not mention, "correct" here is not really defined yet - https://github.com/w3c/csswg-drafts/issues/4647) 371534 2019-06-06 16:04:32 -0700 2019-06-06 16:04:32 -0700 Test case p3-gradient-test.svg image/svg+xml 788 wk1 PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMjAwcHgi IGhlaWdodD0iMjAwcHgiIHZpZXdCb3g9IjAgMCAyMDAgMjAwIiB2ZXJzaW9uPSIxLjEiIHhtbG5z PSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMu b3JnLzE5OTkveGxpbmsiPgogIDx0aXRsZT5QMzwvdGl0bGU+CiAgPGRlZnM+CiAgICAgICAgPGxp bmVhckdyYWRpZW50IHgxPSI1MCUiIHkxPSIwJSIgeDI9IjUwJSIgeTI9IjEwMCUiIGlkPSJsaW5l YXJHcmFkaWVudC0xIj4KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iY29sb3IoZGlzcGxh eS1wMyAwIDAuMyAxKSIgb2Zmc2V0PSIwJSI+PC9zdG9wPgogICAgICAgICAgICA8c3RvcCBzdG9w LWNvbG9yPSJjb2xvcihkaXNwbGF5LXAzIDAgMC42IDEpIiBvZmZzZXQ9IjEwMCUiPjwvc3RvcD4K ICAgICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPGcgaWQ9IlBhZ2UtMSIg c3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZl bm9kZCI+CiAgICAgICAgPHJlY3QgaWQ9IlJlY3RhbmdsZSIgZmlsbD0idXJsKCNsaW5lYXJHcmFk aWVudC0xKSIgeD0iMCIgeT0iMCIgd2lkdGg9IjIwMCIgaGVpZ2h0PSIyMDAiPjwvcmVjdD4KICAg ICAgICA8Y2lyY2xlIGlkPSJPdmFsIiBmaWxsPSJjb2xvcihkaXNwbGF5LXAzIDEgMCAxKSIgY3g9 IjEwMCIgY3k9IjEwMCIgcj0iNzUiPjwvY2lyY2xlPgogICAgPC9nPgo8L3N2Zz4=