Skip to content

template-click-events-have-key-events throws error on anchor <a> element #996

@fikkatra

Description

@fikkatra

Describe the bug

The rule should exclude interactive elements. Buttons are indeed excluded, however, anchor tags with click events (without key events) still cause a lint error:

<a (click)="handleClick()">My link</a>

click must be accompanied by either keyup, keydown or keypress event for accessibility

Context and configuration
rule: template-click-events-have-key-events
tsconfig.json:

{
  "extends": "../../tsconfig.base.json",
  "compilerOptions": {
    "types": ["jasmine"]
  },
  "include": [],
  "files": [],
  "references": [
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.spec.json"
    }
  ]
}

tsconfig.base.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "downlevelIteration": true,
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es2015",
    "module": "esnext",
    "typeRoots": ["node_modules/@types"],
    "lib": ["es2017", "dom"],
    "baseUrl": ".",
    "paths": {
      "core-js/es7/reflect": ["node_modules/core-js/proposals/reflect-metadata"]
    },
    "rootDir": "."
  },
  "exclude": ["node_modules", "tmp"]
}

no codelyzer.js

Expected behavior

The rule should pass for anchor tags with click events, even if they don't have a key event.

Environment

  • Version 6.0.1
  • OS: Mac OS
  • Node.js version 12.18.3
  • npm version 6.14.6
  • Angular version 10.0.5
  • tslint version 6.1.2

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions