|
|
# Configure e2e tests on local machine
|
|
|
|
|
|
https://www.protractortest.org
|
|
|
|
|
|
## Write end-to-end tests
|
|
|
|
|
|
For writing e2e tests we will use the same Jasmine framework with Protractor test runner. It requires java to run `selenium`, if you have not installed java, you need to install it. Also it uses node package `http-server` to load pages on the project.
|
|
|
|
|
|
1. Install `protractor` and `http-server` globally:
|
|
|
|
|
|
```
|
|
|
npm install -g protractor http-server
|
|
|
```
|
|
|
|
|
|
2. End-to-end tests usually are located in a separate folder named `e2e-tests`. In this folder create `scenarios.js` file that will contain e2e tests. Since protractor uses Jasmine, the syntax of e2e tests are the same as in unit tests:
|
|
|
|
|
|
e2e-tests/scenarios.js
|
|
|
```
|
|
|
describe("Sample project", () => {
|
|
|
|
|
|
describe("the main page", () => {
|
|
|
let result,
|
|
|
num1,
|
|
|
num2,
|
|
|
btn;
|
|
|
|
|
|
beforeAll(() => {
|
|
|
// it's not an Angular project
|
|
|
browser.waitForAngularEnabled(false);
|
|
|
});
|
|
|
|
|
|
beforeEach(() => {
|
|
|
browser.get("index.html");
|
|
|
result = element(by.id('sum_result'));
|
|
|
num1 = element(by.id('input_number_1'));
|
|
|
num2 = element(by.id('input_number_2'));
|
|
|
btn = element(by.id("sum_button"));
|
|
|
});
|
|
|
|
|
|
it('should show empty result', () => {
|
|
|
expect(result.getText()).toEqual("");
|
|
|
});
|
|
|
|
|
|
it('should show 3', () => {
|
|
|
num1.sendKeys('1');
|
|
|
num2.sendKeys('2');
|
|
|
btn.click();
|
|
|
expect(result.getText()).toEqual("3");
|
|
|
});
|
|
|
|
|
|
it('should show 0', () => {
|
|
|
num1.sendKeys('1');
|
|
|
num2.sendKeys('-1');
|
|
|
btn.click();
|
|
|
expect(result.getText()).toEqual("0");
|
|
|
});
|
|
|
});
|
|
|
});
|
|
|
```
|
|
|
|
|
|
3. Create a protractor configuration file `e2e-tests/protractor.conf.js`:
|
|
|
|
|
|
```
|
|
|
exports.config = {
|
|
|
allScriptsTimeout: 11000,
|
|
|
specs: [
|
|
|
'*.js'
|
|
|
],
|
|
|
exclude: [
|
|
|
'*.conf.js'
|
|
|
],
|
|
|
capabilities: {
|
|
|
'browserName': 'chrome',
|
|
|
},
|
|
|
baseUrl: 'http://localhost:8000/',
|
|
|
framework: 'jasmine',
|
|
|
jasmineNodeOpts: {
|
|
|
defaultTimeoutInterval: 30000
|
|
|
}
|
|
|
};
|
|
|
```
|
|
|
|
|
|
4. Add `protractor` command to `package.json`. Protractor requires running http server to load pages, so add `start` command as well:
|
|
|
|
|
|
```
|
|
|
"scripts": {
|
|
|
"test": "karma start karma.conf.js",
|
|
|
"protractor": "protractor e2e-tests/protractor.conf.js",
|
|
|
"start": "http-server . -a localhost -p 8000 -c-1"
|
|
|
}
|
|
|
```
|
|
|
|
|
|
5. Download and install web drivers for selected browser by following command:
|
|
|
|
|
|
```
|
|
|
webdriver-manager update
|
|
|
```
|
|
|
|
|
|
6. Run http server in the second terminal:
|
|
|
|
|
|
```
|
|
|
npm start
|
|
|
```
|
|
|
|
|
|
7. Run protractor:
|
|
|
|
|
|
```
|
|
|
npm run protractor
|
|
|
```
|
|
|
|
|
|
If all tests passed result will be like this:
|
|
|
|
|
|
```
|
|
|
> js-frontend-tutorial@1.0.0 protractor /home/taras/Work/js-frontend-tutorial
|
|
|
> protractor e2e-tests/protractor.conf.js
|
|
|
|
|
|
[16:50:32] I/launcher - Running 1 instances of WebDriver
|
|
|
[16:50:32] I/local - Starting selenium standalone server...
|
|
|
[16:50:32] I/local - Selenium standalone server started at http://192.168.88.46:46910/wd/hub
|
|
|
Started
|
|
|
...
|
|
|
|
|
|
|
|
|
3 specs, 0 failures
|
|
|
Finished in 0.656 seconds
|
|
|
|
|
|
[16:50:34] I/local - Shutting down selenium standalone server.
|
|
|
[16:50:34] I/launcher - 0 instance(s) of WebDriver still running
|
|
|
[16:50:34] I/launcher - chrome #01 passed
|
|
|
``` |
|
|
\ No newline at end of file |