Rspec capybara webkit 找不到按钮标签

Question

我有以下测试

require "rails_helper"

RSpec.feature "Menu", :type => :feature do

 let!(:articles) { create_list(:article, 10) }
 let!(:quotes) { create_list(:quote, 2) }

 before { visit "/" }

 scenario "should not have Javascript errors" do
   Capybara.current_driver = :webkit

   page.find("#menu-button").click

   expect(page).not_to have_errors
 end

end

失败并显示消息

水豚::ElementNotFound: 无法找到 css“#menu-button”

我也试过了

click_on "Open Menu"

click_button "Open Menu"

click_link "Open Menu"

page.find_button(id: 'menu-button').click

find("#menu-button").click

我正在尝试测试 Foundation 6 的关闭 canvas 功能。

application.html.erb 文件

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title><%= content_for?(:title) ? yield(:title) : "Stargazers.news" %></title>

<%= stylesheet_link_tag    "application" %>
<%= javascript_include_tag "application", 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body>
<div class="off-canvas-wrapper">

  <div class="off-canvas position-left" id="offCanvas" data-off-canvas>
    <button class="close-button" arial-label="Close menu" type="button" data-close></button>

    <div id="search">
      <%= form_tag({controller: "/pages", action:"search"}, method: "get") do %>
        <%= label_tag(:search, "Search for:") %>
        <%= text_field_tag(:search) %>
        <%= submit_tag("Search") %>
      <% end %>
    </div>    
  </div>

  <div class="off-canvas-content" data-off-canvas-content>
    <div class="top-bar">
      <div class="top-bar-right">
        <button id="menu-button" type="button" class="button" data-toggle="offCanvas">Open Menu</button>
      </div>
    </div>

    <p class="notice"><%= notice %></p>
    <p class="alert"><%= alert %></p>

    <%= yield %>
  </div>

</div>
</body>
</html>

index.html.erb 文件

<div id="quote">
  <%= @quote.body %>
</div>

<% @articles.each do |article| %>
  <article>
    <header> <%= article.title%> </header>
    <div class="content-summary"> <%= article.body %> </div>
  </article>
  <hr/>
<% end %>

rails_helper.rb 文件

ENV['RAILS_ENV'] ||= 'test'
require File.expand_path('../../config/environment', __FILE__)

abort("The Rails environment is running in production mode!") if Rails.env.production?
require 'spec_helper'
require 'rspec/rails'
require 'capybara/rspec'
require 'simple_bdd/rspec'

ActiveRecord::Migration.maintain_test_schema!

RSpec.configure do |config|
  Capybara.javascript_driver = :webkit
  config.include FactoryGirl::Syntax::Methods

  config.include RSpecHtmlMatchers

  config.include Devise::Test::IntegrationHelpers, type: :feature

  config.use_transactional_fixtures = true

  config.before(:suite) do 
    DatabaseCleaner.strategy = :truncation
    DatabaseCleaner.clean_with(:truncation)
  end

  config.before(:each) do
    DatabaseCleaner.start 
  end

  config.after(:each) do
    DatabaseCleaner.clean
  end 

  config.infer_spec_type_from_file_location!
  config.filter_rails_from_backtrace!
end

Shoulda::Matchers.configure do |config|
  config.integrate do |with|
    with.test_framework :rspec
    with.library :rails
  end
end

宝石文件

source 'https://rubygems.org'

git_source(:github) do |repo_name|
  repo_name = "#{repo_name}/#{repo_name}" unless repo_name.include?("/")
  "https://github.com/#{repo_name}.git"
end

gem 'rails', '~> 5.0.1'
gem 'pg', '~> 0.18'
gem 'puma', '~> 3.0'
gem 'sass-rails', '~> 5.0'
gem 'foundation-rails'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.2'
gem 'jquery-rails'
gem 'turbolinks', '~> 5'
gem 'jbuilder', '~> 2.5'
gem "paperclip", "~> 5.0.0"
gem 'devise'

group :development, :test do
  gem 'byebug', platform: :mri
  gem 'factory_girl_rails'
  gem 'rspec-rails', '~> 3.5'
  gem 'rspec-html-matchers'
  gem 'ffaker'
  gem 'simple_bdd'
end

group :development do
  gem 'web-console', '>= 3.3.0'
  gem 'listen', '~> 3.0.5'
  gem 'spring'
  gem 'spring-watcher-listen', '~> 2.0.0'
  gem "better_errors"
end

group :test do
  gem 'capybara-webkit'
  gem 'database_cleaner'
  gem 'shoulda-matchers', '~> 3.1'
end

gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]

我的qt版本是5.5.1 我在 Ubuntu 16.04

Answer 1

尝试将 visible: false 添加到您的 find 调用中，如下所示：

page.find("#menu-button", visible: false).click

Answer 2

默认情况下，Capybara 不会找到不可见元素，并且 99% 的时间它无法与不可见元素交互。这是因为它旨在模拟用户行为，而用户无法与他们在页面上看不到的内容进行交互。

更新：既然您已经包含了整个测试，问题就更清楚了。在访问 '/' 发生之前，您不会将测试设置为使用 :webkit。这意味着 :racktest 驱动程序访问了该页面，但随后您切换到 :webkit 驱动程序，它实际上没有加载任何页面，因此那里什么也没有。与其在测试中手动设置 current_driver，不如使用 js: true（或 driver: :webkit）元数据

标记测试

scenario "should not have Javascript errors", js: true do
  ...
end

这将在访问发生之前将当前驱动程序设置为 Capybara.javascript_driver 的值（您已将其设置为 :webkit）。

此外，您的 database_cleaner 设置有点不足 - 它应该是建议的设置 - https://github.com/DatabaseCleaner/database_cleaner#rspec-with-capybara-example - 从之后到 append_after 的交换对于测试稳定性和检查驱动程序类型将有助于加快您的测试。

最后，如果您已经在使用 RSpec.feature

，则无需指定 :type => :feature

Rspec capybara webkit 找不到按钮标签

Rspec capybara webkit cant find button tag

rspec

ruby-on-rails

capybara

rspec-rails

capybara-webkit