Test dynamically loaded content with Selenium Web Driver

Question

I am working on a system that has a web based frontend that I am testing with Selenium. On one page the content is dynamically loaded when scrolling down (maybe you know that from Facebook's friend-list), because it is one of the requirements.

Scrolling down with Selenium Webdriver (I use Chrome) should be no problem via Javascript. But there is a problem with the dynamically added content. How can I make the Webdriver find those elements?

I tried the following to scroll down until no more content is loaded:

int oldSize = 0;
int newSize = 0;
do {
  driver.executeScript("window.scrollTo(0,document.body.scrollHeight)");
  newSize = driver.findElementsBy(By.cssSelector("selector").size();
} while(newSize > oldSize);

But though the page scrolls down the first time and some now content is loaded correctly, they will not be found by the drivers' findElementsBy(By) function.

Has someone ever faced this problem?? I'd be very glad if someone could help me figuring a solution for that!

Regards, Benjamin

Answer 1

I would recommend using WebDriverWait with ExpectedConditons.

//scroll down with Javascript first
WebDriverWait wait = new WebDriverWait(driver, 30);
WebElement element = wait.until(ExpectedConditions.elementToBeClickable(By.cssSelector("selector")));
//interact with your element
element.click()

Take a look at the guidance provided by Selenium Official page: http://seleniumhq.org/docs/04_webdriver_advanced.html

Answer 2

try using fluent wait in particular. The main feature is:

An implementation of the Wait interface that may have its timeout and polling interval configured on the fly. Each FluentWait instance defines the maximum amount of time to wait for a condition, as well as the frequency with which to check the condition. Furthermore, the user may configure the wait to ignore specific types of exceptions whilst waiting, such as NoSuchElementExceptions when searching for an element on the page.

public WebElement fluentWait(final By locator){
        Wait<WebDriver> wait = new FluentWait<WebDriver>(driver)
                .withTimeout(30, TimeUnit.SECONDS)
                .pollingEvery(5, TimeUnit.SECONDS)
                .ignoring(NoSuchElementException.class);

        WebElement foo = wait.until(
new Function<WebDriver, WebElement>() {
            public WebElement apply(WebDriver driver) {
                        return driver.findElement(locator);
                }
                }
);
                           return  foo;              }     ;

The method described returns you web element you can operate with. So the approach be the following: 1) you need to find the selectors of elements you expect to be rendered after scrolling e.g.

String cssSelector = "blablabla"

2) scroll down with js 3)

WebElement neededElement  = fluentWait(cssSelector);
neededElement.click();
//neededElement.getText().trim();

you can get more info about fluent wait here