如何使用Capybara选择器正确选择字段

时间:2011-07-06 01:18:47

标签: ruby-on-rails-3 cucumber css-selectors capybara

我有一个表单,允许我在一个表单中添加/编辑类别和子类别。这个表单使用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 partial:

%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})" 

然后它适用于编辑但不适用于新场景。

有没有办法为新的和&在我的情况下编辑场景?

我最好在表单上使用不同类型的选择器吗?如果是,那么有人有任何建议吗?

1 个答案:

答案 0 :(得分:0)

在唯一元素上使用id,在重复元素上使用类组合。通过正确的课程和身份选择器组合,您将始终找到一个独特的孩子。请记住,您可以将选择器分组到一个元素上。

所以

鉴于存在类别

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

类别“书籍”有子类别“小说”

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