css - capybara /CSS : How to find an input field by label AND value?

Question

我需要在 Capybara/RSpec 中填写一个输入字段。

<div class="form-group control_center_operators_name">    
  <label class="control-label"  
         for="control_center_operators_attributes_1477562669357_name">
    Name
  </label>       
  <input class="form-control"
       type="text" value=""          
       name="control_center[operators_attributes][1477562669357][name]" 
       id="control_center_operators_attributes_1477562669357_name" />
</div>

我的问题是，有更多这样的字段，用户可以在其中编辑现有的运算符。例如

<div class="form-group control_center_operators_name">    
  <label class="control-label"  
         for="control_center_operators_attributes_0_name">
    Name
  </label>
  <input class="form-control" 
         type="text" value="ABC"          
         name="control_center[operators_attributes][0][name]" 
         id="control_center_operators_attributes_0_name" />
</div>

我对这个领域的了解:

• 它被标记为“姓名”
• 它的值为“”(空)

更多限制:

• 此集合中共有 4 个字段(姓名、电话、电子邮件、主页)，这意味着我不能只使用带有 value='' 的字段，因为有 4 个输入匹配此查询的字段。
• 如您所见，我无法使用 id 和 name 属性。

如何使用 Capybara/CSS 填充空的姓名、电话、电子邮件和主页字段？

Answer 1

capybara 查找字段的方法是#find_field。您也可以使用 :with 选项按值过滤

find_field('Name', with: '').set('new value to set')

请注意，它将匹配元素的当前值属性，如果字段的值在页面加载后已更改，则该属性可能与值属性不同。另一种选择是将范围限定到一个包装器元素，该元素将使该字段成为唯一，然后在该元素内进行查找。例如，如果这些字段集中的每一个都在一个带有运算符类的 div 中，并且您想在最后一个运算符集中填写名称，您可以这样做

all('.operator', minimum: 1).last.fill_in('Name', with: 'new value to set')

更新:从 Capybara 3 开始，all 默认情况下具有等待行为，因此不需要 minimum 选项

all('.operator').last.fill_in('Name', with: 'new value to set')