28 Jan

How to set up Angular E2E Testing – Protractor

Angular JS
As applications grow in size and complexity, it becomes unrealistic to rely on manual testing to verify the correctness of new features, catch bugs and notice regression. Unit tests are the first line of defense for catching bugs, but sometimes issues come up with integration between components which can’t be captured in a unit test. End-to-end tests are made to find these problems.~ Angular

Now lets see how you set this up on your local computer.

Setup

1. Install node.js

Download node.js from: http://nodejs.org/download/
And install it on your computer.
We’ll call the install directory <DIR> from now on.



2. Install Java Development Kit

Go to http://www.oracle.com/technetwork/java/javase/downloads/index.html, download the latest JDK and install it on your computer.

3. Alter npmrc file

a. Go to <DIR>\node_modules\npm

b. Open file npmrc in Notepad

c. Change text in file to: prefix=<DIR>\node_modules\npm

d. Save and close

4. Open node.js command prompt

Start => All Programs => Node.js => Node.js command prompt

5. Install Protractor

Install Protractor with the following command:

npm install -g protractor

6. Go to npm folder

chdir <dir>\node_modules\npm</dir>

7. Update webdriver-manager

webdriver-manager update

8. Start webdriver-manager

webdriver-manager start

Now that you have your webdriver running, lets write a simple test.



Write Test

Write your Configuration file

The configuration file specifies how your test will behave and where they should be tested.

// conf.js
exports.config = {
  seleniumAddress: 'http://localhost:4444/wd/hub',
  framework: 'jasmine',
//Says in which browsers the tests should run
 multiCapabilities: [
	{
	  'browserName' : 'chrome'
	}, 
	{
          'browserName' : 'firefox'
	},
	{
	  'browserName' : 'safari'
	}
  ],
//Configure the browser to your tests
  onPrepare: function() {
     browser.driver.manage().window().setSize(1600, 800);
  },  
  jasmineNodeOpts: {
    showColors: true,
    defaultTimeoutInterval: 30000,
    isVerbose: true,
    includeStackTrace: true
  },
//The test file itself
  specs: ['spec.js']
}

Write your tests

This is an example of a simple test.

// spec.js
describe('angularjs homepage', function() {  
	var ptor = protractor.getInstance();

  it('should have a title', function() {
    browser.get('https://angularjs.org/');
	
    expect(browser.getTitle()).toEqual('AngularJS
           — Superheroic JavaScript MVW Framework');
  });
});

More info and examples can be found at https://docs.angularjs.org/guide/e2e-testing.

Run Tests

1. Open new node.js command prompt

Start => All Programs => Node.js => Node.js command prompt

3. Go to npm folder

chdir <dir>\node_modules\npm</dir>


4. Run tests

protractor <testconfigroot></testconfigroot>

Sources

 

Leave a Reply

Your email address will not be published. Required fields are marked *