如何使用 Capybara Rails 与 Bootstrap Popover 交互？

Question

我正在尝试测试按下按钮是否会向数据库中插入一条新记录 (Rails 5b3)

该按钮位于 bootstrap 弹出窗口中，它运行的功能运行良好。但是，当我尝试对其进行测试时，我似乎无法定位该元素。

默认情况下，弹出窗口的内容不在 DOM 上，它是通过单击按钮插入和删除的。这是 Bootstrap v4

中的默认行为

这是我的测试 gem 设置：

  gem "rails-controller-testing", :git => "https://github.com/rails/rails-controller-testing"
  gem 'launchy'
  gem 'poltergeist'
  gem 'rspec', '~> 3.5.0.beta1'
  gem 'rspec-core', '~> 3.5.0.beta1'
  gem 'rspec-rails', '~> 3.5.0.beta1'
  gem 'guard-rspec', '~> 4.6', require: false
  gem 'capybara'
  gem 'factory_girl_rails'

这是我要定位的弹出窗口插入的相关 HTML：

<button data-js-method="createblock" class='btn btn-secondary btn-block'>Heading</button>

这是我的测试：

scenario 'Popover#Heading' do
  before_count = HeadingBlock.count
  # This clicks the button to activate the popover
  find('.btn-add-block').click

  # The line below is what I'm trying to target
  # click_button('Heading') yields 'Unable to find button "Heading"'
  find('button [data-js-method="createblock"]').click
  after_count = HeadingBlock.count

  expect(after_count - before_count).to eq(1)
end

最后报错：

Capybara::ElementNotFound:
       Unable to find css "button [data-js-method=\"createblock\"]"

Answer 1

在 CSS 选择器中，space 表示查找后代，但您要匹配按钮元素的属性。所以应该是

find('button[data-js-method="createblock"]').click #no space between button and [data-....

我不确定为什么 click_button('Heading') 对你不起作用，因为你没有指出尝试时遇到的错误。

接下来是点击按钮可能需要一些时间来处理的问题，因此立即获取计数可能会不稳定。您应该使用 expect(page).to have_selector('whatever selector', count: before_count+1) 以便水豚 waiting/retry 行为可以为您工作——我不知道该选择器应该是什么，因为我不知道 HeadingBlock 被定义为.

如何使用 Capybara Rails 与 Bootstrap Popover 交互？

How to interact with Bootstrap Popover using Capybara Rails?

testing

ruby-on-rails

capybara

twitter-bootstrap

ruby-on-rails-5