Protractor Test cases

Question

I am new to protractor e2e testing. and i have written my first test code.. I would like to know your feedback and ways i can improve it.

  describe("Map feedback Automation",function(){
it("Check if the Url works ",function()
{
    browser.get(browser.params.url);
    expect(browser.getCurrentUrl()).toContain("report");

});it("test browser should reach report road option",function()
{
    element.all(by.css('div[ng-click="setLocation(\'report_road\')"]')).click();
    expect(browser.getCurrentUrl()).toContain("report_road");

});


it("test browser should reach report road missing",function()
{
    element.all(by.css('div[ ng-click="mapFeedBack.editObject= mapFeedBack.createMapObjectModel();setLocation(mapFeedBack.noMap?\'road_new\':\'choose_location_road_new/road_new\')"]')).click();
    expect(browser.getCurrentUrl()).toContain("choose_location_road_new/road_new");
    browser.sleep(browser.params.sleeptime);
});


it("test browser should zoom on map ",function() //manual 
{


element.all(by.css('div[ng-click="zoomIn()"]')).click();            
browser.sleep(browser.params.sleeptime);
element.all(by.css('div[ng-click="zoomIn()"]')).click();
browser.sleep(browser.params.sleeptime);


element.all(by.css('div[ng-click="zoomIn()"]')).click();
browser.sleep(browser.params.sleeptime);

element.all(by.css('div[ng-click="zoomIn()"]')).click();
browser.sleep(browser.params.sleeptime);


}); 

it("Should click on ok option",function()
{

    element(by.buttonText('OK')).click();
    expect(browser.getCurrentUrl()).toContain("road_new");

}); 
it("test browser should reach report road option",function()
{

    browser.sleep(browser.params.sleeptime);
    expect(browser.getCurrentUrl()).toContain("road_new");

}); 



it("should  enter a road name",function() 
{       

 browser.sleep(browser.params.sleeptime);

 var testroadname = browser.params.testroadname;


 element(by.model("mapFeedBack.editObject.roadName")).sendKeys(testroadname);
browser.sleep(browser.params.sleeptime);




});


    it("should check the type of road is highway",function()  //spec3
{

element(by.model("mapFeedBack.editObject[attrs.select].selected")).$("[value='string:app.road.roadType.highway']").click();




});


    it("should  submmit the map feedback",function() 
{       

element(by.css('button[ng-click="onSubmit({reportType: reportType})"]')).click();
    browser.sleep(browser.params.sleeptime);
});});

A colleague of mine told me to remove the delay

browser.sleep(browser.params.sleeptime);

and add some event when the zoom in button is clicked. can you suggest me the ways i can achieve it?

Answer 1

As they say, every code has it's own smell. One the worst smells produced by Protractor-specific code is the use of browser.sleep() to tackle timing issues. browser.sleep() calls usually are making the tests much slower than it is needed and occasionally don't add enough of a delay to make a test pass making the author of the code increase the sleep delay which again makes a test even more slower. And, by the way, there is a related third-party ESLint rule that would help to prevent you from having browser.sleep() in the e2e codebase.

A more robust alternative to having a hardcode delay, is to use browser.wait() and a set of built-in Expected Conditions. The main advantage here is that browser.wait() would wait as long as it is necessary continuously checking the state of the expected condition.

For example, in your case, you might make the world a better place to do test automation by using elementToBeClickable condition:

var EC = protractor.ExpectedConditions;
var elm = element(by.id("myid"));

browser.wait(EC.elementToBeClickable(elm), 10000);
elm.click();

Here, Protractor would wait up to (up to is really what makes the difference) 10 seconds (yes, you still need a timeout value) and would raise a Timeout Exception if the element would not become clickable.

Answer 2

You can also wait for the button to be visible using the following wait command:

var btn = element(by.css("mycss"));
browser.driver.wait(protractor.until.elementIsVisible(btn), 5000);
btn.click();

Visibility means that the element is not only displayed but also has a height and width that is greater than 0.