Bug 230084

Summary:	Canvas shifts colors when using system color profiles
Product:	WebKit	Reporter:	Roland Soos <roland>
Component:	Canvas	Assignee:	Nobody <webkit-unassigned>
Status:	NEW ---
Severity:	Normal	CC:	ahmad.saleem792, bfulgham, dino, heycam, sam, simon.fraser, webkit-bug-importer, zalan
Priority:	P2	Keywords:	InRadar
Version:	Safari 14
Hardware:	Unspecified
OS:	Unspecified

Description Roland Soos 2021-09-08 23:24:09 PDT

Steps to reproduce:
1. Open https://jsfiddle.net/tz0qhowy/2/

The left element has a red background and an image which has 0.5 opacity.
The right element is a canvas which has red background and the image drawn with 50% opacity.

I think both the left and the right side should always perfectly match with each other. 

In Safari during you switch color profiles [OSX System settings -> Displays -> Color], you can clearly see that the color do not match on the canvas with the one rendered by HTML.

Comment 1 Radar WebKit Bug Importer 2021-09-13 08:28:52 PDT

<rdar://problem/83056004>

Comment 2 Ahmad Saleem 2022-05-31 13:30:46 PDT

I am able to reproduce this bug in Safari 15.5 on macOS 12.4. It matches Chrome Canary 104. Although as per mentioned bug, Firefox Nightly 103 has desired behavior where left and right both have same colours.

Although the colours in Firefox Nightly are not affected by "gfx.color_management.mode" config, since I tried both 1 and 2 values as per "MDN Page".

It can be spec bug since Firefox do have colour management issues (at least as far my knowledge goes) so Safari and Chrome might have correct behaviour. Thanks!