Question

不重复： How do you test if a div has a certain css style in rspec/capybara?

因为这些答案对我的情况不起作用。

我有一个带预览的网页表单;当您更改Web表单的某些部分时，预览会更新，我想在我的测试中检查这一点 - 所以我确实需要检查应用于div的样式。具体来说，我正在更新某些div的background-color，我想检查是否发生了这种情况。

有什么想法吗？

Answer 1

据我所知，Capybara没有用于获取元素的计算样式的API。但是，由于您使用的是Selenium-Webdriver，因此可以下拉到Selenium元素并使用style方法。

例如，考虑以下页面有一个div元素，其样式通过javascript更新：

<html>
  <body>
    <div id="red_div">
      background applied by javascript
    </div>
    <script>
      document.getElementById("red_div").style.background = "red";
    </script>
  </body>
</html>

您可以使用基础Selenium元素的style（或css_value）方法获取div的计算样式：

red_div = page.find(:css, '#red_div')
puts red_div.native.style('background-color')
#=> "rgba(255, 0, 0, 1)"

注意：

native是获取Capybara节点的基础Selenium元素的方法。
您从style获得的价值可能因浏览器而异。例如，对于背景颜色，我相信IE实际上会给你＆＃34; red＆＃34;。

Answer 2

您可以使用execute_script，希望有帮助。

 expect(page.execute_script("return window.getComputedStyle($('your-class-or-id')[0]).color").to eq('rgb(255, 255, 255)')

测试div在rspec / capybara中是否具有某种css样式？

2 个答案: