使用 Selenium 在 <p> 标记中的特定单词之前单击答案

【问题标题】：Click before a specific word within <p> tag using Selenium使用 Selenium 在 <p> 标记中的特定单词之前单击
【发布时间】：2016-07-26 06:59:34
【问题描述】：

我们正在使用 Selenium Webdriver 进行测试自动化。这是我的要求。

HTML 看起来像这样。

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

“p”标签中的文本可以有任意数量的行。我得到一个特定的单词作为测试输入，需要将光标放在该单词之前。

我尝试使用 Xpath 定位包含文本的元素，它返回整个段落并在段落中间单击（对于 chrome）。

谁能帮我实现这个目标？

【问题讨论】：

分享更多HTML代码

标签： javascript html selenium xpath

【解决方案1】：

在 JavaScript 中，您可以使用 document.elementFromPoint 指定坐标

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

在 C# 和 Java 中，您可以使用 Actions 类

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

【讨论】：

伙计，要找到
标签内文本的 x,y 坐标是个挑战。

【解决方案2】：

使用getSize函数，然后划分元素的高度和宽度，然后应用Action类点击方法，示例代码如下：

   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();

希望这会奏效！！

【讨论】：

【解决方案3】：

Selenium 没有直接处理文本节点的 API。但是，您可以使用一段 JavaScript 检索单词位置，并通过提供相对于包含文本的元素的偏移位置，使用 Actions 类单击前一个单词。

这是一个双击“Exchange”前面的单词“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();

【讨论】：