Question

我正在构建一个简单的Reddit Clone进行练习，并想测试一下ajax是否有效，并使用javascript响应正确更新屏幕上的值。这是测试：

RSpec.describe "User voting", type: :system, js: true do # Rails 5 uses describe, Rails < 5 feature
    it "updates the downvote count" do
        user = create(:user)
        login_as(user)
        link = create(:link)
        visit root_path
        expect(page).to have_css('#upvotes-1', text: '0')
        click_on(id: 'upvoter-1')
        wait_for_ajax
        expect(page).to have_css('#upvotes-1', text: '1')
   end
end

wait_for_ajax ：（在/spec/support/wait_for_ajax.rb中）

module WaitForAjax
    def wait_for_ajax
        Timeout.timeout(Capybara.default_max_wait_time) do
            loop until finished_all_ajax_requests?
        end     
    end

    def finished_all_ajax_requests?
        page.evaluate_script('jQuery.active').zero?
    end
end

来自index.html.erb的相对代码：

<%= button_tag(class: "btn btn-secondary btn-sm", id: "upvoter-#{link.id}") do %>
 <span class="fa fa-chevron-up"></span>
 Upvote
 <%= content_tag(:span, link.upvotes(), id: "upvotes-#{link.id}") %>
<% end %>

控制器代码：

  def create
    @vote = current_user.votes.new(link_params)
    if @vote.vote_value == 1
      @new_value = @vote.link.upvotes
      @id_name = "#upvotes-" + @vote.link.id.to_s
    else
      @new_value = @vote.link.downvotes
      @id_name = "#downvotes-" + @vote.link.id.to_s
    end

    respond_to do |format|
      if @vote.save
        format.js   { }
      else
        format.html { render :new }
      end
    end
  end

最后是create.js.erb：

console.log("create.js.erb file");

$("<%= j @id_name %>").html("<%= j @new_value.to_s %>");

宝石文件：

group :development, :test do
  # Call 'byebug' anywhere in the code to stop execution and get a debugger console
  gem 'byebug'
  gem 'rspec-rails'
  gem 'guard-rspec', require: false
  gem 'factory_bot_rails', '~> 4.0' 
  gem 'database_cleaner'
  gem 'rails-controller-testing'
  gem 'capybara', '~> 2.13'
  gem 'selenium-webdriver'
  gem 'chromedriver-helper'
  gem 'puma'
  gem 'poltergeist'
end

如果我自己加载网站并单击按钮，则提示会正确更新。但是，测试失败的第二个期望。如果我重新加载页面，则提示将更新，因此数据库将更新，并且#create可以按预期工作。 javascript由于某种原因未执行。而且我也尝试在click_on之后入睡。它仍然失败。我在这里似乎缺少一些简单的东西。

Answer 1

切换到Selenium帮助我更清楚地了解了问题。这是一个非常不错的教程，告诉您如何使用Rails 5 /最新（2018年底）版本进行设置：

A Quick Guide to Rails System Tests in RSpec

最后，我使用.new来创建模型，但是没有保存它，因此没有显示新的投票数。保存后移动拉动计数的逻辑即可解决问题。

在votes_controller.rb中：

  def create
    @vote = current_user.votes.new(link_params)
    respond_to do |format|
      if @vote.save
        format.js   {
          if @vote.vote_value == 1
            @new_value = @vote.link.upvotes
            @id_name = "#upvotes-" + @vote.link.id.to_s
          else
            @new_value = @vote.link.downvotes
            @id_name = "#downvotes-" + @vote.link.id.to_s
          end             
            }
     else
       format.html { render :new }
     end
   end
  end

如何使JavaScript在Rspec Capybara测试中运行

1 个答案: