Repository: eslint/css
Pull request #130 (2025-05-12 15:54:39)

feat: Update Baseline data
<!--
    Thank you for contributing!

    ESLint adheres to the [OpenJS Foundation Code of Conduct](https://eslint.org/conduct).
-->

#### Prerequisites checklist

- [x] I have read the [contributing guidelines](https://github.com/eslint/eslint/blob/HEAD/CONTRIBUTING.md).

<!--
    Please ensure your pull request is ready:

    - Read the pull request guide (https://eslint.org/docs/latest/contribute/pull-requests)
    - Update or create tests
    - If performance-related, include a benchmark
    - Update documentation for this change (if appropriate)
-->

<!--
    The following is required for all pull requests:
-->

#### What is the purpose of this pull request?

Update Baseline data

#### What changes did you make? (Give an overview)

- upgraded `mdn-data`, `compute-baseline`, and `web-features`
- updated `use-baseline` tests to pass using new data

#### Related Issues

<!-- include tags like "fixes #123" or "refs #123" -->

#### Is there anything you'd like reviewers to focus on?

<!-- markdownlint-disable-file MD004 -->



Patch:
diff --git a/README.md b/README.md
index 7f5ebc5..56ddad0 100644
--- a/README.md
+++ b/README.md
@@ -237,6 +237,28 @@ export default defineConfig([
 
 **Note:** The Tailwind syntax doesn't currently provide for the `theme()` function. This is a [limitation of CSSTree](https://github.com/csstree/csstree/issues/292) that we hope will be resolved soon.
 
+## Editor and IDE Setup
+
+### Visual Studio Code
+
+First, ensure you have the [ESLint plugin](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) installed.
+
+Then, edit `eslint.validate` in your `settings.json` file to include `css`:
+
+```json
+{
+	"eslint.validate": ["css"]
+}
+```
+
+### JetBrains WebStorm
+
+For any [JetBrains WebStorm](https://www.jetbrains.com/webstorm/), configure the [ESLint scope](https://www.jetbrains.com/help/webstorm/eslint.html#ws_eslint_configure_scope) to include `css`, such as:
+
+```text
+**/*.{js,ts,jsx,tsx,cjs,cts,mjs,mts,html,vue,css}
+```
+
 ## License
 
 Apache 2.0
diff --git a/package.json b/package.json
index 7ee4ccc..9771606 100644
--- a/package.json
+++ b/package.json
@@ -100,7 +100,7 @@
   "devDependencies": {
     "@eslint/json": "^0.5.0",
     "c8": "^9.1.0",
-    "compute-baseline": "^0.3.0",
+    "compute-baseline": "^0.3.1",
     "dedent": "^1.5.3",
     "eslint": "^9.24.0",
     "eslint-config-eslint": "^11.0.0",
@@ -108,14 +108,14 @@
     "got": "^14.4.2",
     "lint-staged": "^15.2.7",
     "mdast-util-from-markdown": "^2.0.2",
-    "mdn-data": "^2.17.0",
+    "mdn-data": "^2.21.0",
     "mocha": "^10.4.0",
     "prettier": "^3.4.1",
     "rollup": "^4.16.2",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-delete": "^3.0.1",
     "typescript": "^5.8.2",
-    "web-features": "^2.23.0",
+    "web-features": "^2.35.1",
     "yorkie": "^2.0.0"
   },
   "engines": {
diff --git a/src/data/baseline-data.js b/src/data/baseline-data.js
index e5cd49d..b044e89 100644
--- a/src/data/baseline-data.js
+++ b/src/data/baseline-data.js
@@ -282,12 +282,12 @@ export const properties = new Map([
 	["min-height", "10:2015"],
 	["min-width", "10:2015"],
 	["mix-blend-mode", "10:2020"],
-	["offset", "5:2022"],
+	["offset", "10:2022"],
 	["offset-anchor", "5:2023"],
-	["offset-distance", "5:2022"],
+	["offset-distance", "10:2022"],
 	["offset-path", "10:2022"],
 	["offset-position", "5:2024"],
-	["offset-rotate", "5:2022"],
+	["offset-rotate", "10:2022"],
 	["column-count", "10:2017"],
 	["column-gap", "10:2015"],
 	["column-rule", "10:2017"],
@@ -300,8 +300,8 @@ export const properties = new Map([
 	["object-position", "10:2020"],
 	["object-view-box", "0:"],
 	["opacity", "10:2015"],
-	["fill-opacity", "10:2020"],
-	["stroke-opacity", "10:2020"],
+	["fill-opacity", "10:2017"],
+	["stroke-opacity", "10:2017"],
 	["outline", "5:2023"],
 	["outline-color", "10:2015"],
 	["outline-offset", "10:2017"],
@@ -314,11 +314,11 @@ export const properties = new Map([
 	["overflow-y", "10:2015"],
 	["overflow-wrap", "10:2018"],
 	["overlay", "0:"],
-	["overscroll-behavior", "5:2022"],
-	["overscroll-behavior-block", "5:2022"],
-	["overscroll-behavior-inline", "5:2022"],
-	["overscroll-behavior-x", "5:2022"],
-	["overscroll-behavior-y", "5:2022"],
+	["overscroll-behavior", "10:2022"],
+	["overscroll-behavior-block", "10:2022"],
+	["overscroll-behavior-inline", "10:2022"],
+	["overscroll-behavior-x", "10:2022"],
+	["overscroll-behavior-y", "10:2022"],
 	["padding", "10:2015"],
 	["padding-bottom", "10:2015"],
 	["padding-left", "10:2015"],
@@ -342,7 +342,6 @@ export const properties = new Map([
 	["quotes", "10:2015"],
 	["reading-flow", "0:"],
 	["resize", "0:"],
-	["line-height-step", "0:"],
 	["ruby-align", "5:2024"],
 	["ruby-overhang", "0:"],
 	["ruby-position", "5:2024"],
@@ -360,6 +359,7 @@ export const properties = new Map([
 	["view-timeline-inset", "0:"],
 	["view-timeline-name", "0:"],
 	["scroll-initial-target", "0:"],
+	["scroll-marker-group", "0:"],
 	["scroll-margin", "10:2021"],
 	["scroll-margin-block", "10:2021"],
 	["scroll-margin-block-end", "10:2021"],
@@ -394,31 +394,31 @@ export const properties = new Map([
 	["speak", "0:"],
 	["speak-as", "0:"],
 	["clip-rule", "10:2020"],
-	["color-interpolation", "0:"],
+	["color-interpolation", "10:2020"],
 	["cx", "10:2020"],
 	["cy", "10:2020"],
 	["d", "0:"],
-	["fill", "10:2020"],
-	["fill-rule", "10:2020"],
-	["marker", "10:2020"],
-	["marker-end", "10:2020"],
-	["marker-mid", "10:2020"],
-	["marker-start", "10:2020"],
+	["fill", "10:2017"],
+	["fill-rule", "10:2017"],
+	["marker", "10:2017"],
+	["marker-end", "10:2017"],
+	["marker-mid", "10:2017"],
+	["marker-start", "10:2017"],
 	["r", "10:2020"],
 	["rx", "0:"],
 	["ry", "0:"],
 	["shape-rendering", "10:2020"],
-	["stop-color", "10:2020"],
-	["stop-opacity", "10:2020"],
-	["stroke", "10:2020"],
+	["stop-color", "10:2017"],
+	["stop-opacity", "10:2017"],
+	["stroke", "10:2017"],
 	["stroke-color", "0:"],
-	["stroke-dasharray", "10:2020"],
-	["stroke-dashoffset", "10:2020"],
-	["stroke-linecap", "10:2020"],
-	["stroke-linejoin", "10:2020"],
-	["stroke-miterlimit", "10:2020"],
-	["stroke-width", "10:2020"],
-	["text-anchor", "10:2020"],
+	["stroke-dasharray", "10:2017"],
+	["stroke-dashoffset", "10:2017"],
+	["stroke-linecap", "10:2017"],
+	["stroke-linejoin", "10:2017"],
+	["stroke-miterlimit", "10:2017"],
+	["stroke-width", "10:2017"],
+	["text-anchor", "10:2016"],
 	["text-rendering", "10:2020"],
 	["vector-effect", "10:2020"],
 	["x", "10:2020"],
@@ -434,7 +434,7 @@ export const properties = new Map([
 	["empty-cells", "10:2015"],
 	["table-layout", "10:2015"],
 	["text-align", "10:2015"],
-	["text-align-last", "5:2022"],
+	["text-align-last", "10:2022"],
 	["text-autospace", "0:"],
 	["text-box", "0:"],
 	["text-box-edge", "0:"],
@@ -517,7 +517,7 @@ export const atRules = new Map([
 	["page", "5:2024"],
 	["property", "5:2024"],
 	["scope", "0:"],
-	["starting-style", "0:"],
+	["starting-style", "5:2024"],
 	["supports", "10:2015"],
 ]);
 export const mediaConditions = new Map([
@@ -528,7 +528,7 @@ export const mediaConditions = new Map([
 	["device-width", "0:"],
 	["display-mode", "0:"],
 	["dynamic-range", "10:2022"],
-	["forced-colors", "5:2022"],
+	["forced-colors", "10:2022"],
 	["any-hover", "10:2018"],
 	["any-pointer", "10:2018"],
 	["hover", "10:2018"],
@@ -551,7 +551,7 @@ export const mediaConditions = new Map([
 	["prefers-reduced-data", "0:"],
 	["prefers-reduced-motion", "10:2020"],
 	["prefers-reduced-transparency", "0:"],
-	["resolution", "5:2022"],
+	["resolution", "10:2022"],
 	["-webkit-device-pixel-ratio", "10:2018"],
 	["-webkit-max-device-pixel-ratio", "10:2018"],
 	["-webkit-min-device-pixel-ratio", "10:2018"],
@@ -572,11 +572,12 @@ export const types = new Map([
 	["rect", "0:"],
 	["color", "5:2024"],
 	["color-mix", "5:2023"],
-	["conic-gradient", "5:2024"],
-	["repeating-conic-gradient", "5:2024"],
+	["conic-gradient", "5:2025"],
+	["repeating-conic-gradient", "5:2025"],
 	["counter", "10:2015"],
 	["counters", "10:2015"],
 	["cross-fade", "0:"],
+	["cubic-bezier", "10:2015"],
 	["var", "10:2017"],
 	["element", "0:"],
 	["exp", "5:2023"],
@@ -594,10 +595,10 @@ export const types = new Map([
 	["opacity", "10:2016"],
 	["saturate", "10:2016"],
 	["sepia", "10:2016"],
-	["linear-gradient", "10:2017"],
-	["radial-gradient", "10:2021"],
-	["repeating-linear-gradient", "10:2017"],
-	["repeating-radial-gradient", "10:2020"],
+	["linear-gradient", "5:2025"],
+	["radial-gradient", "5:2025"],
+	["repeating-linear-gradient", "5:2025"],
+	["repeating-radial-gradient", "5:2025"],
 	["image", "10:2015"],
 	["hsl", "5:2024"],
 	["hwb", "5:2024"],
@@ -622,6 +623,7 @@ export const types = new Map([
 	["ellipse", "10:2020"],
 	["polygon", "10:2020"],
 	["xywh", "0:"],
+	["steps", "10:2020"],
 	["matrix", "10:2015"],
 	["rotate", "10:2015"],
 	["scale", "10:2015"],
@@ -659,6 +661,9 @@ export const selectors = new Map([
 	["backdrop", "10:2022"],
 	["after", "10:2015"],
 	["before", "10:2015"],
+	["checkmark", "0:"],
+	["picker", "0:"],
+	["picker-icon", "0:"],
 	["default", "10:2020"],
 	["details-content", "0:"],
 	["dir", "5:2023"],
@@ -725,6 +730,8 @@ export const selectors = new Map([
 	["read-write", "10:2020"],
 	["root", "10:2015"],
 	["scope", "10:2020"],
+	["scroll-marker", "0:"],
+	["scroll-marker-group", "0:"],
 	["selection", "0:"],
 	["attribute", "10:2015"],
 	["child", "10:2015"],
@@ -1159,6 +1166,7 @@ export const propertyValues = new Map([
 			["searchfield", "10:2022"],
 			["textarea", "10:2022"],
 			["textfield", "10:2022"],
+			["base-select", "0:"],
 		]),
 	],
 	["aspect-ratio", new Map([["auto", "10:2021"]])],
@@ -1254,10 +1262,10 @@ export const propertyValues = new Map([
 	[
 		"border-image-repeat",
 		new Map([
-			["repeat", "10:2020"],
+			["repeat", "10:2016"],
 			["round", "10:2016"],
 			["space", "10:2017"],
-			["stretch", "10:2020"],
+			["stretch", "10:2016"],
 		]),
 	],
 	["border-image-width", new Map([["auto", "10:2015"]])],
@@ -1382,7 +1390,7 @@ export const propertyValues = new Map([
 			["content", "10:2022"],
 			["none", "10:2022"],
 			["strict", "10:2022"],
-			["inline-size", "5:2022"],
+			["inline-size", "10:2022"],
 			["layout", "10:2022"],
 			["paint", "10:2022"],
 			["size", "10:2022"],
@@ -1478,7 +1486,7 @@ export const propertyValues = new Map([
 			["ruby-text-container", "0:"],
 			["inline-table", "10:2015"],
 			["table", "10:2015"],
-			["table-caption", "10:2020"],
+			["table-caption", "10:2017"],
 			["table-cell", "10:2015"],
 			["table-column", "10:2015"],
 			["table-column-group", "10:2015"],
@@ -1517,9 +1525,9 @@ export const propertyValues = new Map([
 		new Map([
 			["auto", "10:2015"],
 			["content", "10:2022"],
-			["fit-content", "5:2022"],
-			["max-content", "5:2022"],
-			["min-content", "5:2022"],
+			["fit-content", "10:2022"],
+			["max-content", "10:2022"],
+			["min-content", "10:2022"],
 		]),
 	],
 	[
@@ -1805,7 +1813,7 @@ export const propertyValues = new Map([
 			["minmax", "10:2017"],
 			["none", "10:2020"],
 			["repeat", "10:2020"],
-			["animation", "5:2022"],
+			["animation", "10:2022"],
 			["masonry", "0:"],
 			["subgrid", "5:2023"],
 		]),
@@ -1820,7 +1828,7 @@ export const propertyValues = new Map([
 			["minmax", "10:2017"],
 			["none", "10:2020"],
 			["repeat", "10:2020"],
-			["animation", "5:2022"],
+			["animation", "10:2022"],
 			["masonry", "0:"],
 			["subgrid", "5:2023"],
 		]),
@@ -1938,7 +1946,7 @@ export const propertyValues = new Map([
 			["malayalam", "10:2020"],
 			["mongolian", "10:2020"],
 			["myanmar", "10:2020"],
-			["none", "10:2020"],
+			["none", "10:2015"],
 			["oriya", "10:2020"],
 			["persian", "10:2020"],
 			["simp-chinese-formal", "10:2021"],
@@ -2056,7 +2064,7 @@ export const propertyValues = new Map([
 			["margin-box", "0:"],
 			["none", "5:2024"],
 			["padding-box", "5:2024"],
-			["path", "5:2022"],
+			["path", "10:2022"],
 			["ray", "5:2024"],
 			["stroke-box", "5:2024"],
 			["url", "5:2024"],
@@ -2078,8 +2086,8 @@ export const propertyValues = new Map([
 	[
 		"offset-rotate",
 		new Map([
-			["auto", "5:2022"],
-			["reverse", "5:2022"],
+			["auto", "10:2022"],
+			["reverse", "10:2022"],
 		]),
 	],
 	["column-count", new Map([["auto", "10:2017"]])],
@@ -2118,19 +2126,11 @@ export const propertyValues = new Map([
 			["none", "0:"],
 		]),
 	],
-	[
-		"overflow-clip-margin",
-		new Map([
-			["border-box", "0:"],
-			["content-box", "0:"],
-			["padding-box", "0:"],
-		]),
-	],
 	[
 		"overflow-x",
 		new Map([
+			["clip", "10:2022"],
 			["auto", "10:2015"],
-			["clip", "5:2022"],
 			["hidden", "10:2015"],
 			["scroll", "10:2015"],
 			["visible", "10:2015"],
@@ -2139,8 +2139,8 @@ export const propertyValues = new Map([
 	[
 		"overflow-y",
 		new Map([
+			["clip", "10:2022"],
 			["auto", "10:2015"],
-			["clip", "5:2022"],
 			["hidden", "10:2015"],
 			["scroll", "10:2015"],
 			["visible", "10:2015"],
@@ -2149,13 +2149,21 @@ export const propertyValues = new Map([
 	[
 		"overflow",
 		new Map([
+			["clip", "10:2022"],
 			["auto", "10:2015"],
-			["clip", "5:2022"],
 			["hidden", "10:2015"],
 			["scroll", "10:2015"],
 			["visible", "10:2015"],
 		]),
 	],
+	[
+		"overflow-clip-margin",
+		new Map([
+			["border-box", "0:"],
+			["content-box", "0:"],
+			["padding-box", "0:"],
+		]),
+	],
 	[
 		"overflow-wrap",
 		new Map([
@@ -2174,41 +2182,41 @@ export const propertyValues = new Map([
 	[
 		"overscroll-behavior-block",
 		new Map([
-			["auto", "5:2022"],
-			["contain", "5:2022"],
-			["none", "5:2022"],
+			["auto", "10:2022"],
+			["contain", "10:2022"],
+			["none", "10:2022"],
 		]),
 	],
 	[
 		"overscroll-behavior-inline",
 		new Map([
-			["auto", "5:2022"],
-			["contain", "5:2022"],
-			["none", "5:2022"],
+			["auto", "10:2022"],
+			["contain", "10:2022"],
+			["none", "10:2022"],
 		]),
 	],
 	[
 		"overscroll-behavior-x",
 		new Map([
-			["auto", "5:2022"],
-			["contain", "5:2022"],
-			["none", "5:2022"],
+			["auto", "10:2022"],
+			["contain", "10:2022"],
+			["none", "10:2022"],
 		]),
 	],
 	[
 		"overscroll-behavior-y",
 		new Map([
-			["auto", "5:2022"],
-			["contain", "5:2022"],
-			["none", "5:2022"],
+			["auto", "10:2022"],
+			["contain", "10:2022"],
+			["none", "10:2022"],
 		]),
 	],
 	[
 		"overscroll-behavior",
 		new Map([
-			["auto", "5:2022"],
-			["contain", "5:2022"],
-			["none", "5:2022"],
+			["auto", "10:2022"],
+			["contain", "10:2022"],
+			["none", "10:2022"],
 		]),
 	],
 	[
@@ -2333,6 +2341,14 @@ export const propertyValues = new Map([
 			["none", "0:"],
 		]),
 	],
+	[
+		"scroll-marker-group",
+		new Map([
+			["after", "0:"],
+			["before", "0:"],
+			["none", "0:"],
+		]),
+	],
 	["scroll-padding-block-end", new Map([["auto", "10:2021"]])],
 	["scroll-padding-block-start", new Map([["auto", "10:2021"]])],
 	["scroll-padding-block", new Map([["auto", "10:2021"]])],
@@ -2417,31 +2433,31 @@ export const propertyValues = new Map([
 		"color-interpolation",
 		new Map([
 			["linearGradient", "0:"],
-			["sRGB", "0:"],
+			["sRGB", "10:2020"],
 		]),
 	],
 	[
 		"fill-rule",
 		new Map([
-			["evenodd", "10:2020"],
-			["nonzero", "10:2020"],
+			["evenodd", "10:2017"],
+			["nonzero", "10:2017"],
 		]),
 	],
-	["stroke-dasharray", new Map([["none", "10:2020"]])],
+	["stroke-dasharray", new Map([["none", "10:2017"]])],
 	[
 		"stroke-linecap",
 		new Map([
-			["butt", "10:2020"],
-			["round", "10:2020"],
-			["square", "10:2020"],
+			["butt", "10:2017"],
+			["round", "10:2017"],
+			["square", "10:2017"],
 		]),
 	],
 	[
 		"stroke-linejoin",
 		new Map([
-			["bevel", "10:2020"],
-			["miter", "10:2020"],
-			["round", "10:2020"],
+			["bevel", "10:2017"],
+			["miter", "10:2017"],
+			["round", "10:2017"],
 		]),
 	],
 	[
@@ -2488,7 +2504,7 @@ export const propertyValues = new Map([
 			["start", "10:2020"],
 		]),
 	],
-	["text-align-last", new Map([["auto", "5:2022"]])],
+	["text-align-last", new Map([["auto", "10:2022"]])],
 	[
 		"text-autospace",
 		new Map([
@@ -2678,11 +2694,11 @@ export const propertyValues = new Map([
 	[
 		"transform-origin",
 		new Map([
-			["bottom", "10:2020"],
-			["center", "10:2020"],
-			["left", "10:2020"],
-			["right", "10:2020"],
-			["top", "10:2020"],
+			["bottom", "10:2015"],
+			["center", "10:2015"],
+			["left", "10:2015"],
+			["right", "10:2015"],
+			["top", "10:2015"],
 		]),
 	],
 	[
@@ -2782,8 +2798,8 @@ export const propertyValues = new Map([
 		"writing-mode",
 		new Map([
 			["horizontal-tb", "10:2017"],
-			["sideways-lr", "0:"],
-			["sideways-rl", "0:"],
+			["sideways-lr", "5:2025"],
+			["sideways-rl", "5:2025"],
 			["vertical-lr", "10:2017"],
 			["vertical-rl", "10:2017"],
 			["lr", "0:"],
diff --git a/src/rules/no-invalid-at-rules.js b/src/rules/no-invalid-at-rules.js
index c2c0204..adcf514 100644
--- a/src/rules/no-invalid-at-rules.js
+++ b/src/rules/no-invalid-at-rules.js
@@ -121,6 +121,11 @@ export default {
 			},
 
 			"AtRule > Block > Declaration"(node) {
+				// skip custom descriptors
+				if (node.property.startsWith("--")) {
+					return;
+				}
+
 				// get at rule node
 				const atRule = /** @type {AtrulePlain} */ (
 					sourceCode.getParent(sourceCode.getParent(node))


Test patch:
diff --git a/tests/rules/no-invalid-at-rules.test.js b/tests/rules/no-invalid-at-rules.test.js
index 151261c..4da4b6b 100644
--- a/tests/rules/no-invalid-at-rules.test.js
+++ b/tests/rules/no-invalid-at-rules.test.js
@@ -67,6 +67,19 @@ ruleTester.run("no-invalid-at-rules", rule, {
 				customSyntax: tailwindSyntax,
 			},
 		},
+		{
+			code: `@custom-rule {
+				--foo: red;
+				--bar: blue;
+			}`,
+			languageOptions: {
+				customSyntax: {
+					atrules: {
+						"custom-rule": {},
+					},
+				},
+			},
+		},
 	],
 	invalid: [
 		{