7

我已经四处搜索,但找不到这样做的方法。

我们在 EmberJS/Rails 应用程序的黄瓜功能中使用 Poltergeist 驱动程序运行 Capybara 测试。我无法使用 page.driver.debug,因为我在无头 vagrant 实例中运行,因此我无法进行故障排除,但屏幕截图有效,并且在相关页面上检查的 Chrome 开发工具显示了正确的元素。

我有一个失败的黄瓜场景,这是因为查找不起作用。我的测试如下所示:

When(/^I delete description "(.*?)"$/) do |description|
  within :css, '#myform' do
    first('label', :text => /#{description}/).find(:xpath, '..').find(:css, 'button.delete')
  end
end

它找不到有问题的元素。这是 DOM 的相关部分:

<form id="myform">
  <div class="row-fluid question">
      <div class="span12">
        <div class="padding">
          <div id="ember576" class="ember-view is-viewing-edit-controls">
            <button class="delete" data-ember-action="31"></button>
            <button class="edit" data-ember-action="32"></button>
            <button class="insert_above" data-ember-action="33"></button>
            <button class="insert_below" data-ember-action="34"></button>
            <button class="move_up" data-ember-action="35"></button>
            <button class="move_down" data-ember-action="36"></button>
            <label class="question" data-ember-action="37">Enter your first name</label>
            <input id="ember577" class="ember-view ember-text-field">
            <span class="error"></span>
          </div>
        </div>
    </div>
  </div>
</form>

如果我添加一个 binding.pry,这个:

first('label', :text => /#{description}/).find(:xpath, '..')
                                                                                              │

给我这个回应:

=> #<Capybara::Element tag="div">

和这个:

first('label', :text => /#{description}/).find(:xpath, '..')
                                                                                              │

给我这个回应:

=> "Enter your first name"

但完整的发现:

first('label', :text => /#{description}/).find(:xpath, '..').find(:css, 'button.delete')

给我这个回应:

Capybara::ElementNotFound: Unable to find css "button.delete"

我有一种感觉,这是一个父母/兄弟姐妹的问题,但我无法解决它。所以我想我有几个问题:

  1. 对于调试,是否有一个 poltergeist 驱动程序来列出所有子元素?
  2. 我的 xpath 选择器有问题吗?..返回的事实Capybara::Element tag="div"使我认为我有正确的父元素(就像我说的,它在其他类似测试中的其他页面上也可以使用),但我无法验证它是哪个元素。我找不到如何获取 xpath 或其他任何可以帮助我识别元素的方法。
4

2 回答 2

2

我想通了。测试工作正常,但我在我的场景中缺少一个操作步骤。

然而,我想你们可能会发现知道我最终是如何获得内容的有用:在页面上执行 jQuery。我在测试中添加了 binding.pry,然后在 binding.pry 控制台中记录了一个 jQuery 结果,例如:

# this gave me the expected contents and verified that button.delete was a child
page.execute_script("console.log($('#myform label.question').parent().html())");

# and this gave me the classes to demonstrate that it was the correct div
page.execute_script("console.log($('#myform label.question').parent().attr('class'))");

我选择了选择器的捷径,因为我知道我要查找的标签是第一个标签,但是选择器并不重要,它是在 binding.pry 中使用 jQuery 的 console.log() 的想法很有用。

于 2013-09-05T14:43:30.043 回答
1

为仍在寻找的其他人尝试的东西:尝试使用first(:xpath, './/..')而不是find(:xpath, '..').

find假设表单的 id 属性是静态的,为了更好的性能和防止模棱两可的匹配,尽可能减少范围也是一个好主意:

within('#myform') do
  find('label', text: "#{description}", match: :first). 
  first(:xpath, './/..').
  find('button.delete').
  click
end
于 2017-03-27T21:51:50.337 回答