如何使用水豚選擇器來正確選擇字段

Question

我有一個表格，允許我在一個表格中添加/編輯類別和子類別。這種形式使用AJAX並進行測試，我一直在用一些選擇器來使用Capybara。

問題是與選擇器似乎有微妙的差異，當我創建一個新的類別與子類別，當我編輯一個類別與子類別。

這是我創造的情景：

@javascript @wip 
    Scenario: Create new category with sub categories 
    Given I am on the new category page 
    When I fill in "Name" with "Main" within the parent fields 
    And I follow "Add sub category" 
    And I fill in "Name" with "Sub1" within the 1st sub category fields 
    And I follow "Add sub category" 
    And I fill in "Name" with "Sub2" within the 2nd sub category fields 
    And I follow "Add sub category" 
    And I fill in "Name" with "Sub3" within the 3rd sub category fields 
    And I press "Save" 
    Then I should be on the "Main" category page 
    And I should see "Main" 
    And I should see "Sub1" 
    And I should see "Sub2" 
    And I should see "Sub3" 

這適用於選擇：

when /the parent fields/ 
    "table tr:nth-child(1)" 

when /the (\d+)(?:st|nd|rd|th) sub category fields/ 
    pos = $1.to_i + 2 
    "table tr:nth-child(#{pos})" 

在形式：

= form_for @category do |f| 
    %table 
     %tr 
      %td= f.label :name 
      %td= f.text_field :name 

     %tr 
      %td(colspan=2) 
       %b Sub categories 

     - f.fields_for :children do |child| 
      = render "child_fields", :f => child 

     %tr 
      %td= link_to_add_fields "Add sub category", f, :children 
     %tr 
      %td= f.submit 'Save' 

child_fields部分：

%tr.subs 
    %td= f.label :name 
    %td= f.text_field :name 

當我在編輯場景中使用相同的選擇器時，我無法選擇第二個類別。這裏是我的編輯類功能：

@javascript @wip 
    Scenario: Edit category with sub categories 
    Given a category exists 
    And category "Books" has sub category "Fiction" 
    And category "Books" has sub category "Non-Fiction" 
    And I am on the edit page for category "Books" 
    When I fill in "Name" with "Cars" 
    And I fill in "Name" with "Coupe" within the 1st sub category fields 
    And I fill in "Name" with "Sports" within the 2nd sub category fields 
    And I press "Save" 
    Then I should be on the "Cars" category page 
    And I should see "Cars" 
    And I should see "Coupe" 
    And I should see "Sports" 

如果我將選擇更改爲：

when /the (\d+)(?:st|nd|rd|th) sub category fields/ 
    pos = $1.to_i * 2 + 1 
    "table tr:nth-child(#{pos})" 

然後它進行編輯，但沒有新的情況。

有沒有在我的情況下使用相同的選擇器爲新的&編輯方案？

我是否更好地在窗體上使用不同類型的選擇器？如果有的話，任何人有任何建議？

Answer 1

對唯一元素和重複元素上的​​類組合使用一個id。通過類和id選擇器的正確組合，你將永遠到達一個獨特的孩子。請記住，您可以將選擇器分組到一個元素上。

所以

給定一個類別存在

wait_for_xpath = '//element(@class = "categoryClass")' 

類和 「書」 有子類 「小說」

wait_for_xpath = "//element(contains (@class, 'categoryClass') and (@id, 'bookId'))//element(@id='fiction')" 

等