Testing Angularjs app with selenium

Question

I am testing angular js application

Angular js App Link

when I click on the UI Kit link in a web application, I get the following error:

on demoaj.Ajapp.main (Ajapp.java:16) Called: org.openqa.selenium.NoSuchElementException: Could not find element: {"method": "xpath", "selector": "html / body / div 1 / div 1 / aside / div / div / μl / Li [2] / a "} Duration or timeout of the command: 51 milliseconds. For documentation on this bug, please visit: http://seleniumhq.org/exceptions/no_such_element.html

I'm new to this, I did some research on this AngularJS

Java code

package demoaj; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.firefox.FirefoxDriver; import org.openqa.selenium.support.ui.ExpectedConditions; import org.openqa.selenium.support.ui.WebDriverWait; public class Ajapp { public static void main(String[] args) throws InterruptedException { WebDriver d=new FirefoxDriver(); d.manage().window().maximize(); d.get("http://iarouse.com/demo/index.html?product=square"); WebDriverWait wait = new WebDriverWait(d, 20); wait.until(ExpectedConditions.visibilityOfElementLocated(By.xpath("html/body/div[1]/div[1]/aside/div/div/ul/li[2]/a"))).click(); //d.findElement(By.xpath("html/body/div[1]/div[1]/aside/div/div/ul/li[2]/a")).click(); } } 

I think he cannot find the element, because in angularjs dom is not a rendering. when I check the source of the page, it does not display anything that hides all things after doing some research on testing angularjs. I have few questions, please help,

for angular application testing.

• Think I need to use a protractor? I think
• If I use protractor, do I need to write code in javascript or jquery?
• If I use protractor, can I write my code in java using eclipse ide or intellij?

Please, help,

Thanks in advance.

Answer 1

Here are some of the methods I use to test my AngularJS applications:

• Look at karma. It is very good and has good documentation. https://karma-runner.imtqy.com/0.8/plus/AngularJS.html
• If you are more familiar with end-to-end testing, use Protractor as it is proven to be better from time to time. https://angular.imtqy.com/protractor/#/

Answer 2

Here are your answers -

• Yes, for testing AngularJS you need to use Protractor, as it has built-in support for waiting for Angular to load.
• If you use Protractor, you need to write the code in JavaScript, not jquery.
• If you use Protractor, you cannot use Java because Protractor is built on top of Selenium WebDriverJS.

The advantage is that you can write Javascript code (which is easier than Java) to test your Angular application, and you don’t have to worry about how AngularJS works on your page. The only thing that can confuse you is to use promises , which is taken from WebdriverJS. Hope this helps.

Answer 3

I think angular displayed your element and selenium finds it, but it is not yet clickable. You can find out by getting some properties for the element (i.e. Text). The problem is that angular is not completed using $ http calls (and probably the $ digest loop). It seems that you can wait until angular is executed with pending $ http requests, and then find the element you need and call .Click () on it. Below is a snippet of working code that I use for our test project in C #.

  new WebDriverWait(driver, TimeSpan.FromSeconds(20)).Until(angularIsDoneLoading); //Add the rest of your code in here(like finding element, clicking on it etc.) Func<IWebDriver, bool> angularIsDoneLoading = (IWebDriver drv) => { string ngFinishedAllRequests = @"var injector = window.angular.element('body').injector(); var $http = injector.get('$http'); return ($http.pendingRequests.length === 0)"; return ((IJavaScriptExecutor)drv).ExecuteScript(ngFinishedAllRequests).ToString() == "True"; };