硒|无法定位输入元素

Question

不知道如何使用 selenium / Java 来处理此输入文本字段元素（openjdk 11 2018-09-25）。

我尝试了 xpath、cssSelector 等，但它从来没有工作过。它总是“无法找到元素”。

<slot name="input">
   <input part="value" tabindex="0" aria-labelledby="vaadin-text-field-input-3">
</slot>

这不起作用：

driver.findElement(By.xpath("//input[@aria-labelledby='vaadin-text-field-input-3']")).sendKeys("test");

有解决方案吗？

更新：

该线程部分解决了我的问题。对我有用的解决方案可以在此处找到链接。

Answer 1

要将字符序列发送到元素，您需要为elementToBeClickable()，您可以使用以下任一方法定位策略：

• css_selector：

new WebDriverWait(driver, 20)
    .until(ExpectedConditions.elementToBeClickable(
          By.cssSelector("div.vaadin-text-field-container div[part=input-field][id^='vaadin-text-field-input'] slot[name='input'] > input[part='value'][aria-labelledby^='vaadin-text-field-input']")
    )).sendKeys("pixelhead");

• xpath：

new WebDriverWait(driver, 20)
   .until(ExpectedConditions.elementToBeClickable(
      By.xpath("//div[@class='vaadin-text-field-container']//div[@part='input-field' and starts-with(@id, 'vaadin-text-field-input')]//slot[@name='input']/input[@part='value' and starts-with(@aria-labelledby, 'vaadin-text-field-input')]")
   )).sendKeys("pixelhead");

Answer 2

Xpath：

//div[@class='vaadin-text-field-container']//descendant::input[@part='value' and starts-with(@aria-labelledby, 'vaadin-text-field-input')]

请检查开发工具（Google chrome）我们在HTML DOM中是否有唯一条目。

检查步骤：

在 Chrome 中按 F12 ->转到 element 部分 ->执行 CTRL + F ->然后粘贴xpath并查看您所需的元素是否通过1/1匹配节点突出显示。

如果这是唯一的 //div[@class='vaadin-text-field-container']//descendant::input[@part='value' andstarts-with(@aria-labelledby, 'vaadin- text-field-input')] 那么您还需要检查以下条件。

1. 检查它是否在任何 iframe/frame/frameset 中。

   解决方案：先切换到 iframe/frame/frameset，然后与此 Web 元素交互。

2. 检查它是否在任何 shadow-root 中。

   解决方案：使用driver.execute_script('return document.querySelector)返回一个Web元素，然后进行相应的操作。

3. 在交互之前确保该元素正确渲染加上一些硬编码延迟或显式等待，然后重试。

   解决方案： time.sleep(5) 或

   WebDriverWait(driver, 20).until(EC.visibility_of_element_ located((By.XPATH, "//div[@class='vaadin-text-field-container']//descendant::input[@部分='值'并开始于（@aria-labelledby， 'vaadin-text-field-input')]"))).send_keys("测试")

4. 如果您已重定向到新选项卡/或新窗口并且您尚未切换到特定的新选项卡/新窗口，否则您可能会遇到NoSuchElement异常。

   解决方案：先切换到相关窗口/选项卡。

5. 如果您已切换到 iframe 并且新的所需元素不在同一 iframe 上下文中，则首先切换到默认内容，然后与其交互。

   解决方案：切换到默认内容，然后切换到相应的 iframe。

可以从step1开始调试。

更新：

特定问题的解决方案：

Thread.sleep(2000);
WebElement inputButton = (WebElement) ((JavascriptExecutor)driver).executeScript("return document.querySelector('#TextFieldTitle').shadowRoot.querySelector('#vaadin-text-field-input-3 > slot:nth-child(2) > input')");
inputButton.sendKeys("test");

在在此处粘贴查询选择器的位置，您必须按 F12 再次转到 goog chrome 中的开发工具，然后

1. 转到那个输入框
2. 右键
3. 选择复制
4. 选择复制JS路径。
5. 按 Ctrl + v 进入记事本以查看从开发工具中获得的内容。

它会是这样的：

document.querySelector("#vaadin-text-field-input-3 > slot:nth-child(2) > input")

用 "" 中包装的内容替换此 在此处粘贴查询选择器

Answer 3

根据提供的 html，这有效：

driver.find_element(By.XPATH, "//input[@part='value' and contains(@aria-labelledby, 'vaadin-text-field-input')]" ]

x = WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.XPATH, "//input[@part='value' and contains(@aria-labelledby, 'vaadin-text-field-input')]")))
x.send_keys('This is typed here by selenium')
print(f"the typed text in input box is: {x.get_attribute('value')}")

输出：

the typed text in input box is: This is typed here by selenium

Process finished with exit code 0

Answer 4

看起来 HTML 的一部分如下所示：

<div class="vaadin-text-field-container">
    <label part="label" id="vaadin-text-field-label-3"></label>
    <div part="input-field" id="vaadin-text-field-input-3">
        <slot name="prefix"></slot>
        <slot name="input">
            <input part="value" tabindex="0" aria-labelledby="vaadin-text-field-input-3">
        </slot>
    </div>
</div>

更好的是从某个 id 字段构建 XPATH 定位器：

//div[@id='vaadin-text-field-input-3']//input[contains(@aria-labelledby, 'vaadin-text-field-input')]"]

另外，如前所述必须检查：

• 该页面是否唯一
• 如果input 元素不是动态的，则

如果您发现该注释已解决，您可以移至代码部分并使用 WebDriver 建立的定位器：

driver.findElement(
     By.xpath("//div[@id='vaadin-text-field-input-3']//input[contains(@aria-labelledby, 'vaadin-text-field-input-3')]"]"
)).sendKeys("test");

另外，请记住你必须知道那个元素正如之前所建议的，您可以使用一些 显式等待 为您的元素。