Rails Cucumber使用Capybara测试AJAX

Posted 2021-05-04

我正在使用Rspec，Capybara和Cucumber来测试我网站的功能。从本质上讲，我有一个时尚电子商务网站。我有商店页面显示所有项目，当您点击特定项目时，它会带您到该项目的详细页面，让我们说一件毛衣。对于这件毛衣，作为购物者，您可以选择所需的尺寸和颜色。最后一个选项是您想要的所选尺寸和颜色的数量。但是，如果购物者选择不同的尺寸或颜色，我有JS代码触发AJAX调用以更新总可用数量。因此，如果你从一件小号蓝色毛衣开始，然后将尺寸改为中等，那么AJAX调用将检索总可用的中号蓝色毛衣。因此，如果有10个可用，那么数量的选择选项将从1到10.现在要测试此功能，我有以下内容：

# first create the items for the test db:
Given /^there are four total items and three unique item names$/ do
  create(:product, size: 'M', color: 'Black')
  create(:product, size: 'M', color: 'Black')
  create(:product, size: 'S', color: 'Black')
  create(:product, size: 'S', color: 'White')
  create(:product, size: 'S', color: 'White', available: false)
  create(:product, name: 'Alicia Dress', size: 'L', color: 'black', order: 3)
  create(:product, name: 'Cleopatra Dress', size: 'L', color: 'blue', order: 2)
end

然后我进行了我的黄瓜测试（请注意，起始选项是小而黑，其数量仅为1，但是当您将尺寸选项更改为M时，它应该为2，因为有两个M黑色外套）：

Scenario: If a shopper selects a different size or color
  Given the shopper is on the "shop" page
  When the shopper clicks on "Master Coat"
  And the shopper selects a size "M"
  Then the total quantity should change to "2"

我的测试步骤：

When /^the shopper selects a size "(.+)"$/ do |size|
  find('.select-size').find(:option, size).click
end

Then /^the total quantity should change to "(.+)"$/ do |quantity|
  expect(page).to have_css('option', :text => quantity)
end

注意，我遗漏了Given和When的步骤，因为我知道那些工作。我的主要问题是，在“和购物者选择尺寸M”之后，AjAX调用应该触发并更改数量，但在我的最后一步中，数量保持为1并且不会变为2，因为它的假设和当我手动测试时它会这样做。我的猜测是AJAX在最后一个测试步骤之后没有触发或触发，因此在测试检查结果之前没有完成。

我正确设置了吗？如果是这样，我如何才能对AJAX响应进行匹配测试？我尝试了几件事，但它没有用。

答案

我通常会使用带有@javascript标记的selenium驱动程序来测试Ajax调用。

在您的features / support / capybara.rb中

Capybara.default_driver = :selenium

或者在场景上方尝试@javascript标记

@javascript
Scenario: If a shopper selects a different size or color
Given the shopper is on the "shop" page
  When the shopper clicks on "Master Coat"
  And the shopper selects a size "M"
  Then the total quantity should change to "2"

另一答案

也许你应该尝试用.select_option而不是.click选择选项。

When /^the shopper selects a size "(.+)"$/ do |size|
   find('.select-size').find(:option, size).select_option
end

（Qazxswpoi）