From 0052e6cab94ef13113747bb5be7108a03c899b79 Mon Sep 17 00:00:00 2001 From: Even Stensberg Date: Sat, 26 Oct 2024 20:57:54 +0200 Subject: [PATCH 1/2] chore(root): add eslint a11y plugin --- .eslintrc.cjs | 19 ++++++++++++++++--- package-lock.json | 36 ++++++++++++++++++++++++++++++++++++ package.json | 1 + 3 files changed, 53 insertions(+), 3 deletions(-) diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 6607a1c5530..b00a284f2eb 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -16,14 +16,15 @@ const config = { __OPENMCT_REVISION__: 'readonly', __OPENMCT_BUILD_BRANCH__: 'readonly' }, - plugins: ['prettier', 'unicorn', 'simple-import-sort'], + plugins: ['prettier', 'unicorn', 'simple-import-sort', 'vuejs-accessibility'], extends: [ 'eslint:recommended', 'plugin:compat/recommended', 'plugin:vue/vue3-recommended', 'plugin:you-dont-need-lodash-underscore/compatible', 'plugin:prettier/recommended', - 'plugin:no-unsanitized/DOM' + 'plugin:no-unsanitized/DOM', + 'plugin:vuejs-accessibility/recommended' ], parser: 'vue-eslint-parser', parserOptions: { @@ -167,7 +168,19 @@ const config = { 'vue/first-attribute-linebreak': 'error', 'vue/multiline-html-element-content-newline': 'off', 'vue/singleline-html-element-content-newline': 'off', - 'vue/no-mutating-props': 'off' // TODO: Remove this rule and fix resulting errors + 'vue/no-mutating-props': 'off', // TODO: Remove this rule and fix resulting errors + // TODO: A11y rules -> fix step by step + 'vuejs-accessibility/no-static-element-interactions': 'off', + 'vuejs-accessibility/click-events-have-key-events': 'off', + 'vuejs-accessibility/interactive-supports-focus': 'off', + 'vuejs-accessibility/label-has-for': 'off', + 'vuejs-accessibility/mouse-events-have-key-events': 'off', + 'vuejs-accessibility/role-has-required-aria-props': 'off', + 'vuejs-accessibility/anchor-has-content': 'off', + 'vuejs-accessibility/iframe-has-title': 'off', + 'vuejs-accessibility/form-control-has-label': 'off', + 'vuejs-accessibility/alt-text': 'off', + 'vuejs-accessibility/aria-props': 'off' }, overrides: [ { diff --git a/package-lock.json b/package-lock.json index 7dc0829bb93..3787469f140 100644 --- a/package-lock.json +++ b/package-lock.json @@ -41,6 +41,7 @@ "eslint-plugin-simple-import-sort": "10.0.0", "eslint-plugin-unicorn": "49.0.0", "eslint-plugin-vue": "9.22.0", + "eslint-plugin-vuejs-accessibility": "^2.4.1", "eslint-plugin-you-dont-need-lodash-underscore": "6.13.0", "eventemitter3": "5.0.1", "file-saver": "2.0.5", @@ -2434,6 +2435,16 @@ "sprintf-js": "~1.0.2" } }, + "node_modules/aria-query": { + "version": "5.3.2", + "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.2.tgz", + "integrity": "sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">= 0.4" + } + }, "node_modules/array-flatten": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz", @@ -4903,6 +4914,31 @@ "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", "dev": true }, + "node_modules/eslint-plugin-vuejs-accessibility": { + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/eslint-plugin-vuejs-accessibility/-/eslint-plugin-vuejs-accessibility-2.4.1.tgz", + "integrity": "sha512-ZRZhPdslplZXSF71MtSG+zXYRAT5KiHR4JVuo/DERQf9noAkDvi5W418VOE1qllmJd7wTenndxi1q8XeDMxdHw==", + "dev": true, + "license": "MIT", + "dependencies": { + "aria-query": "^5.3.0", + "emoji-regex": "^10.0.0", + "vue-eslint-parser": "^9.0.1" + }, + "engines": { + "node": ">=16.0.0" + }, + "peerDependencies": { + "eslint": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0" + } + }, + "node_modules/eslint-plugin-vuejs-accessibility/node_modules/emoji-regex": { + "version": "10.4.0", + "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.4.0.tgz", + "integrity": "sha512-EC+0oUMY1Rqm4O6LLrgjtYDvcVYTy7chDnM4Q7030tP4Kwj3u/pR6gP9ygnp2CJMK5Gq+9Q2oqmrFJAz01DXjw==", + "dev": true, + "license": "MIT" + }, "node_modules/eslint-plugin-you-dont-need-lodash-underscore": { "version": "6.13.0", "resolved": "https://registry.npmjs.org/eslint-plugin-you-dont-need-lodash-underscore/-/eslint-plugin-you-dont-need-lodash-underscore-6.13.0.tgz", diff --git a/package.json b/package.json index 6e96eace12c..be590eaa52f 100644 --- a/package.json +++ b/package.json @@ -44,6 +44,7 @@ "eslint-plugin-simple-import-sort": "10.0.0", "eslint-plugin-unicorn": "49.0.0", "eslint-plugin-vue": "9.22.0", + "eslint-plugin-vuejs-accessibility": "^2.4.1", "eslint-plugin-you-dont-need-lodash-underscore": "6.13.0", "eventemitter3": "5.0.1", "file-saver": "2.0.5", From 60e38aa5248052e8343cdf915b481cca4d5da28c Mon Sep 17 00:00:00 2001 From: Even Stensberg Date: Thu, 7 Nov 2024 20:23:33 +0100 Subject: [PATCH 2/2] chore: comment bad rule --- .eslintrc.cjs | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.eslintrc.cjs b/.eslintrc.cjs index b00a284f2eb..fec2c92902b 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -170,9 +170,10 @@ const config = { 'vue/singleline-html-element-content-newline': 'off', 'vue/no-mutating-props': 'off', // TODO: Remove this rule and fix resulting errors // TODO: A11y rules -> fix step by step - 'vuejs-accessibility/no-static-element-interactions': 'off', + 'vuejs-accessibility/no-static-element-interactions': 'warn', 'vuejs-accessibility/click-events-have-key-events': 'off', 'vuejs-accessibility/interactive-supports-focus': 'off', + // Bug in the eslint rule when using :for and :id instead of static classes 'vuejs-accessibility/label-has-for': 'off', 'vuejs-accessibility/mouse-events-have-key-events': 'off', 'vuejs-accessibility/role-has-required-aria-props': 'off',