如何通过 Selenium 识别特定的 Page Object 片段成员元素

Question

在我们的项目中，我们使用黄瓜运行了多个硒测试，这些测试正在测试特定组件。这些组件之一是两个标识符，我们称之为国家标识符和站点标识符。 这些具有以下 HTML：

<div class="identifiers">   
    <div class="country-identifier">
        <span class="ident-label">
            Germany
        </span>
    </div>
    <div class="site-identifier">
        <span class="ident-label">
            Gaming
        </span>
    </div>
</div>

现在我们的测试有两个模型，每个标识符一个：

@PageObject(css = "div.country-identifier")
@Named("CountryIdentifier")
@ScenarioScoped
public class CountryIdentifier {

    @Inject
    @CurrentScope
    private WebElement scope;

    @FindBy(className = "ident-label")
    @CacheLookup
    private WebElement label;

}

还有：

@PageObject(css = "div.site-identifier")
@Named("SiteIdentifier")
@ScenarioScoped
public class SiteIdentifier {

    @Inject
    @CurrentScope
    private WebElement scope;

    @FindBy(className = "ident-label")
    @CacheLookup
    private WebElement label;

}

现在的问题是，当我想访问站点标识符的标签时，WebElement 标签的值是 Germany 而不是 Gaming。这是因为获取值的 css 选择器显然只应用了类名 ident-label 而没有考虑容器类。我希望生成的用于查找标签的选择器会将为页面对象定义的 css 与 @FindBy 注释中的选择器结合起来。 有没有办法告诉 Web 驱动程序仅在 @PageObject 注释的 css 选择器中指定的容器范围内按类名查找元素？还是我需要 FindBy 注释中的完整 css 选择器，例如：

@FindBy(css = "div.site-identifier .ident-label")

还有

@FindBy(css = "div.country-identifier .ident-label")

Answer 1

看来你快到了。您可以使用以下定位器来识别相应的元素：

• Germany:

  @FindBy(css = "div.country-identifier span.ident-label")
  

• Gaming:

  @FindBy(css = "div.site-identifier span.ident-label")
  

---

更新

根据您询问的评论更新可以只指定“.ident-label”并使驱动程序仅在页面对象注释的 css 指定的容器内搜索，答案是否。这是因为class ident-label 出现在两个<div> 标签下，如下所示：

• Germany:

  <span class="ident-label">
      Germany
  </span>
  

• Gaming:

  <span class="ident-label">
       Gaming
  </span>
  

所以，WebDriver 实例无法区分它们，并且总是会根据流行的HTML DOM 选择第一个匹配项。

解决方案

有两种解决方法：

• 最简单的方法是借助父 <div> 标签，它的每个 child 标签都有不同的 class 属性。
• 否则使用index。

第一种方法是最好的方法，并且大多被遵循。