为什么Capybara / Rspec在Sweet Alert Modal中找不到按钮但have_selector返回true？答案

【问题标题】：Why Capybara / Rspec can't find the button in Sweet Alert Modal but have_selector return true?为什么Capybara / Rspec在Sweet Alert Modal中找不到按钮但have_selector返回true？
【发布时间】：2017-04-04 17:11:35
【问题描述】：

这是一个 Rspec 功能。

given (:send_selector){ 'button.confirm'}

feature "when talent has not applied." do
  given (:apply_button) { find('button[data-selector="offer-apply-button"]') }
  before(:each)         { visit offer_path(offer.id)                         }

  scenario "Talent applies to offer with default cv", js: true do
    apply_button.click
    expect(page).to have_selector(send_selector)
    find_button(send_selector).click
    wait_for_ajax
    # other expectations
  end
end

它通过了拥有选择器的期望，但随后它抛出了错误

 Capybara::ElementNotFound:
       Unable to find button "button.confirm"

用find_button(send_selector).click指向那一行

我也尝试过使用page.find_button(send_selector).click 和find_button(send_selector).trigger('click') 但第一个仍然抛出错误，第二个似乎什么都不做，因为负责该操作的控制器从未被调用，并且当我在下一行截屏时模态仍然存在。

我运行了 poltergeist 调试器，页面上出现了 html。

这是水豚看到的模态（使用save_screenshot()方法）

【问题讨论】：

标签： javascript ruby-on-rails rspec capybara poltergeist

【解决方案1】：

问题在于find_button 不采用 CSS 选择器 -http://www.rubydoc.info/gems/capybara/Capybara/Node/Finders#find_button-instance_method - 它采用按钮的名称、ID、标题或文本内容（与 click_button 和 'have_button' 采用相同） .

在您的回答中，sleep 1 与解决问题无关，它已得到修复，因为您从 find_button 切换到 find，这确实需要一个 CSS 选择器

【讨论】：

嗨，Thomas，你是对的，find_button 不采用 css 选择器。尽管如此，我这次在没有sleep 1 的情况下运行了我在答案中发布的测试并且失败了。
@juliangonzalez 如果是同样的错误，那么这可能意味着您需要将 Capybara.default_max_wait_time 增加几秒钟。但是，如果它是一个不同的错误（关于鼠标单击会碰到不同的元素），那是因为模态仍在动画中，您将需要睡眠或更好地禁用测试模式下的动画，这将加快您的测试和防止一些潜在的片状

【解决方案2】：

如果有人遇到同样的问题，在模态出现后添加一点睡眠就可以了。这种行为仍然很奇怪，因为期望说选择器已经在那里。甚至 have_selector(send_selector, visible: true).present? 也返回 true。

scenario "Talent applies to offer with default cv", js: true do
  apply_button.click
  expect(page).to have_selector(send_selector)
  sleep 1                                        <<--  THIS SOLVED THE PROBLEM
  find(send_selector).click
  wait_for_ajax
  ...
end

【讨论】：

【解决方案3】：

我在使用 sweetalert2 时也遇到了这个问题，我在功能规范中解决了这个问题，如下所示。（成功了）

scenario 'destroy a company', js: true do
    within('.shadow.company-info') do
        find('a[data-behavior="delete"]').click
        wait_for_ajax
        within(page.document.find(:css, '.swal2-buttonswrapper')) do
            find(:css, '.swal2-confirm').click
            wait_for_ajax
            expect(page.document).to have_content I18n.t('delete.success')
        end
    end
end

【讨论】：