Rails + Minitest + Capybara：如何使用 span id 进行断言选择答案

【问题标题】：Rails + Minitest + Capybara: how to assert_select with span idRails + Minitest + Capybara：如何使用 span id 进行断言选择
【发布时间】：2019-10-17 11:52:58
【问题描述】：

在我看来，我有：

<span class = "info">
    <span id="<%= account.id %>" data-account_id="<%= account.id %>" data-activated="<%= account.starts_at? %>">
        <%= t(".account_activated") %>
    </span>
</span>

如果里面显示“帐户已激活”文本，最好的测试方法是什么（使用水豚进行系统测试）？

我试过了：

assert_selector "span##{acount.id}", text: "account has been activated"

但是得到 Selenium::WebDriver::Error::InvalidSelectorError: 无效选择器：指定了无效或非法的选择器

【问题讨论】：

标签： ruby-on-rails-5 capybara

【解决方案1】：

在 HTML5 中，定义已更改为允许 id 以数字开头，但 CSS 要求正确转义前导数字（#\31 234 将匹配 id '1234'）。因此，如果您需要通过 CSS 匹配一个可能以数字开头的 id 元素，最好使用 id 选项（所有 Capybara 选择器都支持）并让 Capybara 将其合并到 CSS 中

assert_selector "span", id: account.id, text: "account has been activated"

这将正确地转义并将其应用于 CSS。如果您只想指定 id 而不是元素类型（因为 id 在页面上应该是唯一的），您可以使用 :id 选择器类型（而不是默认的 CSS 选择器类型）

assert_selector :id, account.id, text: "account has been activated"

【讨论】：

【解决方案2】：

我已经解决了这个问题。

这是因为 ID 不应以数字开头（请参阅 here）

ID 和 NAME 标记必须以字母 ([A-Za-z]) 开头，并且可以是后跟任意数量的字母、数字 ([0-9])、连字符 ("-")、下划线（“_”）、冒号（“:”）和句点（“.”）。

查看代码应更改如下：

<span class = "info">
    <span id="**account_**<%= account.id %>" data-account_id="<%= account.id %>" data-activated="<%= account.starts_at? %>">
        <%= t(".account_activated") %>
    </span>
</span>

和

assert_selector "#account_#{account.id}", text: "account has been activated"

【讨论】：

其实在 HTML5 中 id 是允许以数字开头的，只是在 CSS 中你必须正确地转义它们