https://github.com/klamping/wdio-starter-kit
Boilerplate repo for quick set up of WebdriverIO test scripts with TravisCI, Sauce Labs and Visual Regression Testing
https://github.com/klamping/wdio-starter-kit
automation starter-kit-for-front-end-developer testing webdriverio
Last synced: 11 months ago
JSON representation
Boilerplate repo for quick set up of WebdriverIO test scripts with TravisCI, Sauce Labs and Visual Regression Testing
- Host: GitHub
- URL: https://github.com/klamping/wdio-starter-kit
- Owner: klamping
- License: mit
- Created: 2017-07-05T00:32:00.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2019-03-26T03:19:48.000Z (about 7 years ago)
- Last Synced: 2024-06-14T21:09:04.401Z (about 2 years ago)
- Topics: automation, starter-kit-for-front-end-developer, testing, webdriverio
- Language: JavaScript
- Homepage: https://learn.webdriver.io
- Size: 58.6 KB
- Stars: 31
- Watchers: 6
- Forks: 22
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://travis-ci.org/klamping/wdio-starter-kit)
[](https://github.com/Flet/semistandard)
# WebdriverIO Starter Kit
Boilerplate repo for quick set up of WebdriverIO test scripts with TravisCI, Sauce Labs and Visual Regression Testing
## Configuration
1. Clone the repo and run `npm install`
2. Add a valid `SAUCE_USERNAME` and `SAUCE_ACCESS_KEY` to your environment variables to enable that integration. ([Settting up Sauce](http://webdriver.io/guide/usage/cloudservices.html#Sauce-Labs))
3. Update the 'baseUrl' property in `wdio.conf.js` and `wdio.conf.local.js`
4. Update the spec files and page objects in the test folder
## Usage
By default, the kit is set up to run tests using the `npm test` command.
You can also lint your code with `npm run lint`.
## This kit features:
- [Login & Registration Tests, with Page Objects](#starter-test-cases)
- [Mocha](http://mochajs.org/)
- [Chai with `expect` global](http://chaijs.com/guide/styles/#expect)
- [Chai WebdriverIO](https://github.com/marcodejongh/chai-webdriverio)
- [Sauce Labs integration](http://webdriver.io/guide/usage/cloudservices.html#Sauce-Labs)
- [Visual Regression Tests](https://github.com/zinserjan/wdio-visual-regression-service)
- [Local notifications](http://blog.kevinlamping.com/continuous-local-webdriverio-testing-with-onchange-and-node-notifier-watching/)
- [ESLint](http://eslint.org/) using [Semistandard style](https://github.com/Flet/semistandard)
- [WebdriverIO tuned Gitignore file](https://github.com/klamping/wdio-starter-kit/blob/master/.gitignore#L61)
## More Details
### Starter Test Cases
Because login and registration pages are ubiquitous on websites, I've included two test files with corresponding page objects.
You'll very likely need to replace the selectors used in the page objects.
You'll also want to update the `isLoggedIn` and `isRegistered` functions in the page objects to return the proper response.
### Folder Structure
Tests and page objects go in the `test\` folder, which you'll need to create.
Name tests with a `.spec.js` extension. For example: `mytest.spec.js`
Name Page Object files with a `.page.js` extention. For example: `mypageobject.page.js`
Visual regression screenshots will be saved to the `screenshots` folder.
### TravisCI Integration
This kit includes a basic `.travis.yml` file set up to allow easy integration with their service. Simply enable your repo in [TravisCI](https://travis-ci.org/) and you'll get it up and running. And be sure to update the badge information at the top of this file.
### Debug Command Line Flag to adjust timeout
By setting the 'DEBUG' environment variable to true, the test timeout with be essentially removed, allowing you to run [the `debug` command](https://www.youtube.com/watch?v=xWwP-3B_YyE&lc=z12gw1vqpu2sunjeq222hrsxstf3glohh04) without your tests timing out.
`DEBUG=true npm test`
### Configuration file flavors
By default, tests will run in Sauce Labs testing your production server.
To run the tests entirely locally, run:
`npm test wdio.conf.local.js`
## Configurations
[WebdriverIO configurations](http://webdriver.io/guide/testrunner/gettingstarted.html) can be passed in via a double-dash (i.e. `--`).
For example, to run a single test file, use the WDIO `spec` flag: `npm test -- --spec=login`
The double dash indicates that the remaining options should be sent to the command that NPM is running, not NPM itself.
In the previous example everything after `--` goes to WDIO.
A few more examples:
To change the log level, pass in a `--logLevel` flag: `npm test -- --logLevel=verbose`
To specify a certain web server, pass in a `baseUrl` flag: `npm test -- --baseUrl=http://url.of.server`