This week 4/2017

This post collects some of my experiences about creating E2E test in protractor using TypeScript for AngularJs page.

At the beginning, it is required to prepare protractor (v4.0.9) configuration. Mine is below.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29

exports.config = { specs: [ './e2e/angularjs/**/*.e2e-spec.ts' ], capabilities: { 'browserName': 'chrome', }, directConnect: true, baseUrl: 'http://localhost:8080/test/', framework: 'jasmine', rootElement: 'html', jasmineNodeOpts: { // If true, display spec names. isVerbose: true, // If true, print colors to the terminal. showColors: true, // If true, include stack traces in failures. includeStackTrace: true, // Default time to wait in ms before a test fails. defaultTimeoutInterval: 120000 }, // compile ts files before run test beforeLaunch: function() { require('ts-node').register({ project: 'e2e' }); } };

In my case I have application which isn't single-page application but every functionality requires to load separate page. However I am going to change it if I find free time.

My notices & tips:

1. It is good to create a utils class with static methods.
2. Create one shared authorization method to use it in all tests.
3. For some test it is good to logout and even clean cookies. It is possible by code: browser.driver.manage().deleteAllCookies();
4. Sometimes it is good to create screen shot. It is easy to do it.



1 2 3 4 5 6 7 8 9 10

browser.takeScreenshot().then((png) => { let date = new Date(); let path = './target/_test-output' if(!existsSync(path)){ mkdirSync(path); } let stream = createWriteStream(path + '/test_' + date.getTime() + '.png'); stream.write(new Buffer(png, 'base64')); stream.end(); });

5. In configuration file it is good to set long enough timeout interval. I assumed 2 minutes. It is possible to set other, then default 11 sec, timeout in synchronisation mode - parameter allScriptsTimeout.
6. Look out if you use $timeout. Some demon task can lock synchronisation and test will fail on timeout. Better use $interval.
7. If you don't use synchronisation, warm up your application before test or set sleep time before each action loading data from server. Ex. My application load dictionaries from db but all constant values are archived in cache. Loading from db is of course much longer then from cache. It is important to remember about it. 
8. Some examples of css selectors:  

• td:nth-child(2) input
• td:nth-child(1) img#saveButton
• input[title="Is active?"]