Configuration management, initialization, and cleanup functions for customizing axe-core behavior, managing rules and checks, and controlling the testing environment.
Method for configuring axe-core with custom rules, checks, standards, and other settings.
/**
* Configure axe-core with custom rules, checks, and settings
* @param spec - Configuration specification object
*/
function configure(spec: Spec): void;Usage Examples:
// Add custom rule
axe.configure({
rules: [{
id: 'custom-rule',
selector: 'input',
impact: 'serious',
tags: ['custom'],
all: ['custom-check'],
metadata: {
description: 'Custom rule description',
help: 'Custom rule help text'
}
}]
});
// Add custom check
axe.configure({
checks: [{
id: 'custom-check',
evaluate: function(node, options) {
return node.hasAttribute('required');
},
metadata: {
impact: 'serious',
messages: {
pass: 'Element has required attribute',
fail: 'Element missing required attribute'
}
}
}]
});
// Configure locale
axe.configure({
locale: {
lang: 'es',
rules: {
'color-contrast': {
description: 'Los elementos deben tener suficiente contraste de color',
help: 'El contraste de color debe cumplir con las pautas WCAG AA'
}
}
}
});
// Set branding
axe.configure({
branding: 'my-company'
});
// Disable other rules when adding custom ones
axe.configure({
rules: [{ id: 'my-rule', selector: 'div' }],
disableOtherRules: true
});Initialize axe-core for commons usage and create virtual tree.
/**
* Setup axe-core so axe.commons functions can work properly
* @param node - Root element or document to analyze (defaults to document)
* @returns Virtual node tree for the specified element
*/
function setup(node?: Element | Document): VirtualNode;Usage Examples:
// Setup for entire document
const virtualTree = axe.setup();
console.log('Virtual tree created:', virtualTree);
// Setup for specific element
const mainElement = document.getElementById('main');
const virtualMain = axe.setup(mainElement);
// Use commons functions after setup
const role = axe.commons.aria.getRole(virtualMain);
const isVisible = axe.commons.dom.isVisible(virtualMain);Clean up axe-core tree and caches.
/**
* Clean up axe-core tree and caches
* Called automatically at end of axe.run, but can be called manually
*/
function teardown(): void;Usage Examples:
// Manual cleanup after using setup
axe.setup();
// ... use commons functions
axe.teardown(); // Clean up when done
// Teardown is called automatically after run
axe.run().then(results => {
// teardown() is called automatically here
console.log('Results processed and cleaned up');
});Restore the default axe configuration.
/**
* Restores the default axe configuration
* Removes all custom rules, checks, and settings
*/
function reset(): void;Usage Examples:
// Add custom configuration
axe.configure({
rules: [{ id: 'custom-rule', selector: 'div' }]
});
// Later, reset to defaults
axe.reset();
console.log('Configuration reset to defaults');
// Check available rules (should be back to defaults)
const defaultRules = axe.getRules();
console.log('Default rules restored:', defaultRules.length);interface Spec {
branding?: string | Branding;
reporter?: 'v1' | 'v2' | 'raw' | 'rawEnv' | 'no-passes' | string | AxeReporter;
checks?: Check[];
rules?: Rule[];
standards?: Standards;
locale?: Locale;
disableOtherRules?: boolean;
axeVersion?: string;
noHtml?: boolean;
allowedOrigins?: string[];
}
interface Branding {
brand?: string;
application?: string;
}
interface Check {
id: string;
evaluate?: string | CheckEvaluateFunction;
after?: string | CheckAfterFunction;
options?: any;
matches?: string;
enabled?: boolean;
metadata?: {
impact?: 'minor' | 'moderate' | 'serious' | 'critical';
messages?: CheckMessages;
};
}
interface CheckMessages {
pass: string | { [key: string]: string };
fail: string | { [key: string]: string };
incomplete?: string | { [key: string]: string };
}
type CheckEvaluateFunction = (
node: Element,
options: any,
virtualNode: VirtualNode
) => boolean | undefined | void;
type CheckAfterFunction = (
results: AfterResult[],
options: any
) => AfterResult[];
interface AfterResult {
id: string;
data?: any;
relatedNodes: SerialDqElement[];
result: boolean | undefined;
node: SerialDqElement;
}
interface Rule {
id: string;
selector?: string;
impact?: 'minor' | 'moderate' | 'serious' | 'critical';
excludeHidden?: boolean;
enabled?: boolean;
pageLevel?: boolean;
any?: string[];
all?: string[];
none?: string[];
tags?: string[];
matches?: string | RuleMatchesFunction;
reviewOnFail?: boolean;
actIds?: string[];
metadata?: {
description?: string;
help?: string;
helpUrl?: string;
};
}
type RuleMatchesFunction = (node: Element, virtualNode: VirtualNode) => boolean;
interface Standards {
ariaAttrs?: { [key: string]: AriaAttrs };
ariaRoles?: { [key: string]: AriaRoles };
htmlElms?: { [key: string]: HtmlElms };
cssColors?: { [key: string]: number[] };
}
interface AriaAttrs {
type: 'boolean' | 'nmtoken' | 'nmtokens' | 'idref' | 'idrefs' | 'string' | 'decimal' | 'int';
values?: string[];
allowEmpty?: boolean;
global?: boolean;
unsupported?: boolean;
}
interface AriaRoles {
type: 'abstract' | 'widget' | 'structure' | 'landmark' | 'section' | 'link' | 'listitem' | 'img' | 'navigation' | 'note' | 'separator' | 'none' | 'sectionhead';
requiredContext?: string[];
requiredOwned?: string[];
requiredAttrs?: string[];
allowedAttrs?: string[];
nameFromContent?: boolean;
unsupported?: boolean;
}
interface HtmlElms {
contentTypes?: ('flow' | 'sectioning' | 'heading' | 'phrasing' | 'embedded' | 'interactive')[];
allowedRoles?: boolean | string[];
noAriaAttrs?: boolean;
shadowRoot?: boolean;
implicitAttrs?: { [key: string]: string };
namingMethods?: string[];
variant?: { [key: string]: HtmlElmsVariant };
}
interface HtmlElmsVariant {
contentTypes?: ('flow' | 'sectioning' | 'heading' | 'phrasing' | 'embedded' | 'interactive')[];
allowedRoles: boolean | string[];
noAriaAttrs?: boolean;
shadowRoot?: boolean;
implicitAttrs?: { [key: string]: string };
namingMethods?: string[];
}
interface Locale {
lang?: string;
rules?: RuleLocale;
checks?: CheckLocale;
}
interface RuleLocale {
[key: string]: {
description: string;
help: string;
};
}
interface CheckLocale {
[key: string]: CheckMessages;
}
interface VirtualNode {
actualNode?: Node;
shadowId?: string;
children?: VirtualNode[];
parent?: VirtualNode;
attr(attr: string): string | null;
hasAttr(attr: string): boolean;
props: { [key: string]: any };
boundingClientRect: DOMRect;
}
interface SerialDqElement {
source: string;
nodeIndexes: number[];
selector: string[];
xpath: string[];
ancestry: string[];
}
type AxeReporter<T = any> = (
rawResults: RawResult[],
options: RunOptions,
resolve: (report: T) => void,
reject: (error: Error) => void
) => void;
interface RawResult {
id: string;
result: 'passed' | 'failed' | 'incomplete' | 'inapplicable';
pageLevel: boolean;
impact: 'minor' | 'moderate' | 'serious' | 'critical' | null;
nodes: RawNodeResult[];
description: string;
help: string;
helpUrl: string;
tags: string[];
}
interface RawNodeResult {
node: SerialDqElement;
any: RawCheckResult[];
all: RawCheckResult[];
none: RawCheckResult[];
impact: 'minor' | 'moderate' | 'serious' | 'critical' | null;
result: 'passed' | 'failed' | 'incomplete';
}
interface RawCheckResult {
id: string;
impact: string;
message: string;
data: any;
relatedNodes?: SerialDqElement[];
}
interface RunOptions {
runOnly?: RunOnly | string[] | string;
rules?: RuleObject;
reporter?: string;
resultTypes?: string[];
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[];
}
interface RuleObject {
[ruleId: string]: {
enabled: boolean;
};
}
interface PreloadOptions {
assets: string[];
timeout?: number;
}