Bug 262429 - REGRESSION (Safari 17): Incorrect color management in WebGL, out of gamut display
Summary: REGRESSION (Safari 17): Incorrect color management in WebGL, out of gamut dis...
Status: RESOLVED MOVED
Alias: None
Product: WebKit
Classification: Unclassified
Component: WebGL (show other bugs)
Version: Safari 17
Hardware: Mac (Apple Silicon) macOS 14
: P2 Major
Assignee: Nobody
URL:
Keywords: BrowserCompat, InRadar, Regression
Depends on:
Blocks:
 
Reported: 2023-09-29 21:18 PDT by Don McCurdy
Modified: 2024-04-02 01:08 PDT (History)
9 users (show)

See Also:


Attachments
rendering in Safari, firefox, chrome (504.11 KB, image/png)
2023-10-01 22:10 PDT, Karl Dubost
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Don McCurdy 2023-09-29 21:18:49 PDT
I'm a contributor to the three.js library, and users have begun reporting color differences in WebGL content in Safari vs. other browsers, beginning with Safari 17 on macOS Sonoma. 

Steps to reproduce:

1. Open https://threejs.org/examples/webgl_test_wide_gamut.html in Chrome, Firefox, and Safari. Use "Digital Color Meter" set to "Display in P3", with a display that supports "Display P3".
  a. In Chrome, left side should be #EA3323 in Display P3, right side should be #FF0000 in Display P3.
  b. In Firefox, which does not support Display P3 in WebGL, both sides should be #EA3323 in Display P3.
  c. In Safari, both sides show #FF0000 in Display P3. The left side should not.

This is an intentionally self-contained three.js example, and requires three.js r157 (which added support for Display P3). The demo appeared the same way in Safari and Chrome, before I updated to macOS Sonoma.

Tested in:

- Safari, Stable: Version 17.0 (19616.1.27.211.1)
- Safari, Technical Preview: Release 179 (Safari 17.0, WebKit 19617.1.8.1)
- Webkit build 268687@main
Comment 1 Don McCurdy 2023-09-30 10:05:40 PDT
While this example uses the (relatively new) Display P3 support, the problem isn't limited to that. Load many older three.js exmaples with the color meter set to "Display in sRGB" and you'll see clipped values for many pixels, which should be within the sRGB gamut. Example:

https://threejs.org/examples/#webgl_animation_keyframes
Comment 2 Radar WebKit Bug Importer 2023-09-30 13:08:52 PDT
<rdar://problem/116288987>
Comment 3 Karl Dubost 2023-10-01 22:10:39 PDT
Created attachment 468017 [details]
rendering in Safari, firefox, chrome

Confirmed.
Differences are visible only on a P3 display screen.
Comment 4 Brent Fulgham 2023-12-21 15:12:27 PST
The fix for this issue needs to be made outside of the WebKit Open Source project. Resolving as MOVED.
Comment 5 Don McCurdy 2024-04-01 14:52:13 PDT
Is there any place for me (and other https://threejs.org maintainers) to continue receiving updates on the issue?
Comment 6 Karl Dubost 2024-04-01 16:44:41 PDT
Hi Don, I just checked and it still reproduces. A fix has been done with regards to this, but which doesn't solve this specific test case.
The bug is still not in WebKit, so I will not reopen yet. 

But there's a new radar for reference.
Comment 7 Karl Dubost 2024-04-01 16:44:52 PDT
<rdar://125745341>
Comment 8 Kimmo Kinnunen 2024-04-02 01:00:10 PDT
Let's track the remaining issue in bug 272015