当我使用 Button 方法时，'visible=>true' 没有找到可见按钮

Question

我正在使用下面的代码，希望它能找到可见按钮

element = @browser.button(text: 'Search', visible: true)

而且它没有找到可见按钮。但下面的代码定位可见按钮

element = @browser.element(xpath: "//button[text()='Search']", visible: true)

这是预期的吗？还是有问题？

HTML 代码

<button type="button" title="" data-uid="DSDL_U1" data-action="search" data-viewitemid="DSDL_U1_-1_L21" triggeredactionhandler="search" buttonprocesstarget="CUSTOMER_IND_QUICK_SEARCH_BY_ID_NAME" class="icon icon-detail-search" id="DSDL_U1_-1_L21_L_1_C" tabindex="10047">Search</button>

@贾斯汀

回答你的问题

@browser.buttons(text: 'Search').count

返回 6

@browser.buttons(text: 'Search', visible: true).count

返回 2

现在我检查了

@browser.buttons(text: 'Search', visible: true)[0].present?

返回真

但是如果我点击，那么它会返回

element click intercepted: Element <button tabindex="5" type="button" class="icon icon-detail-url" id="U1_-1_L5_L_1_C" style="outline: orangered solid 2px !important; background-color: rgb(255, 255, 255);">...</button> is not clickable at point (43, 258). Other element would receive the click: <div id="homePageSearch" class="searchGrpContainer homePageSearch populated" data-renderer="menu" data-headertype="button" data-style="tree" data-zone="overlay">...</div>
  (Session info: chrome=89.0.4389.90)

但是如果写

@browser.buttons(text: 'Search',visible: true)[1].present?

这返回真，但如果触发点击，那么它点击。

你问我两个元素的html

@browser.buttons(text: 'Search',visible: true)[0].html

返回

<button tabindex="5" type="button" class="icon icon-detail-url" id="U1_-1_L5_L_1_C" style="outline: orangered solid 2px !important; background-color: rgb(255, 255, 255);"><span>Search</span></button>

第二个元素

@browser.buttons(text: 'Search',visible: true)[1].html

返回

<button type="button" title="" data-uid="DSDL_U1" data-action="search" data-viewitemid="DSDL_U1_-1_L21" triggeredactionhandler="search" buttonprocesstarget="CUSTOMER_IND_QSEARCH_PARTYID_ALTCUSTID" class="icon icon-detail-search" id="DSDL_U1_-1_L21_L_5_C" tabindex="10047">Search</button>

当我点击第一个搜索按钮时，它会在同一个 html 中打开另一个窗口，在那个新窗口中，另一个搜索按钮在那里，所以它匹配第一个搜索按钮（我点击打开）和第二个搜索按钮是在我即将点击的新窗口中。但程序检测到两个搜索按钮可见。

Answer 1

你最终有两个问题：

• XPath 如何处理文本
• Selenium 如何确定可见/显示的内容

XPath 如何处理文本

文本定位的差异归结为 dot 与 text() 的 XPath 差异。您可以在其他问题中看到解释 - 例如XPath: difference between dot and text()。简单地说：

• 点：匹配所有直接和后代文本节点的串联
• text()：仅匹配元素的单个直接文本节点

对于 Watir 定位器：

@browser.button(text: 'Search', visible: true)                      # this uses dot
@browser.element(xpath: "//button[text()='Search']", visible: true) # this uses text()

对于<button><span>Search</span></button>，它具有“搜索”的连接文本，但只有“”和“”的直接文本节点。这就是为什么 Watir 使用 :text 定位器来定位它，而不是在将 :xpath 定位器与 text() 一起使用时定位它。

相比之下，<button>Search</search> 具有“搜索”的连接文本和“搜索”的直接文本节点。因此，它会被两个 Watir 定位器匹配。

Selenium 如何确定可见/显示的内容

Selenium 将被另一个元素覆盖的元素视为正在显示，这意味着 Watir 认为它存在。例如，对话框覆盖下的元素仍将被视为对用户可见。您的两个按钮都被视为可见。

没有一个 Watir 定位器可以区分被其他元素覆盖（遮挡）的元素。但是，您可以手动执行此操作：

@browser.buttons(text: 'Search', visible: true).find { |btn| !btn.obscured? }

解决方案

鉴于 2 个按钮的 HTML，我认为最好的方法是使用不同的属性实际定位按钮。 “triggeredactionhandler”似乎是独一无二的：

@browser.button(triggeredactionhandler: 'search')