Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
67 lines (44 sloc) 2.92 KB

Chrome Developer Console Examples

These examples show how to run the rulesets directly in the Chrome Developer Console.

Running Rulesets Against a Website

Step 1: View Setup

Open the Google Chrome browser. Navigate to the url you wish to test. For example, go to https://www.google.com.

Step 2: Open the Chrome Developer Console

Follow these steps:

  • Right click, select Inspect.
  • Click on the Console Tab.

Step 3: Copy and Paste the Javascript Files

To run the (Rulesets) directly within the browser console, we need to first copy over the appropriate code. For both rulesets (custom.ruleset.X.X.X.js and aXe.ruleset.X.X.X.js), do follow these steps:

  • Click Raw to get to the raw version of the file.
  • Copy the entire ruleset javascript file.
  • Paste the file directly into the browser console.
  • Hit Enter.

Step 4: Invoke the Ruleset Methods

Run the commands as specified below.

Custom Ruleset

The following commands are used to run the Custom Ruleset:

var results = axs.Audit.run();
JSON.stringify(results);

The output should match the Custom Ruleset Runner Output.

To run the custom ruleset on one particular element, modify the following command appropriately:

var results = axs.Audit.run({"XPATH_ROOT":"//div[@id='div_1.2']"});

Note: This will ignore page requirements like title, h1, skip to main content, etc

aXe Ruleset

The aXe ruleset runner creates an array of which rules to run (each rule included here is associated with a WCAG 2.0 AA guideline).

Assuming the aXe javascript file has already been copied/pasted into the browser console (see above), the following commands are used to run the aXe Ruleset:

var callback = function(results) {
  console.log(JSON.stringify(results));
}

var rulesToRun = ['area-alt','accesskeys','aria-allowed-attr','aria-required-attr','aria-required-children','aria-required-parent','aria-roles','aria-valid-attr-value','aria-valid-attr','audio-caption','blink','button-name','bypass','checkboxgroup','color-contrast','document-title','duplicate-id','empty-heading','heading-order','href-no-hash','html-lang-valid','image-redundant-alt','input-image-alt','label','layout-table','link-name','marquee','meta-refresh','meta-viewport','meta-viewport-large','object-alt','radiogroup','scopr-attr-valid','server-side-image-map','tabindex','table-duplicate-name','td-headers-attr','th-has-data-cells','valid-lang','video-caption','video-description'];

axe.a11yCheck(document, {runOnly: {type: "rule", values: rulesToRun }}, callback );

The output should match the aXe Ruleset Runner Output.

You can’t perform that action at this time.