function-no-unknown: fix linear xywh light-dark false positives

[Mouvedia]

What minimal example or steps are needed to reproduce the bug?

:root {
  color-scheme: light dark;

  --text-color: light-dark(#777, #000);
}

What minimal configuration is needed to reproduce the bug?

{
  "rules": {
    "function-no-unknown": true
  }
}

How did you run Stylelint?

https://stylelint.io/demo

See also

https://drafts.csswg.org/css-color-5/#light-dark
mdn/browser-compat-data#20935

Do you have a proposal to fix the bug?

1. either update https://github.com/niksy/css-functions-list/blob/master/index.json
2. or add an exception

[ybiquitous]

@Mouvedia Good catch. I think sending a PR to css-functions-list is better.

[niksy]

Since this is currently in draft stage and it’s not documented on MDN, css-functions-list doesn’t include it. I could probably add mdn/browser-compat-data as new data source, but light-dark will eventually be documented on MDN.

[ybiquitous]

@Mouvedia @niksy Thanks for addressing this issue.

Until a reflection to mdn/browser-compat-data and a new version of css-functions-list is published, we can just add an exception to the functionsList below:

stylelint/lib/rules/function-no-unknown/index.js

Lines 51 to 58 in 2a1fc6d

	const functionsList = [
	...JSON.parse(fs.readFileSync(functionsListPath.toString(), 'utf8')),
	// #5960
	'-webkit-gradient',
	'color-stop',
	'from',
	'to',
	];

[niksy]

After additional consideration, I’ve decided to add those functions. -webkit-gradient is added manually, and light-dark is now pulled from mdn/browser-compat-data.

If you’re familiar with additional resources, I can add them so we don’t have to add exceptions manually.

Available in https://github.com/niksy/css-functions-list/releases/tag/v3.2.1

[Mouvedia]

• update css-function-list dependency to 3.2.1
  which also adds 2 missing functions: linear and xywh
• remove this line and only this line
  i.e. the inner functions color-stop, from, to are still not included
• add changeset

Thanks @niksy

[niksy]

OK, will try to manually add those 3 also, so Stylelint doesn’t need to have special cases.

Can you give me more information on to and from functions? Is there any (legacy) spec mentioning them?

[Mouvedia]

OK, will try to manually add those 3 also, so Stylelint doesn’t need to have special cases.

IMHO you can wait; a commit will do.
i.e. it doesn't warrant a new version unless it adds experimental functions like 3.2.1 did

Can you give me more information on to and from functions?

see #5960 (comment)

Is there any (legacy) spec mentioning them?

Not really but adding -webkit-gradient without them is incomplete/absurd from an user perspective but it's not a big deal for Stylelint because we already have them listed as exceptions.
ref https://developer.apple.com/library/archive/documentation/InternetWeb/Conceptual/SafariVisualEffectsProgGuide/Gradients/Gradient.html#//apple_ref/doc/uid/TP40008032-CH10-SW34