looking for help with handling div overlays in selenium

[Amanda Fernandes]

Hi,

I am in the process of learning Selenium WebDriver and an attempting to automate test cases for the website http://www.automationpractice.com. The test case I trying to automate is

1.Go to website on chrome.

2.Mouseover first item in popular list

3.Click on Add to Cart button that appears on mouseover

4.transfer control to popup that appears

5.verify product added message

6.click on Continue Shopping button in popup

7.transfer control to main page.

I have been successful upto step 3. I have tried several ways to implement step 4 unsuccessfully.

This is the code I have tried

package com.automatoinpractice.tests;

import java.util.Iterator;

import java.util.List;

import java.util.Set;

//import java.io.FileInputStream;

//import java.io.IOException;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.Alert;

import org.openqa.selenium.By;

import org.openqa.selenium.JavascriptExecutor;

import org.openqa.selenium.NoSuchElementException;

import org.openqa.selenium.StaleElementReferenceException;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.WebElement;

import org.openqa.selenium.chrome.ChromeDriver;

//import org.openqa.selenium.firefox.FirefoxDriver;

import org.openqa.selenium.interactions.Actions;

import org.testng.Assert;

import org.testng.annotations.BeforeClass;

import org.testng.annotations.Test;

//import com.automatoinpractice.resources.Base;

public class AddItemtoShoppingCart{

WebDriver driver=null;

@BeforeClass

public void initializeDriver() {

System.setProperty("webdriver.chrome.driver","/Users/admin/selenium/chromedriver");

driver= new ChromeDriver();

String url = "http://www.automationpractice.com";

driver.get(url);

driver.manage().window().maximize();

//set implicit wait time to 10 secs

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

}

@Test

  public void canBuy() {

 Actions a = new Actions(driver);

 WebElement featuredItem = driver.findElement(By.cssSelector("ul#homefeatured > li:nth-of-type(1)"));

 //featuredItem.click();

 a.moveToElement(featuredItem).build().perform();

 driver.findElement(By.linkText("Add to cart")).click();

 String str="Product successfully added to your shopping cart";

   

 //driver.findElement(By.cssSelector("#layer_cart>div>div.layer_cart_product>h2"))

 //new Actions(driver).click(driver.findElement(By.cssSelector("div#layer_cart"))).build().perform();

 driver.switchTo().activeElement();

// driver.findElement(By.cssSelector(".continue.btn.btn-default.button.exclusive-medium")).click();

 //driver.findElement(By.cssSelector("div.layer_cart_cart>div.button-container>span.continue")).click();

 //driver.findElement(By.xpath("//*[contains(text(),'Continue shopping')]")).click();

 //driver.findElement(By.cssSelector("#layer_cart > div.clearfix > div.layer_cart_cart.col-xs-12.col-md-6 > div.button-container > span > span")).click();

 //WebElement prodMsg =driver.findElement(By.cssSelector("div#layer_cart>div>div.layer_cart_product>h2"));

 //System.out.println(prodMsg.getText());

 //Assert.assertTrue(prodMsg.getText().contains(str));

   

 try {

// driver.switchTo().defaultContent();

// driver.switchTo().frame(driver.findElement(By.id("layer_cart")));

 WebElement continueBtn = driver.findElement(By.cssSelector(".continue.btn.btn-default.button.exclusive-medium>span"));

 myJSClick(continueBtn);

} catch (Exception e) {

// TODO Auto-generated catch block

e.printStackTrace();

}

  }

public void myJSClick(WebElement element) throws Exception {

try {

if (element.isEnabled() && element.isDisplayed()) {

((JavascriptExecutor) driver).executeScript("arguments[0].click();", element);

} else {

System.out.println("Unable to click on element");

}

} catch (StaleElementReferenceException e) {

System.out.println("Element is not attached to the page document "+ e.getStackTrace());

} catch (NoSuchElementException e) {

System.out.println("Element was not found in DOM "+ e.getStackTrace());

} catch (Exception e) {

System.out.println("Unable to click on element "+ e.getStackTrace());

}

}

Any help would be appreciated. Thanks

Amanda

[darrell grainger]

You should not need to use Actions unless you really have to. If you find an element and click it, e.g. driver.findElement(...).click(), then you don't have to move to the element first. So your commented out line:

featuredItem.click();

should work. If it is not working then something else might be wrong. A common problem with WebDriver automation is that you have to make sure that your bindings (the jar files for selenium), the browser driver (chromedriver) and the browser installed on your machine all match. If there is a mismatch, weird things happen (like clicking elements doesn't work... sometimes). So it is a good habit to post the version of bindings, the language you are using (obviously Java in this case), the version of chromedriver and the version of browser installed on your computer. Frequently, your browser automatically updates but you are still using old versions of chromedriver and the bindings.

Another common mistake (and I think this might be your problem) is we find the wrong element and click it. You are finding an LI and trying to click it. Typically, you do not click LI elements. You can add javascript bindings to an element using things like onclick attribute. In which case clicking an LI would work. When I look at the DOM however, I see underneath the LI is an A element. So maybe you want to click the A. In this case the CSS Selector is finding the wrong element. You might want to use "ul#homefeatured>li:nth-of-type(1) a.product_img_link". This will click in the middle of the featured item, which will be the Quick View link. 

If you don't want the Quick View and you want to transition to the full product page then I'd use the CSS locator "ul#homefeatured>li:nth-of-type(1) a.product-name". This will click the "Faded Short Sleeve T-shirts" text and drill down to the full product detail page.

If you do want to click on the main image but you don't want to click in the center (and the Quick View link) then you would have to use Actions to specify an x,y coordinate for your click, e.g.

WebElement featuredItem = driver.findElement(By.cssSelector("ul#homefeatured>li:nth-of-type(1) a.product_img_link"));

Actions a = new Actions(driver);

a.moveToElement(featuredItem, 1, 1).click().perform();

This will click on position (1, 1) and avoid clicking the "Quick View" box in the center of the image.

Darrell