Selenium webDriver to test AngularJS applications

AngularJS controls are becoming more popular these days due to it’s flexibility of use, less coding, allows single page applications and many more which a developer know much better than us (us as  testers :P)…

So with the changing in technology and the way controls are used. as a tester, we also need to upgrade our skills and way of testing the applications…

in AngularJS controls, we are getting some extra html attributes like ng-model, ng-repeater, ng-controller etc, these are not included as locators in selenium.
if any controls have only these attributes are set, we can’t find the elements with selenium,
There is an alternative given to selenium, Protractor which is built on top of selenium to handle the above mentioned attributes, but we do not have an protractor setup for selenium with Java, only protractor for .net is there…

So the workaround to selenium java for Angulas JS aplications is to use the xpath (or CSS Selector) as locator when we are using raw selenium for angularJS controls.

xpath / CSS Selector simply searched for the elements with the tags and attributes irrespective of what technology used to build the site…




while automating angular sites, we need to only take care of identifying the elements which is different than regular web elemenets.., rest automation stuff like framework, reportings are as usual…

let’s see a sample code for testing angularJS controls with raw selenium for Java…

Short link – bit.ly/qav-selangularJS

Content posted is based on learning or working experience, please leave comments if anything needs to be added or updated, discuss your queries on our facebook:qavalidation.com, Thanks!

4 Responses

  1. Anonymous says:

    Thanks for this sample code. It gave me a working to solution on how to work with AngularJS applications. I would have hated to learn Protractor with Jasmine. Personally, I am not a fan of either. Great work.

  2. xuyen says:

    Thanks for your article. I knew it working with Angular Js on how to work.

  3. Rahul says:

    I am trying to find the value which appears in text box and element using angular js attributes. Value which is apepearing in text box is neither available as any arrtibute value netiher we can fetch it using getText(); as value is not available there. If id would have been given as attributed i would have used
    WebDriver driver = DriverFactory.getDriver();

    public String getTextAt(String cssId) {
    if (driver instanceof JavascriptExecutor) {
    JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
    return (String) javascriptExecutor.executeScript(“return documenet.getElementById(‘” + cssId + “‘).value;”);
    }
    return null;
    }
    This is working fine in the case where id is given but in my case even id is not given. Please suggest what can be used.

    Here is the view of HTML/Angular JS

  4. Serge A. says:

    Try this:

    WebElement control=driver.findElement(By.id(“some_id”));
    control.getAttribute(“value”);

Leave a Reply

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

%d bloggers like this: