更新

Question

我的rails 5.1应用程序中有一个Vue功能，它基本上接受一个深度嵌套的表单。该功能在开发，分期和生产中非常有效，但是，当使用硒和水豚的新的最小系统测试时，vue似乎不会加载。由于Selenium向您展示了实时发生的事情，我可以看到rails元素（例如_header，_footer，h1-Title）都正常加载，但Vue片段永远不会出现。

这是我的测试设置：

的Gemfile

group :test do
  gem 'minitest-rails'
  gem 'minitest-reporters'
  gem 'minitest-rails-capybara'
  gem 'faker'
  gem 'capybara', '~> 2.7', '>= 2.7.1'
  gem 'selenium-webdriver'
  gem 'simplecov', :require => false
end

测试/ test_helper.rb中

ENV["RAILS_ENV"] = "test"
require 'simplecov'
SimpleCov.start 'rails'
require File.expand_path("../../config/environment", __FILE__)
require "rails/test_help"
require "minitest/rails"
require "minitest/rails/capybara"
require "minitest/pride"
require 'minitest/reporters'
require "support/test_password_helper"
Minitest::Reporters.use! Minitest::Reporters::SpecReporter.new

ActiveRecord::FixtureSet.context_class.send :include, TestPasswordHelper

class ActiveSupport::TestCase
  require "#{Rails.root}/db/seeds.rb"
  fixtures :all
  require 'minitest/autorun'
  include TestPasswordHelper

  # Setup all fixtures in test/fixtures/*.yml for all tests in alphabetical order.
  # Add more helper methods to be used by all tests here...
  def sign_in(user)
    post user_session_path \
      'user[email]'    => user.email,
      'user[password]' => user.password
  end

  def submit_form
    find('input[name="commit"]').click
  end
end

测试/ application_system_test_case.rb

require "test_helper"

class ApplicationSystemTestCase < ActionDispatch::SystemTestCase
  driven_by :selenium, using: :chrome, screen_size: [1400, 1400]
  include Devise::Test::IntegrationHelpers
end

测试/系统/ proposals_test.rb

require "application_system_test_case"

class ProposalsTest < ApplicationSystemTestCase
  test 'create a proposal' do
    sign_in users(:martin)
    @supplier = businesses(:supplier_two)
    @project = projects(:pete_project_three)
    visit dashboard_path

    assert_selector 'h3', text: @supplier.display_name
    assert_link text: 'Propose for project'
    click_on 'Create Proposal'
    assert_selector 'h1', text: 'New Proposal'
    assert_selector 'small', text: '(Version: 1)'
    fill_in 'title0', with: 'This is a title'
    fill_in 'body0', with: 'This is a body'
    click_on 'Add Section'
    fill_in 'title1', with: 'This is a second title'
    fill_in 'body1', with: 'This is a second body'
  end
end

测试本身在fill_in 'title0', with: 'This is a title'失败，因为vue功能无法加载

注意我正在使用turbolinks，但如上所述，它在实践中都在完善，它只是不加载系统测试。

如果需要，很高兴提供更多细节

更新

正如所建议的，我能够在测试中使用byebug进入浏览器控制台日志（感谢Thomas），这使得我可以在测试暂停时与控制台进行交互。这是控制台中的错误：

 Uncaught Error: Module build failed: SyntaxError: Unexpected token, expected (27:7)

25 | //
26 | 
27 | import import bus from '../bus'
   |        ^
28 | import ClientDetails from './ClientDetails.vue'
29 | import SupplierDetails from './SupplierDetails.vue'
30 | import Sections from './Sections.vue'


at Object.disposed (proposal.js:518)
at __webpack_require__ (proposal.js:20)
at Object.module.exports.render._vm (proposal.js:539)
at __webpack_require__ (proposal.js:20)
at Object.exports.byteLength (proposal.js:15148)
at __webpack_require__ (proposal.js:20)
at module.exports.rawScriptExports (proposal.js:66)
at proposal.js:69

似乎问题可能是import import错字，但这不是我的bus，所以它必须是Vue.js本身？

Answer 1

首先，您将Capybara的使用与请求方法（获取，发布等）混合在一起。您不能这样做，因为请求方法不会影响Capybara使用的会话（最近提交了一个提交，以便在SystemTestCase中取消定义请求方法，因为它们引起了混淆 - https://github.com/rails/rails/commit/1aea1ddd2a4b3bfa7bb556e4c7cd40f9531ac2e3）。要解决此问题，您的sign_in方法需要更改为实际访问该页面，填写字段并提交表单。其次，在sign_in结束时，您需要声明表示登录已完成的内容。如果尚未完成，则可以在将Cookie发送回浏览器之后立即访问sign_in，然后您仍然无法登录。

def sign_in(user)
  visit new_user_session_path # wherever the login page is
  fill_in('user[email]', with: user.email)
  fill_in('user[password], with: user.password)
  click_button('Sign in') # whatever needs to be clicked to login
  assert_text('You are now logged in') # whatever message confirms the login succeeded
end

Rails系统测试未加载Vue

更新

1 个答案: