Playwright automates browsers using really nifty APIs built into web browsers.
This program builds on that to automate tasks for QA testing webpages. Thanks to Playwright, it works across all major browsers and operating systems.
The Plunder CLI is published to npm as @eighty4/plunder and its API is published as @eighty4/plunder-core.
# run directly from npm
npx @eighty4/plunder -h
# install globally and run
npm i -g @eighty4/plunder@latest
plunder -hPludering webpages with --css-breakpoints will use
LightningCSS to capture screenshots on a
CSS breakpoint and 1px outside of a CSS breakpoint.
plunder --css-breakpoints --out-dir www_qa https://alistapart.comLet's go back to the LightningCSS website again and appreciate those neon light effects!
Plunder takes screenshots of a webpage as they would look on phones, tablets or varying pixel density desktops.
Capture screenshots emulating a curated selection of modern phones and tablets
with --modern-devices:
plunder --modern-devices --out-dir www_qa https://alistapart.comDevice presets are available that can be added with --device or -d.
This flag is a search param, so -d ipad will match all modern iPad devices.
# emulate ipad and iphone devices
plunder --device ipad --device iphone --out-dir www_qa https://alistapart.com
# emulate high pixel density
plunder --device hidpi --out-dir www_qa https://alistapart.com# list modern devices used with --modern-devices flag
plunder devices
# see result of an explicit device query
plunder -d hidpi devices
# see exhustive list of queryable devices
plunder -a devicesplunder links https://alistapart.compnpm and Node 23 are required for development.
Plunder embraces Node's experimental type stripping support and Node will emit warnings about TypeScript when running unit tests.
Until Node finalizes type stripping support, CLI users will receive warnings
from Node if their --capture-hook script is a TypeScript file. Hopefully the
next LTS release of Node will remove the warnings!
pnpm i
pnpm --filter \!@eighty4/plunder-webapp build
node cli/lib/plunder.js -hPlunder out directories will have a web report written to the out directory's
root. The web report is built with React and Vite and distributed with the CLI
package @eighty4/plunder.
The webapp package's README.md has details on running the Vite app.
The ci_verify.sh script runs through all the CICD checks done on GitHub Actions:
./ci_verify.shThe script has flags to symlink the ci_verify.sh as git hooks.
./ci_verify.sh --on-git-commit
./ci_verify.sh --on-git-push