Sunday, June 5, 2016

Create and run test with Protractor

Protractor interacts with your application in a real browser. You will be able to automate the functionality of your application by using Protractor. Generally Protractor uses Jasmine framework as it's testing interface. Now we will learn how to write and run test by using Protractor. For this purpose we will use this simple todo angular application :  http://mahmudulhasan.github.io/ToDoAngular/








 
Write test : 
  • Create a project folder and give it a name.
  • Create a folder name "src" inside your project folder.
  • Create a file named basicTest_spec.js
  • Copy this code into the file
 describe('Basic protractor test', function() {  
      it('Page should have a textbox and a button', function() {  
           // Load demo angular site  
           browser.get('http://mahmudulhasan.github.io/ToDoAngular/');  
           // Check that todo textbox and Add New button is present  
           expect(element(by.id('todotask')).isPresent()).toBe(true);  
           expect(element(by.id('addtodotask')).isPresent()).toBe(true);  
      });  
 });  

Here describe meant a test suite and it meant a test case. Then by browser.get() function we can load a url in the browser. Then expect is used to check that certain conditions are met. 

Configuration : 

  • Create a file name conf.js inside main project folder.
  • Copy this code into the file.


 exports.config = {  
  seleniumAddress: 'http://localhost:4444/wd/hub',  
  specs: ['./src/basicTest_spec.js']
 };  

Here seleniumAddress is the address of selenium server and specs shows where your test files are.

Run Test : 


Start selenium server in the command line/terminal with

 webdriver-manager start  


Then open another instance of command line/terminal and run 
 protractor conf.js  

Now it will open a chrome browser as chrome is default for Protractor. Then it will perform test and show out put like :
 [07:52:32] I/hosted - Using the selenium server at http://localhost:4444/wd/hub  
 [07:52:32] I/launcher - Running 1 instances of WebDriver  
 Started  
 .  
 1 spec, 0 failures  
 Finished in 2.794 seconds  
 [07:52:38] I/launcher - 0 instance(s) of WebDriver still running  
 [07:52:38] I/launcher - chrome #01 passed  

Now lets add another test case where it will add a new todo task. Then it will check that todo task count is increased by 1.
 it('Should add a todo task in the todo list',function() {  
           var todoTextBox = element(by.id('todotask'));  
           var addNewButton = element(by.id('addtodotask'));  
           // All the list item   
           var todoList = element.all(by.repeater('x in todoList'));  
           var numOfListItem = null;  
           // Count list item then add another todo task list item no will increase by 1  
           todoList.count().then(function(result) {  
                console.log(result);   
                numOfListItem = result;  
                // Add another todo task  
                todoTextBox.sendKeys("Second todo task");  
                addNewButton.click();  
                expect(todoList.count()).toEqual(numOfListItem+1);  
           });  
      });  
 
The next test case will remove all the todo task from todo list.
 it('Should remove all the task in todo list', function() {  
           var removeTaskButton = element(by.css('button'));  
           // All the list item   
           var todoList = element.all(by.repeater('x in todoList'));  
           todoList.count().then(function(result) {  
                for(var i=0;i<result;i++) {  
                     todoList.get(i).element(by.model('x.done')).click();  
                }  
                removeTaskButton.click();  
                expect(todoList.count()).toEqual(0);  
           });  
      });  
This is all for now. Full code is uploaded in github : https://github.com/MahmudulHasan/AutomateTodoProtractor

Thanks for your patience. Next post will be about Taking screenshot of failed test cases with Protractor.

~~ Let us be kind and help others in need. Let us make this world a better place.
"Peace begins with a smile." - Mother Teresa ~~  

No comments:

Post a Comment