Skip to content

feat: add eslint-plugin-jsx-a11y for accessibility linting (ASTD-198)#431

Open
marcusds wants to merge 1 commit into
mainfrom
astd-198-a11y-add-eslint-plugin/mschwab
Open

feat: add eslint-plugin-jsx-a11y for accessibility linting (ASTD-198)#431
marcusds wants to merge 1 commit into
mainfrom
astd-198-a11y-add-eslint-plugin/mschwab

Conversation

@marcusds

@marcusds marcusds commented Jun 24, 2026

Copy link
Copy Markdown
Contributor

Problem

No accessibility linting was in place for the Studio frontend, making it easy to introduce a11y issues.

Solution

Added eslint-plugin-jsx-a11y to the monorepo with per-package configs for studio and common.

Changes

  • pnpm-workspace.yaml: Added eslint-plugin-jsx-a11y to the catalog
  • packages/studio:
    • Added eslint-plugin-jsx-a11y as devDependency (catalog:)
    • Added eslint.config.a11y.js with all jsx-a11y rules at warn level
    • Added lint:a11y script (baseline: 73 warnings)
  • packages/common:
    • Added eslint-plugin-jsx-a11y as devDependency (catalog:)
    • Added eslint.config.a11y.js with all jsx-a11y rules at warn level
    • Added lint:a11y script (baseline: 18 warnings)

Usage

# Run a11y lint check
pnpm --filter nemo-studio-ui lint:a11y
pnpm --filter @nemo/common lint:a11y

Notes

  • Not yet included in the broader lint/check commands as existing warnings would cause those to fail
  • Warning baselines are captured; as issues are fixed, baselines should be lowered via the update-warning-count pattern

Summary by CodeRabbit

  • New Features

    • Added accessibility linting support for TypeScript and TSX files.
    • New lint:a11y script available in the web packages to run these checks.
  • Chores

    • Added the accessibility linting tool to the shared workspace setup and package dependencies.

- Add eslint-plugin-jsx-a11y to pnpm catalog
- Add per-package a11y ESLint configs (eslint.config.a11y.js) for studio and common
- Add lint:a11y npm script to both packages with warning baselines
  - studio: 73 warnings
  - common: 18 warnings
- All jsx-a11y rules run at warn level initially
@marcusds marcusds requested review from a team as code owners June 24, 2026 05:11
@github-actions github-actions Bot added the feat label Jun 24, 2026
@coderabbitai

coderabbitai Bot commented Jun 24, 2026

Copy link
Copy Markdown

Review Change Stack

📝 Walkthrough

Walkthrough

Adds eslint-plugin-jsx-a11y to the pnpm workspace catalog and creates eslint.config.a11y.js flat-config files in web/packages/common and web/packages/studio, enabling all jsx-a11y/* rules as warnings. Both packages get a lint:a11y script with package-specific --max-warnings thresholds.

Changes

Accessibility ESLint Setup

Layer / File(s) Summary
Workspace catalog entry
web/pnpm-workspace.yaml
Pins eslint-plugin-jsx-a11y at ^6.10.2 in the shared catalog.
ESLint flat-config files
web/packages/common/eslint.config.a11y.js, web/packages/studio/eslint.config.a11y.js
Each file targets **/*.{ts,tsx}, sets @typescript-eslint/parser with ES2022 module options, registers the jsx-a11y plugin, and enables all jsx-a11y/* rules at warn level.
Scripts and devDependencies
web/packages/common/package.json, web/packages/studio/package.json
Adds lint:a11y script (18-warning cap for common, 73 for studio) and eslint-plugin-jsx-a11y: catalog: to each package's devDependencies.
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly matches the main change: adding jsx-a11y for accessibility linting.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch astd-198-a11y-add-eslint-plugin/mschwab

Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@web/packages/common/package.json`:
- Line 13: The a11y ESLint config is importing globals without declaring it in
the package manifest. Update the common package’s package.json to add globals as
a dependency or devDependency, and make sure eslint.config.a11y.js can resolve
that import consistently. Keep the change scoped to the package that owns
lint:a11y.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Enterprise

Run ID: 71a2566a-5cfd-40a8-ba4d-7f665a2b303d

📥 Commits

Reviewing files that changed from the base of the PR and between d8ea9e2 and d3022f1.

⛔ Files ignored due to path filters (1)
  • web/pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (5)
  • web/packages/common/eslint.config.a11y.js
  • web/packages/common/package.json
  • web/packages/studio/eslint.config.a11y.js
  • web/packages/studio/package.json
  • web/pnpm-workspace.yaml

"format:fix": "prettier --write './**/*.{js,jsx,ts,tsx}'",
"lint": "eslint . --report-unused-disable-directives --max-warnings 0",
"lint:fix": "eslint . --fix --report-unused-disable-directives --max-warnings 0",
"lint:a11y": "eslint . --config eslint.config.a11y.js --no-config-lookup --no-inline-config --max-warnings 18",

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

