Skip to content

chore(eslint): integrate eslint-plugin-vuejs-accessibility#2648

Open
martijndewit wants to merge 1 commit into
unovue:v2from
martijndewit:feat/eslint-plugin-vuejs-accessibility
Open

chore(eslint): integrate eslint-plugin-vuejs-accessibility#2648
martijndewit wants to merge 1 commit into
unovue:v2from
martijndewit:feat/eslint-plugin-vuejs-accessibility

Conversation

@martijndewit
Copy link
Copy Markdown

@martijndewit martijndewit commented May 18, 2026

🔗 Linked issue

Refs #2634

❓ Type of change

🧹 Chore (updates to the build process or auxiliary tools and libraries)

📚 Description

  • Adds eslint-plugin-vuejs-accessibility flat/recommended preset (20 rules)
  • scoped to packages/core/src/**/*.vue. Rules are registered at warn
  • severity so existing violations can be fixed incrementally without
  • breaking CI; flip to error once the codebase is clean.

📝 Checklist

  • [x ] I have linked an issue or discussion.
  • I have updated the documentation accordingly. ( don't know if that is needed for this one.)
  • Follow up tickets should be created to fix all lint warings.

Summary by CodeRabbit

  • Chores
    • Added accessibility linting for Vue components to validate compliance with accessibility standards and best practices automatically.

Review Change Stack

- Adds eslint-plugin-vuejs-accessibility flat/recommended preset (20 rules)
- scoped to packages/core/src/**/*.vue. Rules are registered at `warn`
- severity so existing violations can be fixed incrementally without
- breaking CI; flip to `error` once the codebase is clean.

Refs unovue#2634
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 18, 2026

📝 Walkthrough

Walkthrough

This PR adds Vue accessibility linting to the project by introducing eslint-plugin-vuejs-accessibility. The plugin is installed as a dev dependency and configured in the ESLint config to enforce recommended accessibility rules at warn level for Vue components in packages/core/src.

Changes

Vue Accessibility Linting

Layer / File(s) Summary
Add eslint-plugin-vuejs-accessibility setup
package.json, eslint.config.mjs
Added eslint-plugin-vuejs-accessibility@^2.5.0 to devDependencies. Imported the plugin in ESLint config and registered a new config block targeting packages/core/src/**/*.vue with all recommended accessibility rules enabled at warn level.

Possibly related issues

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~5 minutes

Poem

🐰 A lively hop through Vue's domain,
Where rabbits check for a11y pain,
With plugins warn in flattest style,
Our components now pass the trial! 🎉

🚥 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 'chore(eslint): integrate eslint-plugin-vuejs-accessibility' accurately and concisely describes the main change: adding the eslint-plugin-vuejs-accessibility plugin to the ESLint configuration.
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 unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

🧹 Nitpick comments (1)
eslint.config.mjs (1)

61-63: ⚡ Quick win

Avoid hard-coding preset index when reading plugin rules.

Using ['flat/recommended'][1] assumes a stable internal array layout. The plugin's configuration structure is an internal implementation detail; indexing into a specific position is not documented as a stable or supported practice and will break if the plugin maintainers reshape the configuration in future releases.

The suggested refactor using flatMap to collect rules from all preset entries is the correct approach to make the configuration resilient to plugin changes.

Suggested change
-    rules: Object.fromEntries(
-      Object.keys(pluginVueA11y.configs['flat/recommended'][1].rules)
-        .map(rule => [rule, 'warn']),
-    ),
+    rules: Object.fromEntries(
+      pluginVueA11y.configs['flat/recommended']
+        .flatMap(config => Object.keys(config.rules ?? {}))
+        .map(rule => [rule, 'warn']),
+    ),
🤖 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 `@eslint.config.mjs` around lines 61 - 63, The current rule mapping hard-codes
an index into pluginVueA11y.configs['flat/recommended'][1], which is fragile;
change the logic that builds rules (the Object.fromEntries call that references
pluginVueA11y.configs['flat/recommended']) to iterate over all entries/presets
and collect their .rules objects (e.g., via flatMap over Object.values or
Object.entries) and then map each rule name to 'warn', so the final
Object.fromEntries consumes the flattened list of [ruleName, 'warn'] pairs
instead of relying on a single index.
🤖 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.

Nitpick comments:
In `@eslint.config.mjs`:
- Around line 61-63: The current rule mapping hard-codes an index into
pluginVueA11y.configs['flat/recommended'][1], which is fragile; change the logic
that builds rules (the Object.fromEntries call that references
pluginVueA11y.configs['flat/recommended']) to iterate over all entries/presets
and collect their .rules objects (e.g., via flatMap over Object.values or
Object.entries) and then map each rule name to 'warn', so the final
Object.fromEntries consumes the flattened list of [ruleName, 'warn'] pairs
instead of relying on a single index.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: de83d0b9-0aab-4aad-85e1-951adb1fbe03

📥 Commits

Reviewing files that changed from the base of the PR and between d2b2519 and c75b86e.

⛔ Files ignored due to path filters (1)
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (2)
  • eslint.config.mjs
  • package.json

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant