我正在通过chromedriver运行Rails 5.x，with，Cucumber，Siteprism和Capybara。大多数事情都有效，除了..
我有一点 javascript 可以更改元素上的类以响应事件。但水豚从未看到这种变化。它只会在最初加载页面时看到元素具有的类。
使用 Chrome 并调试我的 Cucumber 步骤，我可以看到该元素具有新类，但 Capybara 看不到它。
这一定是其他人遇到并解决的问题，尽管我找不到正确的主题标题。
示例咖啡脚本
$(document).on('focus', 'tbody#item-entry > tr > td > input', (e) ->
$(@).closest('tr').addClass('focused-row')
$(@).closest('td').addClass('focused-cell')
)
触发焦点事件后的示例 HTML
<tr class="focused-row">
<td>ignore this </td>
</tr>
目的是更改包含具有焦点的输入元素的行的背景颜色。它有效。
但是 Capybara 看不到该类，但它可以看到加载页面时添加的任何类。
例如expect(siteprism_stuff.root_element['class']).to match(/focused-row/)
忽略SitePrism的东西，它只是得到正确的元素。root_element是 dom 节点的 Capybara 类。
现在我知道它得到了正确的水豚元素，因为如果我改变我的观点，把每一行的东西放在类中，那么它就会看到完全没问题。它看不到的是通过Coffeescript添加的任何新类。尽管它在 Chrome 检查器中可见，并根据需要更改焦点行的背景颜色。
您正在指定一个"结尾为"CSS属性选择器($=)
input[class$='form-control']
由于您感兴趣的元素的类属性
<input type="search" class="form-control form-control-sm" placeholder="" aria-controls="universitiesTable">
不以"表单控件"结尾是正确不匹配。 您可能只想使用普通的 CSS 类选择器input.form-control如果继续按照您的方式进行操作。 以下任何选项都应找到搜索字段并填写您尝试填写的数据。
fill_in 'Search:', with: string
fill_in type: 'search', with: string
find(:field, type: 'search').set(string)
find('input.form-control').set(string)
注意：您的问题仍然不清楚您是否在测试模式下看到检查器中添加的类，以及测试运行时线条颜色是否在更改(或者您是否仅在开发模式下看到) - 此答案假设 JS 实际上在测试模式下运行，并且您在测试运行时看到线条颜色发生变化。
您没有显示实际如何触发焦点事件，但我假设您正在单击该元素。 使用 Capybara 时要了解的是浏览器异步工作，因此当完成类似click的操作时，该点击触发的操作不一定尚未完成。 因此，每当对页面元素进行任何类型的期望时，您都应该始终使用 Capybara 提供的匹配器，而不是 RSpec 提供的基本匹配器。Capybara 提供的匹配器包括等待/重试行为，以处理处理浏览器的异步性质。 在这种情况下，假设siteprism_stuff.root_element是行元素，那么您可以执行类似操作
expect(siteprism_stuff.root_element).to match_css('.focused-row')
或者，根据您的 SitePrism 页面对象的设置方式，您可以将class选项传递给 SitePrism 存在检查器
# `page_section` and `have_row` would need to be replaced with whatever is correct for your site prism page object
expect(page_section).to have_row(class: ['.focused-row'])