Geb：用于多元素导航器的 Web 元素定位器
Posted
技术标签:
【中文标题】Geb：用于多元素导航器的 Web 元素定位器【英文标题】：Geb: Web element locator for multi element navigator 【发布时间】：2021-05-13 16:25:34 【问题描述】：我有一个 html 页面，其中包含一个名为 Student 的元素，它有多个行，如下所示：
Student: Foo Bar
Class X
Section A
我能够使用这样的 XPath 定位 Student 元素：//b[contains(text(),'Student')] 但我想使用 jquery 选择器提取相同的东西并使用 jquery 选择器提取它的子元素，如 Foo Bar, Class X and Section A
我尝试了以下类似的方法，但没有成功：
student(wait: true) $('b', text: contains('Student:')).parent().parent()
这是 html 的外观：
<tr>
<td colspan="2" align="left" class="SubSectionTitle" style=""><b style=""> Student Information</b></td>
</tr>
<tr>
<td valign="top" class="Label" rowspan="3"><b style="">Student:</b></td>
<td style="">Foo Bar</td>
</tr>
<tr>
<td>Class X</td>
</tr>
<tr>
<td>Section A</td>
</tr>
【问题讨论】：
您的要求不清楚，因为您没有添加测试，所以我看不到您要检查的条件。您关于 XPath 与 CSS 选择器的零碎信息也无济于事，两者甚至相互矛盾：一个搜索“Student”而没有尾随冒号，另一个搜索“Student：”，但试图向上导航 DOM 元素嵌套层次结构。您没有明确说明您要选择哪个元素。小节标题？其他表行之一（哪一个）？所有行？如果我只知道哪个问题，我可能可以回答每个问题。 我希望对我的回答提供一些反馈，以结束这个仍然列为未回答的问题。谢谢你。我随后会删除此评论。 【参考方案1】：由于您的问题不清楚，我向您展示几个选项：
HTML 页面src/test/resources/page-q66129162.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<body>
<table>
<tr>
<td colspan="2" align="left" class="SubSectionTitle" style=""><b style=""> Student Information</b>
</td>
</tr>
<tr>
<td valign="top" class="Label" rowspan="3"><b style="">Student:</b></td>
<td style="">Foo Bar</td>
</tr>
<tr>
<td>Class X</td>
</tr>
<tr>
<td>Section A</td>
</tr>
</table>
</body>
</html>
Geb 测试：
package de.scrum_master.***.q66129162
import geb.spock.GebSpec
import org.openqa.selenium.By
class MultiElementNavigatorIT extends GebSpec
static url = this.getResource("/page-q66129162.html").toString()
def test()
given:
go url
when:
def xp = $(By.xpath("//b[contains(text(),'Student:')][1]"))
then:
xp.text() == "Student:"
xp.parent().text() == "Student:"
xp.parent().parent().text() == "Student: Foo Bar"
xp.parent().parent().parent().text() == " Student Information\nStudent: Foo Bar\nClass X\nSection A"
when:
def nav = $('b', text: contains('Student:'))
then:
nav.text() == "Student:"
nav.parent().text() == "Student:"
nav.parent().parent().text() == "Student: Foo Bar"
nav.parent().parent().parent().text() == " Student Information\nStudent: Foo Bar\nClass X\nSection A"
或者如果你喜欢它更紧凑一点：
package de.scrum_master.***.q66129162
import geb.spock.GebSpec
import org.openqa.selenium.By
import spock.lang.Unroll
class MultiElementNavigatorIT extends GebSpec
static url = this.getResource("/page-q66129162.html").toString()
@Unroll
def "select by #selectorType"()
given:
go url
def selector = selectorClosure()
expect:
selector.text() == "Student:"
selector.parent().text() == "Student:"
selector.parent().parent().text() == "Student: Foo Bar"
selector.parent().parent().parent().text() == " Student Information\nStudent: Foo Bar\nClass X\nSection A"
where:
selectorType | selectorClosure
"XPath" | $(By.xpath("//b[contains(text(),'Student:')][1]"))
"CSS" | $('b', text: contains('Student:'))
如果您的问题是如何从多元素导航器中进行选择，您可以使用myNavigator.first() 或myNavigator[0] 之类的内容。
【讨论】：
以上是关于Geb：用于多元素导航器的 Web 元素定位器的主要内容，如果未能解决你的问题，请参考以下文章
Selenium 3----定位一组元素+多表单切换+多窗口切换
Web前端面试指导(十四)：如何居中一个元素（正常绝对定位浮动元素）?
Web前端面试指导(十四)：如何居中一个元素（正常绝对定位浮动元素）?