Protractor basic example program

Let us now create a very basic test and execute using protractor. As we know protractor needs to files spec file (test file) and conf file (configuration file).

In the below example, we are describing a test suite using the function describe() which is a global function in Jasmine which takes two parameters: a string and a function.

The string is a name or title of the spec suite which is being tested and the function contains all the code that will implement the suite.

it(), which is like describe takes a string and a function. The string is the title of the spec and the function is the spec, or test. 'it'is a block with a combination of commands and expectations.

browser is a global exported to tests by Protractor, which is used for browser-level commands such as navigation with browser.get(). (To make it work with Non-AngularJs application, we should use browser.driver.get(). We will look more in detail in later tutorials)

Below is the sample Test file named 'first_spec.js'

describe('angularjs homepage', function() {
  it('should have a title', function() {
    browser.get('http://angularjs.org/');
    expect(browser.getTitle()).toContain('AngularJS');
  });
});
 browser.get('http://angularjs.org/');

- It loads the AngularJS homepage on your browser.

Expectations are built with the function expect() which takes a value, called the actual. This is just like an assertion. If it is true, then the spec will pass; otherwise, spec will fail.

For every expectation, there has to be an appropriate matcher to complete an assertion.

  expect(browser.getTitle()).toContain('AngularJS'); 

// Assert that the title of the home page has the expected value i.e. AngularJS.
The above simple test will navigate to an AngularJS home page and checks for its page title.

Below is the sample config file named 'first_conf.js'

exports.config = {
// An example configuration file.
exports.config = {
  directConnect: true,

  // Capabilities to be passed to the webdriver instance.
  capabilities: {
  'browserName': 'chrome',
},

  // Framework to use. Jasmine is recommended.
  framework: 'jasmine',

  // Spec patterns are relative to the current working directory when
  // protractor is called.
  specs: ['first_spec.js'],
};
}

If you have multiple tests, we can implement the same in Protractor by creating multiple specs files and add these two specs in conf file as below in specs parameter.

specs: ['first_spec.js', 'second_spec.js']

Sometimes, you may also want to ignore specs.. You can ignore single spec or multiple specs also using below :-

exclude : ['first_spec.js'] // to exclude single spec. 

How to run your first Protractor test???

Protractor can run your tests directly against Chrome and Firefox without using a Selenium Server. To use this, we have to set directConnect: true in config file.

However, at the moment of writing this tutorial, Protractor supports Chrome and Firefox browsers only. If you attempt to use a browser other than Chrome or Firefox an error will be thrown. If you need to run on other browsers you will have to set up Standalone Selenium Server.

As we have set directConnect: true in conf.js file, we don't have to start webdriver manager. If not, we should start the selenium server to run a protractor test. To start a server go to Node.js/windows command line and run Webdriver-manager start

Go to the command prompt, just type protractor first_conf.js, which will start executing your test in chrome browser. You can also change the browser using capabilities in first_conf.js file. We will look into more details in later tutorials.

Note: First you need to navigate to the location where you have your conf file and then execute. Or else just pass the complete path to protractor as protractor G:\path\conf.js

Protractor Selenium Start

The complete title is "AngularJS — Superheroic JavaScript MVW Framework". As we are trying to assert using 'toContain' which will return true. It is like 'contains' method.

Protractor first spec executed

In the same test file if we use 'toEqual' instead of 'toContain' test will result as failure. Please check the error in the below image

protractor first spec failed

In the above screen shot, if you observe, it is displaying a message as "Expected 'AngularJS — Superheroic JavaScript MVW Framework' to equal 'AngularJs'. It is trying to find the complete title and returns fail as we are expecting with partial text.

Protractor Tutorials: 

Comments

Hi ,

i am new to this tool. Your tutorial saved my time and its easy to use.

Thanks for sharing .

one update from my side ::

And also before executing the test, we should make sure that selenium server is running..
using below command.webdriver-manager start.

Thanks
GS

Hi,
Can you please tell me how we can save the console log messages in the text file or how can we show the log messages(steps that we are performing through script) in report.

Could you pls help me to how to do DB validation using protractor. Am new to this tool.
Can you give me a example

Hi,
Can you please tell me how to validate row wise and column wise in excels(xls,xlsx)formats by using protractor angular js

Add new comment