npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@yeatii/pa11y-dashboard

v5.0.1

Published

Pa11y Dashboard is a visual web interface to the Pa11y accessibility reporter

Downloads

2

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Git

Maintainers

yeatiiyeatii

Keywords

accessibilityanalysisreport

Readme

Pa11y Dashboard

Pa11y Dashboard is a web interface to the Pa11y accessibility reporter; allowing you to focus on fixing issues rather than hunting them down.

Version Node.js version support Build status GPL-3.0 licensed

dashboard results-page

Requirements

Pa11y Dashboard is a Node.js application and requires a stable or LTS version of Node, currently version 12 or 14.

⚠️ At the moment, Pa11y Dashboard won't work with Node.js v16. Please use Node.js 12 or 14. ⚠️

Pa11y Dashboard uses a MongoDB database to store the results of the tests. The database doesn't have to be in the same server or computer where Pa11y Dashboard is running from.

Pa11y Dashboard uses puppeteer to create a headless instance of the Chromium browser in order to run the tests. On certain environments this may require additional dependencies to be installed. For example, in Debian/Ubuntu systems you may need to install the libnss3 and libgconf-2-4 libraries in order to be able to run tests on Pa11y Dashboard. Please refer to the documentation from your provider for details on how to do this.

Setting up Pa11y Dashboard

In order to run Pa11y Dashboard, we recommend cloning this repository locally:

git clone https://github.com/pa11y/pa11y-dashboard.git

Then installing the dependencies:

cd pa11y-dashboard
npm install

Installing MongoDB

Instructions for installing and running MongoDB are outside the scope of this document. When in doubt, please refer to the MongoDB installation instructions for details of how to install and run MongoDB on your specific operating system. An example of the installation and configuration process for macOS follows.

Pa11y Dashboard currently uses version 3 of the Node.js MongoDB driver, which means that only MongoDB servers of versions 4.4 or older are supported. Please ensure that your MongoDB server fills the requirements before trying to run Pa11y Dashboard.

Example MongoDB installation for macOS

On recent versions of macOS (10.13 or later), you can use Homebrew to install MongoDB Community Edition. More recent versions of MongoDB are untested and unsupported.

Tap the MongoDB Homebrew Tap:

brew tap mongodb/brew

Install a supported Community version of MongoDB:

brew install [email protected]

Start the MongoDB server:

brew services start mongodb/brew/[email protected]

Check that the service has started properly:

$ brew services list
Name              Status  User       Plist
mongodb-community started pa11y      /Users/pa11y/Library/LaunchAgents/homebrew.mxcl.mongodb-community.plist

Configuring Pa11y Dashboard

The last step before being able to run Pa11y Dashboard is to define a configuration for it. This can be done in two ways:

Option 1: Using environment variables

Each configuration can be set with an environment variable rather than a config file. For example to run the application on port 8080 you can use the following:

PORT=8080 node index.js

The available configurations are documented in the next section.

Option 2: Using config files

You can store the configuration for Pa11y Dashboard on a JSON file. You can use a different configuration file for each environment you're planning to run Pa11y Dashboard on. You can choose a specific environment to run the application from by setting the NODE_ENV environment variable:

NODE_ENV=development node index.js

Three example files are provided in this repository, you can copy and customise them to your liking:

cp config/development.sample.json config/development.json
cp config/production.sample.json config/production.json
cp config/test.sample.json config/test.json

The available configurations are documented in the next section.

If you run into problems, check the [troubleshooting guide][#troubleshooting].

Configurations

The boot configurations for Pa11y Dashboard are as follows. Look at the sample JSON files in the repo for example usage.

port

(number) The port to run the application on. Set via a config file or the PORT environment variable.

noindex

(boolean) If set to true (default), the dashboard will not be indexed by search engines. Set to false to allow indexing. Set via a config file or the NOINDEX environment variable.

readonly

(boolean) If set to true, users will not be able to add, delete or run URLs (defaults to false). Set via a config file or the READONLY environment variable.

siteMessage

(string) A message to display prominently on the site home page. Defaults to null.

webservice

This can either be an object containing Pa11y Webservice configurations, or a string which is the base URL of a [Pa11y Webservice][pa11y-webservice] instance you are running separately. If using environment variables, prefix the webservice vars with WEBSERVICE_.

Contributing

There are many ways to contribute to Pa11y Dashboard, we cover these in the contributing guide for this repo.

If you're ready to contribute some code, you'll need to clone the repo and get set up as outlined in the setup guide. You'll then need to start the application in test mode with:

NODE_ENV=test node index.js

You'll now be able to run the following commands:

make verify              # Verify all of the code (ESLint)
make test                # Run all tests
make test-integration    # Run the integration tests

To compile the client-side JavaScript and CSS, you'll need the following commands. Compiled code is committed to the repository.

make less    # Compile the site CSS from LESS files
make uglify  # Compile and uglify the client-side JavaScript

Useful resources

Troubleshooting

Common issues

  • 500 errors or Could not connect to pa11y-webservice messages are often related to MongoDB. Ensure that you have the [appropriate version of MongoDB][#installing-mongodb] installed, and that it's running - it doesn't always start automatically.
  • Error messages saying that pa11y-webservice isn't running may be due to dependency installation problems. Try deleting your pa11y-dashboard/node_modules directory and running npm install again.

Create a new issue

Check the issue tracker for similar issues before creating a new one. If the problem that you're experiencing is not covered by one of the existing issues, you can create a new issue. Please include your node.js and MongoDB version numbers, and your operating system, as well as any information that may be useful in debugging the issue.

Support and Migration

Pa11y Dashboard major versions are normally supported for 6 months after their last minor release. This means that patch-level changes will be added and bugs will be fixed. The table below outlines the end-of-support dates for major versions, and the last minor release for that version.

We also maintain a migration guide to help you migrate.

| :grey_question: | Major Version | Last Minor Release | Node.js Versions | Support End Date | | :-------------- | :------------ | :----------------- | :--------------- | :--------------- | | :heart: | 4 | N/A | 12+ | N/A | | :hourglass: | 3 | 3.3.0 | 8+ | 2022-05-26 | | :skull: | 2 | 2.4.2 | 4+ | 2020-01-16 | | :skull: | 1 | 1.12 | 0.10–6 | 2016-12-05 |

If you're opening issues related to these, please mention the version that the issue relates to.

License

Pa11y Dashboard is licensed under the GNU General Public License 3.0. Copyright © 2013–2020, Team Pa11y and contributors