rspec - 时序问题的不可靠/片状Capybara/AngularJS集成测试

Question

如何使这些测试可靠地通过？

当前，这些测试是flakey。
有时他们过去了。有时他们失败了。
下面是显示此问题的设置，代码和输出。
解决这个问题的建议将不胜感激，我相信会帮助很多其他人，所以请发表评论!

测试代码环境

Rails 3.2

RSpec 2.x的

水豚

Poltergeist

PhantomJS

AngularJS

Google Chrome版本47.0.2526.106(64位)

从Gemfile.lock测试宝石

capybara (2.1.0)
database_cleaner (0.7.1)
debug_inspector (0.0.2)
guard-bundler (0.1.3)
guard-livereload (1.2.0)
guard-rspec (2.1.2)
jasminerice (0.0.10)
pg (0.17.1)
phantomjs (2.1.1.0)
poltergeist (1.4.1)
protractor-rails (0.0.17)
pry (0.9.12)
rack (1.4.7)
rack-test (0.6.3)
rails (3.2.21)
rails-assets-angular (1.3.20)
rspec-rails (2.11.4)
simplecov (0.8.2)
sprockets (2.2.3)
zeus (0.13.3)
zeus-parallel_tests (0.2.1)

我尝试过的事情

确保我使用水豚等待中的DSL匹配器

确保我的数据库清理程序正确设置

测试每个页面项目，并假设它可能不在页面上并且仍然可以加载

缩小不一致的测试

单独运行不一致的测试

识别引起测试结果不一致的代码水豚DSL。

，即创建新记录并假设页面已重定向，并且该记录在页面上click_on

要么

.click不一致地“工作”为

将Capybara升级到最新版本(在单独的分支中)

将Poltergeist和RSpec升级到最新版本(在单独的分支中，仍在进行此操作)

我使用的资源

[1] Capybara The DSL
[2] Capybara, PhantomJs, Poltergeist, and Rspec Tips
还有很多...

测试如何进行
rspec spec/integration/costings/show_costing_spec.rb --format documentation
测试代码

show_costing_spec.rb

require "spec_helper"

RSpec.describe "Show a new costing in the listing," do

  before :each do
    admin_sign_in
    create_costing("test1")
  end

  it "shows the costing after creation" do
    within "#costings_table" do
      expect(page).to have_css("#name", text: "test1")
    end
  end

  it "shows the details of the new costing after creation" do
    expect(page).to have_content("Costings")
    within "#costings_table" do
      expect(page).to have_content("test1")
      all("#show").last.click
    end

    expect(page).to have_content("Costing Details")
    expect(page).to have_css("#name", text: "test1")
  end
end  

spec_helper.rb

# This file is copied to spec/ when you run 'rails generate r spec:install'  
ENV["RAILS_ENV"] ||= 'test'
require File.expand_path("../../config/environment", __FILE__)
# Add library functions here so we can test them.
require File.expand_path(File.dirname(__FILE__) + "/../lib/general")
require 'rspec/rails'
require 'rspec/autorun'

# Integration Testing
require 'capybara/poltergeist'
Capybara.register_driver :poltergeist_debug do |app|
 Capybara::Poltergeist::Driver.new(app, :inspector => true)  
end
Capybara.javascript_driver = :poltergeist_debug
Capybara.default_driver = :poltergeist_debug

# Capybara Integration Test Helpers
def admin_sign_in
  visit "/login"
  #Create staff member in database
  Staff.make!(:admin)
  #Log In
  fill_in "staff_username", with: "adminstaff"
  fill_in "staff_password", with: "password"
  click_button "login"
end

def create_costing(item)
  visit "/api#/costings"
  click_on "new_btn"
  within "#form_costing" do
    find("#name", match: :first).set("#{item}")
    find("#description", match: :first).set("test description")    
    find("#from_date", match: :first).set("15/02/2016")
    find("#cost_hourly_cents", match: :first).set("1.00")
    click_on "create_btn"
  end
end

RSpec.configure do |config|
  config.before(:suite) do
    # Requires supporting ruby files with custom matchers and macros, etc,
    # in spec/support/ and its subdirectories.
    require File.expand_path(File.dirname(__FILE__) + "/support/blueprints")
    Dir[Rails.root.join("spec/support/**/*.rb")].each {|f| require f}
  end

  # Remove this line if you're not using ActiveRecord or ActiveRecord fixtures
  config.fixture_path = "#{::Rails.root}/spec/fixtures"

  # Allow a 'focus' tag so that we can run just a few tests which we are currently working on
  config.treat_symbols_as_metadata_keys_with_true_values = true
  config.filter_run focus: true
  config.run_all_when_everything_filtered = true
  config.filter_run_excluding :slow unless ENV["SLOW_SPECS"]

  # Defer Garbage Collection
  config.before(:all) { DeferredGarbageCollection.start }
  config.after(:all)  { DeferredGarbageCollection.reconsider }

  # If you're not using ActiveRecord, or you'd prefer not to run each of your
  # examples within a transaction, remove the following line or assign false
  # instead of true.
  config.use_transactional_fixtures = false
  # config.infer_spec_type_from_file_location!

  # Configure Database Cleaner
  config.include Capybara::DSL
  config.before(:suite) do
    DatabaseCleaner.clean_with(:truncation)
  end

  config.before(:each) do
    DatabaseCleaner.strategy = :transaction
  end

  config.before(:each, :js => true) do
    DatabaseCleaner.strategy = :truncation
  end

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

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

