light-dark() CSS function supported by Opera 109, Edge 123 and Safari 17.5 (Beta)

[legendofmi]

MDN URL

https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/light-dark

What specific section or headline is this issue about?

Browser support for light-dark() function

What information was incorrect, unhelpful, or incomplete?

Browser support is incorrect. The page says light-dark is not supported by Opera 109, Edge 123, and Safari 17.5 (beta) when all support it (support added on Chromium 123).

What did you expect to see?

light-dark() should show as supported by Opera, Edge, and Safari (beta).

Do you have any supporting links, references, or citations?

I tested the MDN page on Opera 109 and Edge 123 and both work. I couldn’t test on Safari 17.5 beta, but the support is mentioned on their release notes:
https://developer.apple.com/documentation/safari-release-notes/safari-17_5-release-notes

Opera 109:

109.0.5097.38 – 2024-04-02 blog post

• CHR-9695 Update Chromium on desktop-stable-123-5097 to 123.0.6312.87

Edge 123:

Safari 17.5 (Beta):
I didn’t test it, but it’s on the release notes:
https://developer.apple.com/documentation/safari-release-notes/safari-17_5-release-notes

Do you have anything more you want to share?

No response

[bsmth]

Thanks for raising this. I've moved it into the BCD repo which is the right place to track this data.

This was introduced here:

• Add light-dark() #20935

And updated here:

• Update light-dark() support #22128

I think the fix might be to remove the impl_url although there might be a display improvement with Opera and Edge mirroring true support when there's a version (support=true) in Chrome.

Compat table: https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/light-dark#browser_compatibility

[legendofmi]

Thanks! I just realised it’s also supported by Safari 17.5 Beta. I updated the title and the description.

[bsmth]

I think the fix might be to remove the impl_url

This is not the case, the data from mirrored browsers is not updated yet. Here's the light-dark entry:

browser-compat-data/css/types/color.json

Lines 801 to 839 in ba6f18f

	"light-dark": {
	"__compat": {
	"description": "<code>light-dark()</code>",
	"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/color_value/light-dark",
	"spec_url": "https://drafts.csswg.org/css-color-5/#light-dark",
	"tags": [
	"web-features:light-dark"
	],
	"support": {
	"chrome": {
	"version_added": "123",
	"impl_url": "https://crbug.com/1490618"
	},
	"chrome_android": "mirror",
	"edge": "mirror",
	"firefox": {
	"version_added": "120"
	},
	"firefox_android": "mirror",
	"ie": {
	"version_added": false
	},
	"oculus": "mirror",
	"opera": "mirror",
	"opera_android": "mirror",
	"safari": {
	"version_added": "preview"
	},
	"safari_ios": "mirror",
	"samsunginternet_android": "mirror",
	"webview_android": "mirror"
	},
	"status": {
	"experimental": false,
	"standard_track": true,
	"deprecated": false
	}
	}
	},

And even though this was added in 109, Opera (desktop) versions in this repo are listed up to 108:
https://github.com/mdn/browser-compat-data/blob/main/browsers/opera.json#L816

[legendofmi]

What about Safari? 17.5 seems to be already there. Is it just missing "version_added" for the light-dark entry?

[Elchi3]

Safari 17.5 data is being updated in this PR: #22765

[legendofmi]

Safari 17.5 and Edge 123 are now showing as supported. The only one missing is Opera 109, but the browser was already added to the list (updated today):
https://github.com/mdn/browser-compat-data/blob/main/browsers/opera.json#L816

I will check again tomorrow and close the ticket if it shows as supported.

Update: MDN page is still showing light-dark() CSS function as not supported on Opera 109.

[legendofmi]

MDN is now showing correctly the light-dark support.