codelyzer icon indicating copy to clipboard operation
codelyzer copied to clipboard

[feature request]: Allow aria-label to suppress template-accessibility-elements-content violation

Open abzats opened this issue 4 years ago • 1 comments

Describe the bug

I'm facing an issue when I don't want to set explicit text content for a button element but I want to use aria-label for assistive technologies instead. In my current situation, I have a directive that adds icons to the button but without text.

Would it be possible for template-accessibility-elements-content to consider aria-label to be an acceptable alternative (either by default or as a rule option)?

Context and configuration

Please share:

  • Which rule is causing the problem template-accessibility-elements-content
  • What's the content of your tsconfig.json
{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "baseUrl": "src",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "importHelpers": true,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "target": "ES2015",
    "module": "ESNext",
    "typeRoots": ["node_modules/@types"],
    "lib": ["ES2018", "DOM"]
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true,
    "enableIvy": true
  }
}
  • What's the content of ~/.codelyzer.js (if applicable) I do not have it.

Expected behavior

<button class="btn-close" aria-label="close></button> should NOT produce an error.

Additional context

I believe a similar question about "aria-label" support might be raised to all others template-accessibility-* rules.

abzats avatar Jan 13 '21 14:01 abzats

@abzats I'm afraid we can't support this in Codelyzer as TSLint is out, you could open this in https://github.com/angular-eslint/angular-eslint/issues instead.

rafaelss95 avatar Jan 14 '21 20:01 rafaelss95