检测结果
Test Run 1: Failing
运行选项:
包括{:focus => true}
排除{:slow => true}

所有的例子都被过滤掉了。忽略{:focus => true}

在清单中显示新的成本核算，
显示创建后的成本核算
显示创建后新成本核算的详细信息(失败-1)

失败:

1)在清单中显示新的成本核算，
显示创建后新成本核算的详细信息
失败/错误:expect(page).to have_content(“test1”)
预期#has_content？(“test1”)返回true，得到false
＃./spec/integration/costings/show_costing_spec.rb:20:在(共3级)中
＃./spec/integration/costings/show_costing_spec.rb:19:in块(2个级别)中

在5.46秒内完成
2例，1例失败
Test Run 2: Passing
运行选项:
包括{:focus => true}
排除{:slow => true}

所有的例子都被过滤掉了。忽略{:focus => true}

在清单中显示新的成本核算，
显示创建后的成本核算
显示创建后新成本核算的详细信息

在3.57秒内完成
2个示例，0个失败

更新1

将测试gem升级到以下版本:
水豚(2.6.2)来自(2.1.0)
数据库清洁程序(1.5.1)来自(0.7.1)
debug_inspector(0.0.2)
守卫捆绑兵(0.1.3)
守卫传递负载(1.2.0)
警卫规范(2.1.2)
茉莉(0.0.10)
pg(0.17.1)
phantomjs(2.1.1.0)
(1.9.0)来自(1.4.1)
量角器(0.0.17)
从(0.9.12)撬(0.10.3)
机架(1.4.7)
机架测试(0.6.3)
导轨(3.2.21)
rails-assets-angle(1.4.9)来自(1.3.20)
rspec-rails(3.4.2)来自(2.11.4)
simplecov(0.8.2)
链轮(2.2.3)
宙斯(0.13.3)
zeus-parallel_tests(0.2.1)
Result 1
不幸的是，升级这些宝石似乎没有什么作用，而且我的测试仍然是胡扯。

更新2

我实现了汤姆·沃尔波尔的建议。确保我的admin_sign_in等待登录完成。

还按照Tom的建议更新了我的database_cleaner设置。
Result 2
对于我的堆栈，这些更改似乎没有效果。

注意:如果不使用AngularJS，我认为这些更改会有所作为。因此，谢谢汤姆的建议。

更新3

我需要获得有关测试运行期间发生的情况的更多信息。在网上有记录日志，使用节省屏幕快照的宝石之类的建议，但我不认为这些方法最省时。我想指定要在哪里暂停测试并查看变量和表单字段的内容。在浏览器中将是理想的。

我使用了什么
我正在使用“save_and_open_page”和“print page.html”进行调试。

我搬到了
当我运行RSpec 3.4.2时，我添加了一个调试帮助器方法:

rails_helper.rb

def debugit
  puts current_url
  require 'pry'
  binding.pry
end

Result 3
URL将被打印在控制台中，并且测试将被暂停。在这个阶段，我将能够导航到URL，登录，导航到测试页面并查看Capybara测试的内容。

这使我能够确定在使用水豚的fill_in DSL进行测试时出现问题的根源。
在某些测试运行中，将正确填充字段并提交表单。
在其他情况下，可以正确填写表单，但是单击提交按钮的速度太快。此处的结果是创建了一条记录，但名称和描述的输入字段未保留。

更新4

我发现，因为我使用的是AngularJS输入表单和表格，所以AngularJS需要一点时间来绑定到输入字段。如果这次不允许，则不会保存输入数据。

水豚提供等待方法，例如“内”和“查找”。我使用了这些，但是它们并没有解决AngularJS绑定时间问题。
我发现ng-if可以用来创建if语句，以等待特定的项目，这表示AngularJS与表单字段的绑定已完成。

因此，我使用Capybara等待方法来等待要填充的字段，并且使用了AngularJS的ng-if直到它们准备好才显示它们。

实现
index.html.erb

<div  ng-if="tableParams.data">
  <table id="costings_table ng-table="tableParams" class="table">
    <td id="field1">{{table.field1}}</td>
    <td id="field2">{{table.field2}}</td>
  </table>
</div>

Result 4
测试终于通过!但是我有所有这些带有xpath的查找方法，可确保等待特定且难以定位的项目...

更新5

即使在我的gemfile中，我正在运行gem phantomJS版本2.1.1，我的命令行版本也仅为1.X。事实证明这很重要。

我将命令行phantomJS版本更新为2.1.1。同时，我确保所有输入框，按钮，表格，标题都具有唯一的ID。然后，我能够删除所有find(:xpath)事件，而无需破坏测试。
Result 5
现在，这套测试始终可靠地通过!正是我想要的!是!

Answer 1

立即跳出来的是您的admin_sign_in实际上并不等待sign_in完成。这意味着您可以在没有在浏览器中设置会话cookie的情况下调用create_costing。 admin_sign_in方法的最后一行应类似于

expect(page).to have_text('You are signed in') # whatever message is shown upon sign in

要么

expect(page).to have_current_path('/') # whatever path an admin is redirected to upon signing in

这将确保登录实际上已完成，因此会话cookie已在浏览器中设置。

另外，您的数据库清理程序配置应使用append_after块而不是after-请参见 https://github.com/DatabaseCleaner/database_cleaner#rspec-with-capybara-example