Using the axe Linter Plugin with JetBrains IDEs
Information on using the plugin with IntelliJ IDEA Ultimate and WebStorm
The axe DevTools Linter plugin for JetBrains IDEs (only IntelliJ IDEA Ultimate and WebStorm on Linux, macOS, and Windows are currently supported) allows you to check your code for accessibility problems in the IDE. You can check React (JSX), React Native, Angular, Vue, HTML, and Markdown for common accessibility defects.
The Community Edition of IntelliJ IDEA is not supported because it does not support LSP (Language Server Protocol). Only IntelliJ IDEA Ultimate Edition or WebStorm supports LSP. LSP also requires version 2023.2 or later of IntelliJ IDEA Ultimate or WebStorm.
Overview of Its Use
The plugin highlights accessibility errors in the IDE with a red wavy line and provides a tooltip indicating the error. The tooltip includes a link to Deque University for more information about the specified accessibility error. The accessibility errors also appear in the Problems tool window in the IDE, as shown below in WebStorm:
Similarly, for IntelliJ, the following screenshot shows two accessibility errors (a misspelled value for the lang attribute and an empty heading element):
For more information on the accessibility checks the plugin performs, see Accessibility Rules.
Get Started
You can download the plugin from Deque's Agora repository using your Agora account.
You must have a Deque Agora account in order to download the plugin. For help, contact your Deque representative directly, reach us via our support desk, or send us an email.
The plugin is distributed as .jar file whose filename is in the format axe-devtools-linter-version.jar (where version is the version of the plugin).
You can install the plugin in your IDE by following the steps at Install plugin from disk.
Configuration
Configuring the plugin isn't necessary, but you might want to change its behavior by creating axe-linter.yml configuration files. For more information, see:
- Configuring axe DevTools Linter for a reference to axe DevTools Linter's configuration options
- Linting Custom Components with the axe Accessibility Linter for VS Code or JetBrains IDEs for information about configuring the plugin to lint custom components
Accessibility Rule Support
For more information about the rules that the plugin uses to locate accessibility errors, see Accessibility Rules.
Next Steps
This documentation site contains information about using the various axe DevTools Linter offerings. For more information, see About axe DevTools Linter.