如何在Watir中选择带有标签文本的单选按钮？

Question

Watir上的备忘单和文档显示类似这样的内容以设置单选按钮

b.radio(:id => "radio").set

如何根据旁边的文本选择单选按钮？

有时，此文本在label标记内，有时在div / form标记内。 我们如何在Watir中处理呢？

（以下示例中CAPS中的标签文本）

范例1：

<form action="">
<input type="radio" value="male" name="sex"/>
MALE
<br/>
<input type="radio" value="female" name="sex"/>
FEMALE
</form>

范例2：

<div class="isoversixteen_false_container">
<input id="isoversixteen_false" class="radio" type="radio" value="0" name="isoversixteen" autocomplete="off"/>
<label class="isoversixteen_false_label" for="isoversixteen_false">
<span class="label_main">UNDER 16</span>
</label>
</div>
<div class="isoversixteen_true_container">
<input id="isoversixteen_true" class="radio" type="radio" value="1" name="isoversixteen" autocomplete="off" checked="checked"/>
<label class="isoversixteen_true_label" for="isoversixteen_true">
<span class="label_main">16 OR OVER</span>
</label>
</div>

Answer 1

Orde关于使用input元素的属性的评论是一个好主意，因为它最容易编程。 但是，要回答这个问题：

示例1-相邻文本节点

在此示例中，所需文本在相邻的文本节点中。 鉴于单选按钮共享同一父对象，我认为最简单的解决方案是使用XPath：

browser.radio(xpath: '//input[following-sibling::text()[1][normalize-space(.) = "MALE"]]').set
browser.radio(xpath: '//input[following-sibling::text()[1][normalize-space(.) = "FEMALE"]]').set

XPath说：

1. 找到一个输入元素
2. 以下文本节点-即[1]
3. 文字为“ MALE”或“ FEMALE”，忽略前导/后跟空格-即[normalize-space(.) = "FEMALE"]

示例2-标签文字

在此示例中，复选框具有正确关联的标签元素-即复选框的ID与标签的for属性匹配。 Watir支持通过:label locator通过其标签文本来定位元素：

browser.radio(label: 'UNDER 16').set
browser.radio(label: '16 OR OVER').set

示例-第一个后跟非空白文本节点

如果您想要一个适用于两个示例的解决方案，那么以下方法似乎可行：

browser.radio(xpath: '//input[following::text()[normalize-space(.) != ""][1][normalize-space(.) = "UNDER 16"]]').set
browser.radio(xpath: '//input[following::text()[normalize-space(.) != ""][1][normalize-space(.) = "16 OR OVER"]]').set
browser.radio(xpath: '//input[following::text()[normalize-space(.) != ""][1][normalize-space(.) = "MALE"]]').set
browser.radio(xpath: '//input[following::text()[normalize-space(.) != ""][1][normalize-space(.) = "FEMALE"]]').set

此处的目的是在复选框之后找到包含文本（ [normalize-space(.) != ""][1]部分）并且该文本与期望的文本（ [normalize-space(.) = "UNDER 16"部分）。

Answer 2

这是我的示例中的HTML结构：

<div class="radio-inline">
<label for="job_type">Second Type</label>
<input id="job_service" name="job" type="radio" value="remote">
</div>

通常我会选择它：

@browser.input(:value => 'remote').click

但是，根据您的问题，我尝试查看是否可以通过文本进行选择。 我发现这可行，但可能取决于嵌套在div中的标签。

@browser.label(:text => /Second Type/).click

“第二类型”的/周围是由于HTML中有些奇怪的换行符，可能只用引号引起来。