Back to home

Setting up Node.js

Published: | Author: Russ Weakley

What this tutorial is about

Running axe-core in the browser console only required Chrome. The next tutorials in this series run axe-core outside the browser, so you'll need a few tools installed first.

This tutorial walks you through the setup, step by step, on a Mac or on Windows. Where the instructions differ, you'll see a Mac version and a Windows version.

By the end, you'll have installed Node.js, created a project folder, installed the accessibility tools, and run your first check.

Before you start

You'll need:

What's in this tutorial

Check your computer

Set up your project

Connect to Chrome

Check your computer

Step 1. Open your command line app

You'll be typing commands into a command line app. It lets you control your computer by typing instead of clicking. It looks a bit plain, but you only need a handful of commands, and each one is explained as you go.

How to use the commands in this tutorial:

Watch out for:

Step 2. Check if you have Node.js

Node.js is a program that lets your computer run JavaScript outside a web browser. The accessibility tools in this series are written in JavaScript, so they need Node.js to work.

Type:

node -v

(The -v is short for "version".)

You should see a version number that starts with the letter v, such as v24.13.0.

What the number means: Node.js versions have three numbers. For these tutorials, you'll need version 22.12 or later, but it's best to use a supported LTS version.

If you see an error such as command not found on Mac or 'node' is not recognized as an internal or external command on Windows, Node.js may not be installed.

If Node.js is missing or needs updating:

  1. Go to nodejs.org.
  2. Download the version marked LTS, which stands for "Long Term Support". This is the recommended version for most people. On Windows, choose the Windows Installer (.msi).
  3. Open the downloaded file and follow the installation instructions.
    • Mac: your Mac may ask for your password. That's normal.
    • Windows: you can accept the default settings, with one exception. If you see an option called Tools for Native Modules, leave it unticked. You don't need these extra tools for this tutorial. Windows may also ask whether you want to allow the installer to make changes to your device. Click Yes if it's the installer you downloaded from the official Node.js website.
  4. Close your command line app completely, then open it again.
    • Mac: press Command + Q to quit Terminal.
    • Windows: click the X in the corner of Command Prompt, or type exit and press Enter.
  5. Type node -v again to check that Node.js is installed and meets the version requirement.

Step 3. Check if you have npm

npm stands for "Node Package Manager". It downloads and installs extra software, called packages, that other people have written. You'll use it to install the accessibility tools.

npm normally comes with Node.js, so you should already have it installed.

Type:

npm -v

You should see a version number, such as 10.9.2. This means npm is installed and responding.

If you see an error saying "command not found" (Mac) or "'npm' is not recognized" (Windows), try installing Node.js again using the instructions in step 2.

Step 4. Check if you have Google Chrome

The accessibility tools in this tutorial use Google Chrome to check web pages, so you'll need Chrome installed.

Step 5. Show file name extensions (Windows only)

Mac: you can skip this step.

Windows: a file name extension is the part after the dot in a file name, such as .js in check.js. It tells your computer what kind of file it is.

Windows usually hides file extensions. This means a file named check.js.txt might appear as check.js, even though it's actually a text file. Showing file extensions helps you avoid this problem.

On Windows 11:

  1. Open File Explorer (press Windows key + E).
  2. Click View in the menu at the top.
  3. Point to Show, then click File name extensions so it has a tick next to it.

On Windows 10:

  1. Open File Explorer (press Windows key + E).
  2. Click the View tab at the top.
  3. Tick the File name extensions box.

Watch out for:

Set up your project

Step 6. Create a project folder

You'll keep everything for this series in one folder. Enter the following commands one at a time.

Mac:

cd ~/Documents

cd stands for "change directory". A directory is another word for a folder. This command moves you into your Documents folder.

Windows:

cd %USERPROFILE%

This moves you into your user folder, usually C:\Users\yourname. The %USERPROFILE% part is a shortcut for the location of that folder.

Then, on both Mac and Windows:

mkdir axe-learning

mkdir stands for "make directory". This creates a new folder called axe-learning.

cd axe-learning

This moves you into the new folder.

To check it worked:

Important: You'll need to be inside your axe-learning folder for the remaining commands in this tutorial. If you close your command line app and return later, use one of these commands to get back:

Watch out for:

Step 7. Turn the folder into a project

Type:

npm init -y

This sets up your folder as an npm project, so you can install tools into it. The -y stands for "yes" and accepts the default settings, so you won't be asked any questions.

You'll see some text appear on screen. This is npm showing you what it created: a file called package.json. Think of this as the project's notebook. It keeps information about your project, including the tools it uses.

To check it worked, list the files in your folder:

You should see package.json in the list.

Step 8. Install the accessibility tools

Type:

npm install @axe-core/cli playwright @axe-core/playwright

This installs three tools in one go. It may take a few minutes.

You'll notice a new folder called node_modules appears in your project folder. That's where npm stores the tools it installed. You don't need to open or change anything in it for these tutorials.

To check it worked, type:

npm ls

You should see the three tools listed, each with a version number.

Step 9. Download Playwright's browser

Playwright uses its own version of Chromium, separate from the Google Chrome browser you normally use. Type:

npx playwright install chromium

Chromium is the free, open-source browser that Google Chrome is built on. This download may take a few minutes.

You'll see progress information while it downloads. It's finished when the command prompt appears again.

Connect to Chrome

Step 10. Find your Chrome version

The axe command line tool uses a helper program called ChromeDriver to control Chrome. ChromeDriver needs to be compatible with your version of Chrome, so let's find out which version you have.

  1. Open Google Chrome.
  2. Click in the address bar, type chrome://version, then press Return (Mac) or Enter (Windows).
  3. Look for the Chrome version number. It should look something like 155.0.8059.85.

The first number, in this case 155, is the main version. Make a note of it.

Step 11. Install a matching ChromeDriver

Type this, replacing 155 with your main Chrome version number:

npm install chromedriver@155

This installs a version of ChromeDriver that matches your main Chrome version and adds it to your project.

To check it worked, type:

npm ls

You should now see four tools listed, including chromedriver, with a version number starting with your Chrome version.

Step 12. Run your first check

Use the command for your computer:

Mac:

npx axe https://example.com --chromedriver-path "node_modules/chromedriver/lib/chromedriver/chromedriver"

Windows:

npx axe https://example.com --chromedriver-path "node_modules\chromedriver\lib\chromedriver\chromedriver.exe"

You're now running your first axe-core accessibility test! The command:

  1. Opens the page in Chrome, without displaying a browser window.
  2. Checks the page for common accessibility problems.
  3. Lists any problems it finds.

Here's what the different parts of the command mean:

You'll need to include --chromedriver-path each time you run an axe check in this tutorial.

The test may take a few seconds to complete. When it's done, you'll see any accessibility issues axe-core found, along with the total number of violations.

To check a different page, replace https://example.com with that page's address.

Watch out for:

This tutorial is part of a series on accessibility testing with axe-core and Playwright. The articles in this series are:

  1. axe-core, Playwright and Cucumber
  2. Running axe-core in the browser console
  3. Setting up Node.js
  4. Running axe-core from the command line
  5. Running axe-core with a Playwright script
  6. Accessibility testing with Playwright

Back to home