Accessibility engine for automated Web UI testing
npx @tessl/cli install tessl/npm-axe-core@4.10.0Axe-core is an accessibility testing engine for websites and other HTML-based user interfaces. It's fast, secure, lightweight, and designed to seamlessly integrate with any existing test environment to automate accessibility testing alongside regular functional testing. The library can automatically find an average of 57% of WCAG issues while flagging elements that require manual review as "incomplete".
npm install axe-core// Browser environment
import axe from 'axe-core';
// Or access via global
// <script src="node_modules/axe-core/axe.min.js"></script>
// window.axe is now availableFor Node.js:
const axe = require('axe-core');TypeScript:
import * as axe from 'axe-core';// Run accessibility tests on the current page
axe.run()
.then(results => {
if (results.violations.length) {
console.log('Accessibility violations found:', results.violations);
} else {
console.log('No accessibility violations found');
}
})
.catch(err => {
console.error('Error running axe:', err);
});
// Run tests on specific elements
axe.run('#main-content')
.then(results => {
console.log('Results for main content:', results);
});
// Run with specific options
axe.run(document, {
runOnly: {
type: 'tag',
values: ['wcag2a', 'wcag2aa']
}
}).then(results => {
console.log('WCAG AA results:', results);
});Axe-core is built around several key components:
Primary accessibility testing functions for running comprehensive or targeted accessibility audits.
function run(context?: ElementContext): Promise<AxeResults>;
function run(options: RunOptions): Promise<AxeResults>;
function run(context: ElementContext, options: RunOptions): Promise<AxeResults>;
function run(callback: RunCallback): void;
function run(context: ElementContext, callback: RunCallback): void;
function run(options: RunOptions, callback: RunCallback): void;
function run(context: ElementContext, options: RunOptions, callback: RunCallback): void;
function runPartial(context: ElementContext, options: RunOptions): Promise<PartialResult>;
function finishRun(partialResults: PartialResults, options: RunOptions): Promise<AxeResults>;Configuration management, initialization, and cleanup functions for customizing axe-core behavior.
function configure(spec: Spec): void;
function setup(node?: Element | Document): VirtualNode;
function teardown(): void;
function reset(): void;Rule management and result reporting functionality for filtering, customizing, and formatting accessibility results.
function getRules(tags?: string[]): RuleMetadata[];
function runVirtualRule(ruleId: string, node: VirtualNode, options?: any): RawResult;
function hasReporter(reporterName: string): boolean;
function getReporter<T>(reporterName: string): AxeReporter<T>;
function addReporter<T>(reporterName: string, reporter: AxeReporter<T>, isDefault?: boolean): void;Comprehensive utility functions for DOM manipulation, ARIA processing, color analysis, and text handling.
// Commons utilities
interface Commons {
aria: Aria;
color: ColorUtils;
dom: DomUtils;
forms: FormsUtils;
math: MathUtils;
matches: MatchesFunction;
standards: StandardsUtils;
table: TableUtils;
text: TextUtils;
}
// Core utilities
interface Utils {
getFrameContexts(context?: ElementContext, options?: RunOptions): FrameContext[];
shadowSelect(selector: CrossTreeSelector): Element | null;
shadowSelectAll(selector: CrossTreeSelector): Element[];
getStandards(): Required<Standards>;
DqElement: DqElementConstructor;
uuid(options?: UuidOptions): string;
}Plugin system and frame communication for extending functionality and testing across iframe boundaries.
function registerPlugin(plugin: AxePlugin): void;
function cleanup(): void;
function frameMessenger(frameMessenger: FrameMessenger): void;interface AxeResults {
toolOptions: RunOptions;
passes: Result[];
violations: Result[];
incomplete: Result[];
inapplicable: Result[];
testEngine: TestEngine;
testRunner: TestRunner;
testEnvironment: TestEnvironment;
url: string;
timestamp: string;
}
interface Result {
description: string;
help: string;
helpUrl: string;
id: string;
impact?: 'minor' | 'moderate' | 'serious' | 'critical' | null;
tags: string[];
nodes: NodeResult[];
}
interface NodeResult {
html: string;
impact?: 'minor' | 'moderate' | 'serious' | 'critical' | null;
target: string[];
xpath?: string[];
ancestry?: string[];
any: CheckResult[];
all: CheckResult[];
none: CheckResult[];
failureSummary?: string;
element?: HTMLElement;
}
interface CheckResult {
id: string;
impact: string;
message: string;
data: any;
relatedNodes?: RelatedNode[];
}
interface RunOptions {
runOnly?: RunOnly | string[] | string;
rules?: RuleObject;
reporter?: 'v1' | 'v2' | 'raw' | 'rawEnv' | 'no-passes' | string;
resultTypes?: ('inapplicable' | 'passes' | 'incomplete' | 'violations')[];
selectors?: boolean;
ancestry?: boolean;
xpath?: boolean;
absolutePaths?: boolean;
iframes?: boolean;
elementRef?: boolean;
frameWaitTime?: number;
preload?: boolean | PreloadOptions;
performanceTimer?: boolean;
pingWaitTime?: number;
}
interface RunOnly {
type: 'rule' | 'rules' | 'tag' | 'tags';
values: string[];
}
type ElementContext = string | Element | NodeList | Selector[] | ContextObject;
interface ContextObject {
include?: ElementContext;
exclude?: ElementContext;
}