webdriver - org.openqa.selenium.NoSuchElementException: no such element

Question

Running Selenium WebDriver 2.37.1

I'm receiving an intermittent problem when running a test and receive the following error:

org.openqa.selenium.NoSuchElementException: no such element

Sometimes the test will pass, most of the time it will fail. Below is the stacktrace:

org.openqa.selenium.NoSuchElementException: no such element  
(Session info: chrome=31.0.1650.57)
(Driver info:
chromedriver=2.6.232923,platform=Windows NT 6.1 SP1 x86_64) 
(WARNING:
The server did not provide any stacktrace information) 
Command duration or timeout: 10.04 seconds 
For documentation on this error, please visit:
http://seleniumhq.org/exceptions/no_such_element.html 
Build info:
version: '2.34.0', revision:
'11cd0ef93615408e0b6b3bfa28defe125906461a', time: '2013-08-06
11:43:14' 
System info: os.name: 'Windows 7', os.arch: 'amd64',
os.version: '6.1', java.version: '1.7.0_45' 
Session ID:
2375dca8adea8bb6962b0c87861cdd59 
Driver info:
org.openqa.selenium.chrome.ChromeDriver 
Capabilities

And below is my code to execute the test:

@Test
public void loginPage(){

    chrome.get("http://thisisafakeurl.com");
    //entering username
    WebElement usernameField = chrome.findElement(By.cssSelector("input[type='text'][id='usernameInput']"));
        usernameField.sendKeys("fakeusername");
    //entering password
    WebElement passwordField = chrome.findElement(By.cssSelector("input[id='passwordInput']"));
        passwordField.sendKeys("fakepassword");
    //clicking submit button
    chrome.findElement(By.cssSelector("input#loginBtn.rightButton")).click();

    chrome.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);

    //asserting a css selector. Not really needed. Just thrown in to learn.
   // WebElement blankProjectLocator = chrome.findElement(By.cssSelector("li.iconGridItem[data-id='5']"));
   // Assert.assertEquals("5", blankProjectLocator.getAttribute("data-id"));

    //Clicking the Blank Project button

    Actions actions = new Actions(chrome);
    WebElement item1 = chrome.findElement(By.xpath("//*[@id="templateGrid"]/li[2]/img[1]"));
    WebElement item2 = chrome.findElement(By.xpath("//*[@id="templateGrid"]/li[2]/img[2]"));
    WebElement item3 = chrome.findElement(By.xpath("//*[@id="templateGrid"]/li[2]/header/span"));
    WebElement item4 = chrome.findElement(By.xpath("//*[@id="templateGrid"]/li[2]"));

    actions.moveToElement(item4)
           .moveToElement(item1)
           .moveToElement(item2)
           .moveToElement(item3)
           .click().build().perform();

    chrome.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);





    //Dragging the Click Area component onto the canvas
    WebElement listContainer = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div"));
    WebElement componentList = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul"));
    WebElement clickArea = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[1]"));
    WebElement arrowHead = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[1]/div[1]"));
    WebElement imageHolderClickArea = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[1]/div[1]/div"));
    WebElement componentNameClickArea = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[1]/div[2]"));


    WebElement canvas = chrome.findElement(By.xpath("//*[@id="page-c3"]"));

    actions.moveToElement(listContainer)
           .moveToElement(componentList)
           .clickAndHold(clickArea)
           .moveToElement(arrowHead)
           .moveToElement(imageHolderClickArea)
           .moveToElement(componentNameClickArea)
           .moveToElement(canvas)
           .release().perform();

    chrome.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);






    //Dragging the close button onto the canvas

    WebElement listContainerClose = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div"));
    WebElement componentListClose = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul"));
    WebElement closeButton = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[2]"));
    WebElement componentThumb = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[2]/div[1]"));
    WebElement imageHolderCloseButton = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[2]/div[1]/div"));
    WebElement componentNameCloseButton = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[2]/div[2]"));

    WebElement canvas1 = chrome.findElement(By.xpath("//*[@id="page-c3"]"));

    actions.clickAndHold(closeButton)
            .moveToElement(listContainerClose)
            .moveToElement(componentListClose)
            .moveToElement(componentThumb)
            .moveToElement(imageHolderCloseButton)
            .moveToElement(componentNameCloseButton)
            .moveToElement(canvas1)
            .release().perform();

    //WebElement xAxisClose = chrome.findElement(By.xpath("//*[@id="c358"]"));
    //xAxisClose.clear();
    //xAxisClose.sendKeys("240");

    //WebElement yAxisClose = chrome.findElement(By.xpath("//*[@id="c359"]"));
    //yAxisClose.clear();
    //yAxisClose.sendKeys("5");






    //Dragging the video component onto the canvas

    WebElement listContainerVideo = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div"));
    WebElement componentListVideo = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul"));
    WebElement videoComponent = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[3]"));
    WebElement componentThumbVideo = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[3]/div[1]"));
    WebElement componentNameVideo = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[3]/div[2]"));

    WebElement canvas2 = chrome.findElement(By.xpath("//*[@id="page-c3"]"));

    actions.clickAndHold(videoComponent)
            .moveToElement(listContainerVideo)
            .moveToElement(componentListVideo)
            .moveToElement(componentThumbVideo)
            .moveToElement(componentNameVideo)
            .moveToElement(canvas2)
            .release().perform();


    chrome.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);






    //Dragging the Text component onto the canvas

    WebElement listContainerText = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div"));
    WebElement componentListText = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul"));
    WebElement textComponent = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[4]"));
    WebElement componentThumbText = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[4]/div[1]"));
    WebElement componentNameText = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div/ul/li[4]/div[2]"));

    WebElement canvas3 = chrome.findElement(By.xpath("//*[@id="page-c3"]"));

    actions.clickAndHold(textComponent)
            .moveToElement(listContainerText)
            .moveToElement(componentListText)
            .moveToElement(componentThumbText)
            .moveToElement(componentNameText)
            .moveToElement(canvas3)
            .release().perform();

The clickable link in the stacktrace points me to the following line of code:

 WebElement listContainer = chrome.findElement(By.xpath("//*[@id="componentsDiv"]/div/div/div"));

So before the test is able to click the Blank Project button.

From my investigations it appears I could be experiencing some synchronization issues as it's intermittent. Do I need to wrap a try/catch exception instead of a timeout wait? Or am I placing these at incorrect places in my code?

Can anyone help or suggest where I may be going wrong?

Answer 1

As Yuvaraj HK has mentioned ,using implicit wait just once in your code would be enough.It'l implicitly wait for every element that you try to find in your code.

chrome.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);

But try to keep implicit wait time as low as possible, because this might increase your code execution time..

In some cases the element might take more than 30 seconds to be visible, Explicit wait can be used in these kind of situations.

WebDriverWait some_element = new WebDriverWait(driver,100); 
some_element.until(ExpectedConditions.visibilityOfElementLocated(By.id("id_of_some_element")));
//do anything you want with some_element

I strongly suggest using cssSelectors over xpath. This article might help.
Even if xpath is used, try using shorter ones. Using an id is not the only way to reach an element. Its parent might have unique class names or other attributes, which you can use to create efficient xpaths or cssSelectors.