Test Scripts
3 test scripts will be generated to automate testing of the various states seen in the above Subscription Flow diagram.
These scripts include coverage for both functional and visual UI testing.
They can be found in the tests/scripts folder. Page Objects for these tests can be found in the tests/pages folder.
Subscribe
- show opt-in
- click on opt-in
Yes Please - show subscription
- browser set to auto-allow notifications
- show success confirmation
No Thanks
- show opt-in
- click on opt-in
No Thanks - opt-in should not display for 5 sessions
- after 5 sessions, opt-in should re-display
Blocked
- show opt-in
- click on opt-in
Yes Please - browser set to auto-block notifications
- redirect back to start page, with no opt-in
Installation
If you haven't already done so, install Nightwatch.
To install the latest version of Nightwatch using the npm command line tool, run the following:
npm install -g nightwatch
Test Configuration
The Nightwatch configuration will need to be updated before these tests can be run. The configuration can be found here: tests/nightwatch.conf.js.
The following placeholders will need to be updated:
SITE_URL: The url of the site under test.SCREENER_API_KEY: The API key for Mobify's Screener account.SCREENER_GROUP_ID: The Group ID for this project in Mobify's Screener account.SAUCE_LABS_USERNAME: The username for Mobify's Sauce Labs account.SAUCE_LABS_ACCESS_KEY: The Access Key for Mobify's Sauce Labs account.
Run Tests
In the generated nightwatch.conf.js file, 4 test environments are included by default:
default: Subscribe flow test for Desktop resolution.mobile: Subscribe flow test for Mobile resolution.nothanks: No Thanks flow test.blocked: Blocked flow test.
Automated Tests can be run individually or in parallel.
To run all tests in parallel from tests folder:
nightwatch -e default,mobile,nothanks,blocked
To run individually, add only the name of the test environment you'd like to run. For example:
nightwatch -e default
Visual Tests
The "Subscribe" test captures snapshots at various resolutions to automate visual testing. When UI code is updated, these Screener tests can be re-run to catch visual regressions.
Results of the visual tests can be viewed in Screener.