Click in front of a specific word in the <p> tag using Selenium

Question

We use Selenium Webdriver to automate testing. Here is my requirement.

HTML is as follows.

<p> I need to click before this. Help me achieve this </p> 

The text in the p tag can have any number of lines. I get a specific word as test input and I need to place the cursor in front of that word.

I tried to find the element using Xpath containing the text, it returns the whole paragraph and clicks in the middle of the paragraph (for chrome).

Can someone help me how can I achieve this?

Answer 1

In JavaScript, you can specify coordinates using document.elementFromPoint

 document.elementFromPoint(x, y).click(); 

In C # and Java you can use Actions class

 WebElement element = driver.findElement(By...); Actions actions = new Actions(driver); actions.moveToElement(element).moveByOffset(dx, dy).click().perform(); 

Answer 2

Use the getSize function, and then divide the height and width of the element, then apply the click method of the Action class, here is an example code:

  WebElement el = driver.findElement(By.xpath("//xpath")); Dimension location = el.getSize(); int y = location.height/2; int x = location.width/2; Actions build = new Actions(driver); build.moveToElement(el, x, y).click().build().perform(); 

Hope it works!

Answer 3

Selenium does not have an API for interacting directly with node text. However, you can get the position of a word using a JavaScript snippet and click the previous word using the Actions class, indicating the position of the offset relative to the element containing the text.

This is an example that double-clicks the word in front of “Exchange,” which is “Stack”:

 // script to get the relative position/size of a word in an element final String JS_GET_WORD_RECT = "var ele=arguments[0], word=arguments[1], rg=document.createRange(); " + "for(var c=ele.firstChild, i; c; c=c.nextSibling){ " + " if(c.nodeType != 3 || (i=c.nodeValue.indexOf(word)) < 0) continue; " + " rg.setStart(c, i); rg.setEnd(c, i + word.length); " + " var r = ele.getBoundingClientRect(), rr = rg.getClientRects()[0]; " + " return { left: (rr.left-r.left) | 0, top: (rr.top-r.top) | 0, " + " width: rr.width | 0, height: rr.height | 0 }; " + "};"; WebDriver driver = new ChromeDriver(); JavascriptExecutor js = (JavascriptExecutor)driver; // load the page driver.get("http://stackexchange.com/legal/content-policy"); // get the text element WebElement element = driver.findElement(By.cssSelector(".sectionheader > h2:nth-child(1)")); // get the relative position/size {left, top, width, height} for the word "Exchange" Map rect = (Map)js.executeScript(JS_GET_WORD_RECT, element, "Exchange"); // define a relative ckick point for the previous word "Stack" Long offset_x = (long)rect.get("left") - (long)rect.get("width") / 2; Long offset_y = (long)rect.get("top") + (long)rect.get("height") / 2; // double click the word "Stack" new Actions(driver) .moveToElement(element, offset_x.intValue(), offset_y.intValue()) .doubleClick() .perform(); driver.quit();