集成测试中未加载Javascript库

集成测试中未加载Javascript库,javascript,ruby-on-rails,rspec,capybara,poltergeist,Javascript,Ruby On Rails,Rspec,Capybara,Poltergeist,我使用RSpec、水豚和Poltergeist驱动程序实现了集成测试。以下是一个例子: describe "Answer a question", type: :feature, js: true do subject(:visit_page) do login_as create(:user) exercise = create(:exercise) question = create_a_question_to_exercise(exercise) cr

我使用RSpec、水豚和Poltergeist驱动程序实现了集成测试。以下是一个例子:

describe "Answer a question", type: :feature, js: true do
  subject(:visit_page) do
    login_as create(:user)

    exercise = create(:exercise)
    question = create_a_question_to_exercise(exercise)
    create(:test_case, :hello_world, question: question)

    visit new_answer_path(question)
  end

  it "shows the answer" do
    visit_page
    content = "puts 'Hello, world!'"
    fill_in_editor_field content
    expect(page).to have_editor_display text: content
  end
end
以下是测试中访问的视图中使用的javascript:

<script>
  function adjust_screen() {
    var new_height =  $('.content-wrapper').height()
                      - $('#test-results').height()
                      - $('#error_explanation').height();
    $('.content-wrapper').height(new_height);
    $('#test-results').empty();
    $('#error_explanation').remove();
    $('#answer-result').remove();
    $('.submit').append('<i class="fa fa-refresh fa-spin"></i>');
  }

  var textarea = $('#editor');
  textarea.hide();

  var editor = ace.edit("editor_div");
  editor.setTheme("ace/theme/twilight");
  editor.getSession().setMode("ace/mode/pascal");

  // When click put ace editor content in form hidden textarea.
  $('input[name="commit"]').on('click', function() {
    textarea.val(editor.getSession().getValue());
    adjust_screen();
  });
</script>

功能调整屏幕(){
var new_height=$('.content wrapper').height()
-$(“#测试结果”).height()
-$('错误解释').height();
$('.content wrapper').height(新高度);
$(“#测试结果”).empty();
$(“#错误_解释”).remove();
$(“#回答结果”).remove();
$('.submit')。追加('');
}
var textarea=$(“#编辑器”);
textarea.hide();
var editor=ace.edit(“editor_div”);
编辑:setTheme(“ace/theme/twilight”);
editor.getSession().setMode(“ace/mode/pascal”);
//单击“将ace编辑器内容放入表单隐藏文本区域”时。
$('input[name=“commit”]”)。在('click',function()上{
val(editor.getSession().getValue());
调整屏幕();
});
运行测试时,我收到以下错误:

Capybara::Poltergeist::JavascriptError: 页面上的Javascript代码中出现了一个或多个错误。如果您不关心这些错误,可以通过在Poltergeist配置中设置js_errors:false来忽略它们(有关详细信息,请参阅文档)

语法错误:分析错误 语法错误:分析错误 ReferenceError:找不到变量:$ ReferenceError:找不到变量:$

(这在所有涉及javascript的测试中都会发生)

javascript库没有加载的结论是因为这个实验:我在布局的标题中添加了
,这个错误消失了。但是,出现一个新错误,指责未定义
ace
变量(它来自另一个库,
ace编辑器

最初,我的所有javascript库都在
application.js
中引用。所以我不需要在标题中加载它

我也用
capybarawebkit
进行了测试,同样的情况也发生了


我完全没有主意了。有什么建议吗

我过去常常在运行功能测试之前预编译资产

# Don't forget to include this on rails_helper.rb
Dir[Rails.root.join('spec/support/**/*.rb')].each { |f| require f }


# spec/support/feature_helper.rb
RSpec.configure do |config|
  config.before :all do
    ENV['PRECOMPILE_ASSETS'] ||= begin
      case self.class.metadata[:type]
      when :feature, :view
        STDOUT.write "Precompiling assets..."

        system "bundle exec rake assets:precompile > /dev/null 2>&1"

        STDOUT.puts "\n Done."
        Time.now.to_s
      end
    end
  end
end

当JS在开发模式下工作,但在开发模式下似乎根本无法加载时,这通常是因为JS文件中的某个地方出现了错误。在开发模式下,每个文件都单独加载,这意味着其中一个文件中的错误不会停止其他文件的加载/解析。但是,在测试模式下,rails资源管道将application.js中引用的所有文件连接到一个文件中。这意味着一个文件中的错误可以中止对其后连接的任何JS的解析。您可以通过在开发模式下的浏览器开发人员控制台中查找错误并修复任何显示的错误来检查这一点。

谢谢@heliohead,但它不起作用。资产已编译,但错误仍然存在。我检查了@ThomasWalpole,但没有找到任何东西。嗯,我在检查浏览器的控制台时没有找到任何东西,但Poltergeist gem有一个非常好的debbuger工具,我可以从中查看测试浏览器控制台中的消息。我在
application.js
中使用了一个javascript函数,在这个函数中我使用了jquery(导致了解析和引用错误)。这是:我在将jquery加载到我的应用程序之前使用过它。去掉这个解决了我的问题。谢谢你的提示!
幻影
gem是否有类似的调试器工具?我也有同样的问题,在开发中没有发现浏览器控制台中有任何错误。@obromios从技术上讲,这是可能的-通常更容易在非headless模式下运行它