Rule Change: Check CSS nesting syntax for baseline availability

[rviscomi]

Environment

Node version: v20.0.0
npm version: v9.6.4
Local ESLint version: v9.20.1 (Currently used)
Global ESLint version: Not found
Operating System: darwin 23.6.0

Which language are you using?

stylesheet

What did you do?

Configuration

import globals from "globals";
import css from "@eslint/css";


/** @type {import('eslint').Linter.Config[]} */
export default [
  {
    languageOptions: {
      globals: globals.browser
    }
  },
  {
    files: ["**/*.css"],
    plugins: {
      css,
    },
    language: "css/css",
    rules: {
      "css/require-baseline": ["warn", {
        "available": "widely"
      }],
    },
  },
];

input {
  /* styles for input not in a label  */
  border: tomato 2px solid;
}
label {
  /* styles for label */
  font-family: system-ui;
  font-size: 1.25rem;

  & input {
    /* styles for input in a label  */
    border: blue 2px dashed;
  }
}

What did you expect to happen?

The config is set to warn on any features that are not widely available. The input stylesheet uses CSS nesting, which is not yet widely available: https://webstatus.dev/features/nesting. I expected to see a warning for nesting.

What actually happened?

No warnings

Link to Minimal Reproducible Example

https://github.com/rviscomi/baseline-demos/blob/main/eslint/src/nesting.css

Participation

• I am willing to submit a pull request for this issue.

Additional comments

CSSTree has a NestingSelector type, which could be manually mapped to the corresponding BCD key css.selectors.nesting

[nzakas]

Marking as an enhancement as this wasn't originally part of the plan for the rule so technically it isn't a bug. This would make a nice addition, so happy to accept a PR.