Robot Framework - Can't click on div / span - React generated web page

Question

I have react generated web page which has this kind of structure:

div
 ...
   div
   div
     div class=x_1
       <span randomtag=y> text1 </span>
     div class=x
       <span randomtag=z> text2 </span>
     div class=x
       <span randomtag=q> text3 </span>
   div
   div
   div
 ...
div

I am trying to click on the randomtag=z. I have tried:

xpath:

I can find the randomtag y's div with just tossing in the structure up to the div (no other identificators) with .../div[2]/div[1]
I can NOT get the second div with xpath (.../div[2]/div[1] works but .../div[2]/div[2] does not work)

css:

The following is not working either

css=div > span[randomtag="z"]
css=div.x span[randomtag="z"]

I am a bit lost with the possibilities here to select the correct element.

The Robot code is just basic wait until element is visible | locator (whatever it is) eg.

wait until element is visible     css=div.x span[randomtag="z"]
wait until element is visible     xpath=<previous path here>/div[2]/div[2]

Any ideas? Is the react reason for this?

I get "Element not visible in x seconds". For timeout I have tried 5-30 seconds.

EDIT:

I also tried to find the xpath with the search tool (behind dev tools on browser) and it finds the element when I insert either the xpath or css locator to the search.

what you want to achieve here? are you trying to identify div of randomtag = 'y' with element z? — Paras
I am trying to get Robot to locate either the div (parent of randomtag=z) or the span itself (randomtag=z). The ultimate goal is to get robot to locate the element to be able to click it with "click element" command. — Porris
//span[@randomtag='z']/.. it will give you the parent div of randomtag = z — Paras
Yeah. That works to find the element on web page, but Robot does not recognize it. I am still getting the "element not visible in x seconds" error. If I put it on the developer tools search on the web page (behind f12), it is found ok, but I cannot get robot to locate that. — Porris

Sanja Paskova Sanja Paskova · Accepted Answer · 2016-09-09T14:35:12

public static void waitUntilElementIsVisible(WebElement element, WebDriver driver) 
{        
    FluentWait<WebDriver> wait = new FluentWait<WebDriver>(driver);
    wait.pollingEvery(250,  TimeUnit.MILLISECONDS);
    wait.withTimeout(2, TimeUnit.MINUTES);
    wait.ignoring(ElementNotVisibleException.class); //make sure that this exception is ignored
    Function<WebDriver, WebElement> function = new Function<WebDriver, WebElement>()
            {
                public WebElement apply(WebDriver driver) {
                    System.out.println("Checking for the element!!");                       
                    if(element.isDisplayed() != true)
                    {
                        System.out.println("Target element is not visible");
                    }
                    return element;
                }
            };

    wait.until(function);
}

then call this:

WebDriver el = driver.FindElement(By.css("yourcss"));
waitUntilElementIsVisible(el, driver);

Robot Framework - Can't click on div / span - React generated web page

1 Answers