Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/beckkramer/puppeteer-traverse
Puppeteer utility to easily run a function you define per route on a set of routes.
https://github.com/beckkramer/puppeteer-traverse
crawler crawling nodejs puppeteer
Last synced: 26 days ago
JSON representation
Puppeteer utility to easily run a function you define per route on a set of routes.
- Host: GitHub
- URL: https://github.com/beckkramer/puppeteer-traverse
- Owner: beckkramer
- Created: 2021-05-01T23:09:13.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2023-08-26T18:29:29.000Z (about 1 year ago)
- Last Synced: 2024-10-04T01:06:20.595Z (about 1 month ago)
- Topics: crawler, crawling, nodejs, puppeteer
- Language: TypeScript
- Homepage:
- Size: 1020 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# puppeteer-traverse
`puppeteer-traverse` is a Puppeteer utility to easily run a function you define per route on a set of routes.
Your function will have access to an instance of [Puppeteer Page](https://pptr.dev/#?product=Puppeteer&show=api-class-page) for every route you have in your configuration, making it simple to run things like visual regression tests, accessibility checks, and other types of validations you might want to run on an entire website.
[](https://codecov.io/gh/beckkramer/puppeteer-traverse)
## Screenshots
### Mid-run of example:
### Completed run, with example of error on one route:
## Setup:
### Add to your project
```
npm install puppeteer-traverse
```
### Populate configuration
To run puppeteer-traverse as part of your project, you'll need to add configuration for the site you want to check, and a function to be run on every route. This is the minimal setup, and might be all you need!
```js
export const config = {
app: {
errorContent: [],
rootUrl: 'https://site-to-check.com',
},
features: [
{
name: 'Food Menu',
id: 'menu_food',
paths: [
'/menu/breakfast',
'/menu/dinner',
'/menu/lunch',
]
},
{
name: 'Drinks Menu',
id: 'menu_drinks',
paths: [
'/menu/beer',
'/menu/drinks',
'/menu/wine',
]
}
]
};
```
### Additional Options:
You might want to skip a route from being checked in certain cases (e.g. if your site has a 404 page and you want to skip it if a route redirects there). If the site you are checking has standardized 404/error content, you can include an array of strings as `errorContent` in your config. If found on a page, the route will be skipped. If you don't want to skip any routes, just leave the `errorContent` array empty.
## Example: Take a screenshot per route
This example presumes you have Yarn installed, as the project uses it locally.
Inside the `/examples` folder of this project, you'll find configuration, overrides, and a function that will take a screenshot per route. You can take the example for a spin by cloning the repo, running `yarn` to install dependencies, and then and running `yarn example`.