Sobre o Axe DevTools Linter
Visão geral do Axe DevTools Linter e deste site de documentação
O Que é Linting?
Linting é o processo automatizado de analisar o código-fonte para encontrar problemas antes de executá-lo. Um linter é uma ferramenta que lê o seu código e sinaliza problemas, que vão desde erros de sintaxe e digitação até inconsistências estilísticas e possíveis falhas.
O termo vem de uma ferramenta Unix chamada lint, que originalmente verificava programas C em busca de construções suspeitas. Hoje, linters existem para praticamente todas as linguagens de programação e servem como uma primeira linha de defesa na qualidade do código.
Pense em um linter como um verificador ortográfico para código, exceto que, em vez de apenas detectar erros de digitação, ele também detecta erros lógicos, impõe regras de estilo e o alerta sobre padrões que podem causar falhas.
O Que é um Linter de Acessibilidade?
Um linter de acessibilidade verifica práticas de acessibilidade potencialmente ruins, fornecendo feedback enquanto você desenvolve, em vez de depois que seu site ou aplicativo está construído e funcionando.
O Que o Axe DevTools Linter Faz
O Axe DevTools Linter realiza uma análise estática dos seus arquivos de origem. Ele lê seu código e o verifica contra as regras Deque para identificar padrões que provavelmente causarão problemas de acessibilidade. Por exemplo, ele pode detectar:
- Imagens sem texto alternativo
- Entradas de formulário sem rótulos
- Atributos ARIA incorretos ou ausentes
- Problemas na estrutura de cabeçalhos
Como analisa o código-fonte em vez de um aplicativo em execução, o Axe DevTools Linter pode detectar esses problemas antecipadamente, antes que o código seja mesclado, implantado ou até mesmo compilado.
O Que o Axe DevTools Linter Não Pode Fazer
Como o Axe DevTools Linter é uma ferramenta de análise estática, ele não pode:
- Testar o comportamento em tempo de execução do seu aplicativo, como conteúdo carregado dinamicamente ou alterações na interface de usuário impulsionadas por JavaScript.
- Capturar todos os problemas de acessibilidade; a análise estática cobre um subconjunto de defeitos detectáveis, e alguns problemas requerem testes baseados em navegador ou revisão manual.
- Substituir testes manuais de acessibilidade ou ferramentas baseadas em navegador.
Tecnologias Suportadas
O Axe DevTools Linter pode verificar os seguintes tipos de arquivos:
| Tecnologia | Extensões de Arquivo |
|---|---|
| React | .js, .jsx, .tsx |
| Vue | .vue |
| Angular | .component.html |
| HTML | .html, .htm, .xhtml |
| LiquidJS | .liquid |
| HTL (Adobe Experience Manager) | .htl |
| Markdown | .md, .markdown |
| React Native | Ver Axe DevTools Linter para React Native |
Maneiras de Usar o Axe DevTools Linter
O Axe DevTools Linter pode ser usado de várias maneiras, dependendo do seu fluxo de trabalho:
Extensões de IDE fornece feedback em tempo real enquanto você escreve código. O extensão VS Code (também disponível para IDEs AI compatíveis com VS Code, como Cursor e Windsurf) e plugin JetBrains (WebStorm e IntelliJ IDEA Ultimate) indicam problemas de acessibilidade diretamente no seu editor enquanto você digita.
O Conector é uma ferramenta de linha de comando para linting de arquivos em lote, em scripts ou como parte de um pipeline de CI/CD. Veja Usando o Conector Axe DevTools Linter.
A GitHub Action verifica arquivos que foram alterados em um pull request e relata problemas de acessibilidade. Veja A GitHub Action do Axe DevTools Linter.
Outras integrações de CI/CD inclui Jenkins, SonarQube e hooks Git pre-commit.
Onde a Análise é Executada
Linting local: A extensão VS Code, o plugin JetBrains e o Conector (com a opção --local) executam a análise de acessibilidade na sua própria máquina. O conteúdo dos arquivos nunca sai do seu computador.
Linting baseado em servidor: O Conector também pode enviar seus arquivos para um servidor Axe DevTools Linter para análise. Esta é a abordagem usada pela Ação do GitHub. Existem duas opções de servidor:
- SaaS hospedado pela Deque: Servidor em nuvem da Deque. Requer uma chave API; nenhuma configuração de servidor necessária.
- On-premises: Um servidor que você executa dentro da sua própria infraestrutura. Veja Instalação e Segurança.
Para orientações sobre como escolher entre linting local e baseado em servidor com o Conector, veja Linting Local.
Visão Geral da Documentação
Escolher a configuração correta do Axe DevTools Linter ajuda você a decidir qual modelo de implantação, integrações e configuração se adequam ao fluxo de trabalho da sua equipe.
Obtendo uma Chave da API SaaS do Axe DevTools Linter mostra como obter uma chave para acessar o serviço de linting baseado na nuvem da Deque.
Regras de Acessibilidade lista todas as regras que o Axe DevTools Linter verifica, com links para informações detalhadas em Deque University.
Configurando o Axe DevTools Linter cobre as opções de configuração disponíveis na extensão VS Code, no plugin JetBrains, no Conector do Axe DevTools Linter e no endpoint da API REST /lint-source.
Instalação e Segurança contém artigos sobre a instalação do servidor local e sua segurança com o NGINX como um proxy reverso.
Usando o Axe DevTools Linter cobre as várias integrações: o plugin JetBrains, extensão VS Code, CLI do Conector, GitHub Action, hook de pré-commit, Jenkins e SonarQube.
Linting de Componentes Personalizados discute o suporte do Axe DevTools Linter para componentes personalizados, com tutoriais para usuários do VS Code e JetBrains e usuários de endpoints REST, além de um artigo sobre bibliotecas de componentes pré-configuradas.
Desenvolvendo com as APIs REST descreve como acessar programaticamente o Axe DevTools Linter usando sua interface REST.
Créditos fornece informações de atribuição e licença para softwares de terceiros usados pelo Axe DevTools Linter.
Note: It is never necessary to use Deque's software or services in a way that collects, stores, or shares personal data. Do not use the software or services in a manner that collects, stores, or shares personal data.