📐 Maintainability & Code Quality | 🟠 Major

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
set -euo pipefail
jq -r '.scripts["test:ci"], .scripts["typecheck"]' web/packages/common/package.json

Repository: NVIDIA-NeMo/nemo-platform

Length of output: 198


🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "=== package.json relevant sections ==="
python3 - <<'PY'
import json
from pathlib import Path
p = Path('web/packages/common/package.json')
data = json.loads(p.read_text())
for key in ['scripts','dependencies','devDependencies','peerDependencies']:
    if key in data:
        print(f"\n[{key}]")
        for k,v in data[key].items():
            if k in ('test:ci','typecheck','globals','eslint-plugin-jsx-a11y','eslint'):
                print(f"{k}: {v}")
PY

echo
echo "=== eslint.config.a11y.js ==="
cat -n web/packages/common/eslint.config.a11y.js

Repository: NVIDIA-NeMo/nemo-platform

Length of output: 1324


🏁 Script executed:

#!/bin/bash
set -euo pipefail

python3 - <<'PY'
import json
from pathlib import Path
p = Path('web/packages/common/package.json')
data = json.loads(p.read_text())
print("scripts.test:ci =", data.get('scripts', {}).get('test:ci'))
print("scripts.typecheck =", data.get('scripts', {}).get('typecheck'))
for section in ('dependencies','devDependencies','peerDependencies'):
    deps = data.get(section, {})
    if 'globals' in deps:
        print(f"{section}.globals =", deps['globals'])
PY

echo
sed -n '1,120p' web/packages/common/eslint.config.a11y.js | cat -n

Repository: NVIDIA-NeMo/nemo-platform

Length of output: 1174


🏁 Script executed:

#!/bin/bash
set -euo pipefail

rg -n '"globals"|globals:' web/packages/common/package.json package.json pnpm-workspace.yaml .npmrc .github -g '!**/node_modules/**'

Repository: NVIDIA-NeMo/nemo-platform

Length of output: 323


🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "=== direct package references ==="
rg -n '"globals"|globals:' web/packages/common/package.json package.json pnpm-workspace.yaml .npmrc .github -g '!**/node_modules/**' || true

echo
echo "=== repository-wide globals mentions ==="
rg -n '\bglobals\b' web/packages/common -g '!**/node_modules/**' || true

Repository: NVIDIA-NeMo/nemo-platform

Length of output: 848


Add globals to web/packages/common/package.json
web/packages/common/eslint.config.a11y.js imports globals, but web/packages/common/package.json doesn’t declare it.

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@web/packages/common/package.json` at line 13, The a11y ESLint config is
importing globals without declaring it in the package manifest. Update the
common package’s package.json to add globals as a dependency or devDependency,
and make sure eslint.config.a11y.js can resolve that import consistently. Keep
the change scoped to the package that owns lint:a11y.

Source: Coding guidelines

@github-actions

Copy link
Copy Markdown
Contributor
Suite Lines Covered Line Rate Branch Rate
Unit Tests 20908/27478 76.1% 61.2%
Integration Tests 12109/26247 46.1% 19.5%

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant