当动态生成CSS ID和名称时，从嵌套下拉菜单中选择水豚

Question

我正在尝试使用水豚从下拉列表中选择一个项目。

下拉列表是使用茧宝石生成的嵌套项目。 CSS ID和名称都是动态生成的。

页面源的复制/粘贴如下所示：

<div class="form-group select required protocol_step_items_orientation_id col-sm-3" title="Select an orientation for the plane of imaging." data-toggle="tooltip" data-placement="auto" data-delay="{"show":700,"hide":100}" data-animation="true">
<div class="col-sm-9">
<select id="protocol_step_items_attributes_1432720278702_orientation_id" class="select required form-control" name="protocol[step_items_attributes][1432720278702][orientation_id]">
<option value="">Orientation</option>
<option value="74">Axial</option>
<option value="75">Sagittal</option>
<option value="76">Coronal</option>
<option value="77">Sagital Oblique</option>
<option value="78">Coronal Oblique</option>
<option value="79">Axial Oblique</option>
</select>
</div>
</div>

我可以给水豚查找器提供什么语法以供选择：

<select id="protocol_step_items_attributes_1432720278702_orientation_id" class="select required form-control" name="protocol[step_items_attributes][1432720278702][orientation_id]">

编辑：这段代码生成选择框：

<div class="links" >
        <div class="row">               
      <%= link_to_add_association 'Add Imaging Step', f, :step_items, :wrap_object => Proc.new{|item| item=StepItem.new}, :class=>"btn btn-primary btn-xs add_imaging_step", title: "Click here to add an imaging step.", data: {toggle: "tooltip", placement: "right", animation: true, delay: {show: 700, hide: 100}}%>

  <%= link_to_add_association 'Add an Imaging Step List', f, :step_lists, :wrap_object => Proc.new{|item| item=StepList.new}, :class=>"btn btn-primary btn-xs",title: "Click here to add an imaging step list.", data: {toggle: "tooltip", placement: "right", animation: true, delay: {show: 700, hide: 100}}%>

  <%= link_to_add_association 'Add an Imaging Tip', f, :tips, :class=>"btn btn-primary btn-xs", title: "Click here to add an imaging tip.", data: {toggle: "tooltip", placement: "right", animation: true, delay: {show: 700, hide: 100}}%>

  <%= link_to_add_association 'Add an Image', f, :images, :class=>"btn btn-primary btn-xs", title: "Click here to add an image.", data: {toggle: "tooltip", placement: "right", animation: true, delay: {show: 700, hide: 100}}%>

  <%= link_to_add_association 'Add a Document', f, :documents, :class=>"btn btn-primary btn-xs", title: "Click here to add a document.", data: {toggle: "tooltip", placement: "right", animation: true, delay: {show: 700, hide: 100}}%>
    </div><!--row-->

EDIT2：我认为答案可能在这里：

使用rspec和capybara测试由茧动态添加的字段

或在这里：

从没有ID水豚的下拉列表中选择元素

...但是我似乎无法找出正确的语法来提供水豚查找器。

Answer 1

您可以为下拉菜单分配一个ID。 然后您可以通过ID选择元素。

以下链接告诉您如何通过ID选择元素。 http://www.rubydoc.info/github/jnicklas/capybara/Capybara/Node/Finders#find_by_id-instance_method

Answer 2

这有效：

  orientations=page.all('html body main form#new_protocol.simple_form.form-horizontal div.form-inline div#step_items.ui-sortable div div#step_lists div div#tips div div#images div div#documents div div.links div.nested-fields div.form-inputs.row div.form-group.select.required.protocol_step_items_orientation_id.col-sm-3 div.col-sm-9 select')
  orientations.first.select('Axial')

...但是感觉很脆。 有没有更好的办法？