Question

你能帮我为check CSS属性创建正确的RSpec期望吗？

例如我有：

<td class="MenuItem">

MenuItem 有一个属性“ background-color：＃c0c0c0 ”。

我需要检查 background-color 是否等于＃c0c0c0 。

我的例子：

expect(page.td_element(:class => "MenuItem").attribute(class).MenuItem).to be == "#c0c0c0"

Answer 1

在Watir-Webdriver中，Element#style方法可用于获取元素的计算样式。计算出的样式是基于样式表及其样式属性的元素外观。

假设HTML如：

<html>
  <head>
    <style>
      .MenuItem { background-color: #c0c0c0; }
    </style>
  </head>
  <body>
    <table>
      <tr>
        <td class="MenuItem">menu</td>
      </tr>
    </table>
  </body>
</html>

我们可以调用style方法并指定我们感兴趣的特定属性，在本例中为“background-color”：

p browser.td(:class => "MenuItem").style('background-color')
#=> "rgba(192, 192, 192, 1)"

以上显示了Firefox，Chrome和IE返回的内容。其他浏览器可能会以不同方式格式化属性。如您所见，我们返回RGBA而不是原始的十六进制代码。虽然您可以编写一个算法将RGBA转换为十六进制代码，但测试RGBA代码更容易（因为这是返回的内容）。

在编写RSpec期望方面，我们只是比较一个字符串，所以可以这样做：

expect(browser.td(:class => "MenuItem").style('background-color')).to eq('rgba(192, 192, 192, 1)')

但是，鉴于您使用的是页面对象gem，您需要使用cell_element而不是td：

expect(page.cell_element(:class => "MenuItem").style('background-color')).to eq('rgba(192, 192, 192, 1)')

RSpec期望检查CSS属性

1 个答案: