Rails Capybara 未检测到 flex 项目的可见性

Rails Capybara not detecting vivsiblity of flex item

我正在 display: flex 单击按钮时的一个元素,然后在一些 ajax 调用后 display: none 到同一元素。我正在使用 CapybaraSelenium 驱动程序进行相同的集成测试。问题是水豚检测到元素的可见性,有时即使元素可见也检测不到。我曾尝试提供不同的 wait 值,但它有时仍然有效,有时却无效。无论如何我可以纠正这个吗?代码如下:

ele.addEventListener('change', () => {
  showSpinner(true);
  ajaxCall().then(() => showSpinner(false));
}

showSpinner = (flag) => {
  let spinner = document.getElementById('spinner');
  if (!spinner) {
    return;
  } else if (flag) {
    spinner.classList.add('show');
  } else {
    spinner.classList.remove('show');
  }
};

.spinner.show {
  display: flex;
}

.spinner {
  display: none;
  // other properties
}

在测试文件中

choose 'radio_button' // if radio button
select 'some text', from: 'dropdown_element' // if dropdown
assert page.has_css?('.spinner', wait: 0)

这有时有效,有时无效。选择或单击元素。这样可行。但不是 has_css。我也尝试使用 assert_css 但我收到错误。那么如何编写上述问题的测试用例呢?

我解决了如下问题。我从@Thomas Walpole 对我提出的这个问题 Check element visibility that is visible for less than a second in Rails Capybara 的评论中找到了答案。问题是有时 ajax 响应非常快,有时又很慢。所以我所要做的就是降低网络速度。

// Set the latency time through selenium before the click or select and then check 
// for the visibility of the element on page and then again change back the latency

page.driver.browser.network_conditions = { offline: false, latency: 2000, throughput: 789 }
choose 'radio_button' // if radio button
select 'some text', from: 'dropdown_element' // if dropdown
assert page.has_css?('.spinner', wait: 0)
page.driver.browser.network_conditions = { offline: false, latency: 0, throughput: 0 }
// continue with other tests

这对我的问题有效。随时改进此解决方案。