{"id":20028732,"url":"https://github.com/phase2/pa11y-dashboard","last_synced_at":"2025-07-20T02:33:21.662Z","repository":{"id":137099853,"uuid":"157933050","full_name":"phase2/pa11y-dashboard","owner":"phase2","description":"A vue-based dashboard that displays results generated by the pa11y or pa11y-ci tool.","archived":false,"fork":false,"pushed_at":"2019-06-17T18:04:33.000Z","size":312,"stargazers_count":6,"open_issues_count":2,"forks_count":1,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-01-12T17:35:40.262Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/phase2.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-11-16T23:36:44.000Z","updated_at":"2023-07-12T22:50:33.000Z","dependencies_parsed_at":null,"dependency_job_id":"063617d8-9785-4f46-bf7a-6b205907080f","html_url":"https://github.com/phase2/pa11y-dashboard","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/phase2%2Fpa11y-dashboard","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/phase2%2Fpa11y-dashboard/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/phase2%2Fpa11y-dashboard/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/phase2%2Fpa11y-dashboard/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/phase2","download_url":"https://codeload.github.com/phase2/pa11y-dashboard/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241460048,"owners_count":19966518,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-13T09:16:16.082Z","updated_at":"2025-03-02T04:45:28.275Z","avatar_url":"https://github.com/phase2.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# pa11y Results Dashboard\nA Vue.js powered display of accessibility results generated by pa11y-ci.\n\nThis is intended to be used as a docker service, in conjunction with another service that generates reports, but can be run standalone locally if you also install pa11y-ci (`npm install --save pa11y-ci`). This is not included by default due to pa11y's dependence on a 90mb copy of headless chrome (used to actually run the tests).\n\n## Quickstart\nThis assumes you have access to npm and docker.\n\n1. `npm install`\n2. `npm run report`\n3. `docker-compse run --rm pa11y`\n4. `npm run serve`\n\nThis will install necessary dependencies, convert config to a usuable .json file, run pa11y-ci in a docker container, and then start a webpack dev server locally to see the results in a manageable dashboard.\n\n## Generic Docker Usage\nAdd these to the appropriate docker-compose for your project, and get accessible today!\n\n```docker-compose.yml\n\nversion: '3.3'\nservices:\n\n  # a service to generate pa11y results\n  # docker-compose run --rm pa11y\n  pa11y:\n    image: outrigger/pa11y:dev\n    container_name: pa11y\n    command: bash -c \"cd /code/pa11y \u0026\u0026 pa11y-ci --config /code/pa11y/config.json --json \u003e report.json\"\n    volumes:\n      # pa11y-ci works by default with a .pa11yci file\n      - ./tests/pa11y/:/code/pa11y/\n    cap_add:\n      - SYS_ADMIN\n\n  # a service to spin up this pa11y result dashboard\n  # docker-compose run --rm dashboard\n  dashboard:\n    image: outrigger/pa11y-dashboard\n    container_name: pa11ydash\n    network_mode: bridge\n    environment:\n      DNSDOCK_NAME: www\n      DNSDOCK_IMAGE: pa11y\n    volumes:\n      - type: bind\n        source: ./tests\n        target: /app/tests\n```\n\nThe first service uses an image that contains both pa11y and pa11y-ci. It looks for your pa11y config inside of `tests/pa11y/`, and uses that inside the image. The command switches to the appropriate folder and runs the test based on your config, and outputs results as a JSon object.\n\nThe second service runs this dashboard in dev mode, and makes it available outside of the container at `www.pa11y.vm/`. It looks at `./tests/pa11y/` to ingest the generated report.json from the first service. By running in dev mode, the service can be run once, and will automatically update every time the pa11y service is re-run.\n\n## Usage with Docksal\nTo use this dashboard locally with [Docksal](https://docksal.io/), copy the .docksal pa11y command and service definition (both found in the .docksal folder)to your project.\n\nThen, you can run `fin pa11y` to generate a report. Run `fin project up` to bring all of your project's containers up, including the pa11y dashboard. It should then be visible at `http://pa11y.project.docksal/`.\n\n## pa11y-ci\n\nConfiguration options are set in `./tests/pa11y/.pa11yci.js`. See [pa11y-ci](https://github.com/pa11y/pa11y-ci) for more information on specific options. At the very least, a list of urls to test on is needed. This .js file will get converted to a config.json, which is consumed by the docker container that actually runs pa11y-ci. \n\n```js\n{\n  urls: [\n    \"http://example.com\",\n    \"http://www.another-example.com\",\n    \"http://a.third.link.io/to/test\"\n  ]\n}\n```\n\nIf your site has a sitemap, that can be passed in as an option in the package.json `report` command, e.g. `pa11y-ci --sitemap http://example.com/sitemap.xml -j \u003e pa11y-report.json`. This will check the urls in your sitemap, __in addition to__ any links defined inside the `.pa11yci` urls array noted above.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fphase2%2Fpa11y-dashboard","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fphase2%2Fpa11y-dashboard","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fphase2%2Fpa11y-dashboard/lists"}