QA tools for Wagtail core development, with a particular focus on UI
QA tools for Wagtail core development, with a particular focus on UI.
This project contains a test suite for Wagtail, which generates:
# Get the code from the repository.
git clone [email protected]:thibaudcolas/wagtail-tooling.git
cd wagtail-tooling
# Install dependencies.
nvm install
npm install
# Configure environment variables.
touch .env
# Configure Wagtail user session ID to use.
# Get this value by logging into the Wagtail admin of your site, then
# use the developer tools to insect the cookies, to find "sessionid".
# echo "WAGTAIL_SESSIONID=yoursessionid" >> .env
You will also need to update the loadSVG.js file to contain an up-to-date copy of Wagtail’s icons sprite.
# 1. Run UI regression tests.
npm run regression:test
# 2. Create UI regression reference.
npm run regression:approve
# 3. Open UI regression report.
npm run regression:open
We use wagtail-tooling to keep Wagtail’s documentation screenshots up-to-date. Using this tooling helps to:
See docs-screenshots/backstop.config.js. There are three sets of scenarios which need toggling on and off with code comments in the scenarios array:
# 1. Run UI regression tests.
npm run docs:regression:test
# 2. Create UI regression reference.
npm run docs:regression:approve
# 3. Open UI regression report.
npm run docs:regression:open
After the regression testing is done, optimize images with ImageOptim or equivalent, make a pull request to Wagtail, and follow guide.wagtail.org Images docs.
Store the optimized images in wagtail-tooling-screenshots. Though not a must, this helps with future screenshot taking runs so we can identify the screenshots that have actually changed and require updating.