NoSuchElementException with unknown cause using Selenium - selenium

Question

While writing selenium testcases for a webapplication I'm having trouble with the xpath selector. The element of the HTML-code which should be clicked on by Selenium is the following:
<a title="Voeg een vak toe" href="#" onclick="javascript:$.colorbox({width:818,href:'/olo-cleanjump/profiel/addVakForm'}); return false;">
<p class="add">
<img class="add-icon" src="/olo-cleanjump/static/images/icon_add.png"/>
Voeg vak toe
</p>
</a>
The Selenium IDE plugin for firefox gives me the following selenium code for this:
driver.findElement(By.cssSelector("p.add")).click();
The addVakForm javascript function that is called by this link opens a colorbox with the following HTML (I shortened it, there are around 30 similar div's with class "lesboek_popup") inside:
<div id="cboxLoadedContent" style="display: block; width: 776px; overflow: auto; height: 653px;">
<div id="profielpagina_add">
<h2>Voeg een vak toe aan je profiel</h2>
<div class="lesboek_popup">
<a class="content" href="/olo-cleanjump/profiel/addvak/120776">
<img src="" alt="">
</a>
<p class="caption">
Engels
</p>
</div>
<div class="lesboek_popup">
<a class="content" href="/olo-cleanjump/profiel/addvak/120786">
<img src="" alt="">
</a>
<p class="caption">
Biologie
</p>
</div>
</div>
For the test I want to open the 'Biologie' link. Selenium IDE got me the following selenium code to do this
driver.findElement(By.xpath("//div[#id='profielpagina_add']/div[20]/a")).click();
to select this biology link element.
Based on this I wrote the following testcase:
Test
public void testAddRemoveVak() throws Exception {
this.get("");
// vak 1 toevoegen
driver.findElement(By.cssSelector("p.add")).click();
driver.findElement(By.xpath("//div[#id='profielpagina_add']/div[20]/a")).click();
// vak 2 toevoegen
driver.findElement(By.cssSelector("p.add")).click();
driver.findElement(By.xpath("//div[#id='profielpagina_add']/div[20]/a")).click();
assertEquals(driver.findElements(By.xpath("//li[#class='vak']")).size(), 2);
// vak 2 verwijderen
this.get("profiel/removevak/120791");
assertEquals(driver.findElements(By.xpath("//li[#class='vak']")).size(), 1);
}
The part
driver.findElement(By.cssSelector("p.add")).click();
actually was successful, so after this call the colorbox should be loaded. However the
driver.findElement(By.xpath("//div[#id='profielpagina_add']/div[20]/a")).click();
causes an NoSuchElementException, while this element definitely is present in the colorbox when I check for myself (the call/xpath was even autogenerated by Selenium IDE). Does anyone have a clue what may cause the NoSuchElementException?

Answer 1

Probably you should wait when your popup appears. Try to use Implicit waits
WebDriver driver = new FirefoxDriver();
driver.Manage().Timeouts().ImplicitlyWait(TimeSpan.FromSeconds(10));
Also instead of xpath you can use driver.FindElement(By.LinkText("Biologie")).click() if it the only link with text Biologie on your page