axe DevTools HTML for Cypress API Reference

Link to axe DevTools HTML for Cypress API Reference copied to clipboard

Reference for the APIs in the @axe-devtools/cypress package

Cypress Chainable Commands (analyze)

`cy.axeAnalyze()`

This chainable command injects axe into all pages and iframes which then runs axe on the page.

Parameter	Type	Default Value	Description
context (optional)	axe.ElementContext	undefined	Defines the scope of the analysis - the part of the DOM that you would like to analyze. This will typically be the document or a specific selector such as class name, ID, selector, etc.
options (optional)	axe.RunOptions	undefined	Set of options passed into rules or checks, temporarily modifying them. This contrasts with axe.configure, which is more permanent.
log (optional)	Boolean	false	returns an output to stdout with the amount of elements that are not accessible and violation impacts as a table.

`cy.isAxeClean()`

This chainable command is an assertion and returns of the page has violations or not.

Parameters:

Parameter	Type	Default Value	Description
context (optional)	axe.ElementContext	undefined	Defines the scope of the analysis - the part of the DOM that you would like to analyze. This will typically be the document or a specific selector such as class name, ID, selector, etc.
options (optional)	axe.RunOptions	undefined	Set of options passed into rules or checks, temporarily modifying them. This contrasts with axe.configure, which is more permanent.

Cypress Chainable Commands (configuration)

Integrate axe DevTools HTML with Cypress using custom Cypress chainable commands for configuring analyzed results.

`cy.setAxeSource()`

This chainable command sets the version of axe.

Parameter	Type	Default Value	Description
File path (required)	String	null	Path relative to the root of the project that should include `axe.source` or minified version of axe.

`cy.setAxeCustom()`

This chainable command allows the use of custom rulesets.

axe DevTools HTML Cypress also will implicitly read axe-ruleset.json when placed in the root level of the project or if also use custom ruleset files when AXE_RULESET_PATH environment variable is set.

Parameter	Type	Default Value	Description
File path (required)	String	null	Path relative to the root of the project that should include checks and rules

`cy.setAxeRuleset()`

This chainable command allows users to run rules per tags similar to configuring axe.run()

Parameter	Type	Default Value	Description
ruleset (required)	'508', 'en301549', 'ttv5', 'wcag2', 'wcag2.1', 'wcag2.2', 'wcag2aaa', 'wcag2.1aaa', 'wcag2.2aaa'	'wcag2.1'	Array of tags that this rule is assigned.

`cy.setAxeReportName()`

This chainable command allows users to set the name of the report file.

Parameter	Type	Default Value	Description
reportName (required)	String	@axe-devtools-cypress	Name of the report file.

`cy.getAxeResults()`

This chainable command allows users to utilize the results after running cy.axeAnalyze()

Responses from getAxeResults() returns the data shape axe.AxeResults.

Example:

after(() => {
  cy.axeAnalyze();
  cy.getAxeResults().then(data => {
    cy.writeFile('./results.json', data)
  })
})

Usage Service

Gain insight into axe DevTools HTML usage trends within your organization

Environment variables

This method allows users to change specific values of the usage service via environment variables

Environment Variable	Type
AXE_IS_LOGGED_IN	Boolean
AXE_KEYCLOAK_ID	String
AXE_USER_ID	String
AXE_SESSION_ID	String
AXE_USER_STATUS	String
AXE_USER_JOB_ROLE	String
AXE_DISTINCT_ID	String
AXE_IS_DEV_INSTANCE	Boolean
AXE_ORGANIZATION	String
AXE_APPLICATION	String
AXE_METRICS_URL	String
AXE_TRACK_USAGE	Boolean

`cy.task('enableTracking', <boolean>)`

This cypress task allows users to opt in to sending data to the usage service

`cy.task('setTrackingUrl', <string>)`

This cypress task allows users to change where the usage metrics data are being sent to

`cy.task('setDistinctId', <string>)`

This cypress task allows users to change the distinct id being stored/used

Next Steps

If you have issues installing axe DevTools HTML, contact your Deque representative directly, ask us via our support desk, or send us an email. We’ll be happy to help you get up and running.