检查jQuery.remove（）是否已删除Capybara:：Node:：Element

我正在尝试进行以下测试：

it 'remove item from cart' do
  visit cart_path
  button = page.find("a[href='/carts/#{item.id}/remove']")
  card = find_ancestor_with_class(button, '.card')
  button.click
  # check if card has been removed from page
end

支持此测试，因为以下JS会将卡从页面中移除：

$.ajax({
  url: link,
  method: "GET",
  success: function() {
    $('#alert-modal').modal('show');
    $(button).closest(".card").remove();
  }
});

---

如何验证

.card

html是否已从页面中删除？

检查页面上是否有不可见的内容，请执行以下操作

expect(page).to have_no_css(".card")

或

所以总的来说

visit cart_path
click_link(href: "/cars/#{item.id}/remove")    
expect(page).not_to have_css(".card")

只有在删除所有

.card

元素后，该操作才有效。如果页面上仍有其他

.card

元素，则根据您希望在卡片中的文本或卡片元素（id等）上的其他属性/属性进行检查，如项目描述或显示的任何内容

expect(page).not_to have_css(".card", text: item.description)

如果你经常处理

.card

元素，你还可以编写一个定制的水豚选择器，使事情更容易阅读，本地化“card”的CSS定义，等等

这应该允许

expect(page).to have_no_selector(:card)
expect(page).to have_no_selector(:card, item.description)

---

等等。

但是没有一种方法可以使用

卡检查
？@RodrigoChaves实际上不是，这取决于
卡的确切位置，当元素被移除时
卡实际上可能指向一个新元素，从演示中可以看出，
card
最终指向页面上的所有三个
.card
元素，因为元素被删除。这是因为Capybaras自动重新加载处理动态页面刷新/重新加载。测试应该真正关注用户在页面上看到的内容，而不是担心特定的元素。
Capybara.add_selector :card do
  xpath do |content| 
    xp = XPath.css('.card')
    xp = xp[XPath.string.n.is(content)] unless content.nil?
    xp
  end
end

expect(page).to have_no_selector(:card)
expect(page).to have_no_selector(:card, item.description)