红宝石 – 你如何测试一个div在rspec/capybara中有一定的CSS样式?

前端之家收集整理的这篇文章主要介绍了红宝石 – 你如何测试一个div在rspec/capybara中有一定的CSS样式?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何测试div标签是否具有一定的CSS样式?我试图测试它是否显示:none;或显示:块。

我尝试了以下,但它给我一个错误

it {should have_selector('signup_server_generic_errors',/display:\s*none/)}

解决方法

我建议,而不是试图找到css样式,而是编写你的测试来找到css类名称

这样你可以改变底层的css样式,同时保持类的一致,你的测试仍然会通过。

寻找底层风格是脆弱的。款式频繁变化根据您的rspecs找到具体的风格元素,使您的测试更脆弱 – 当您所做的都是改变div的外观和感觉时,它们将更有可能失败。

根据您的测试找到css类使测试更加健壮。它允许他们确保您的代码正常工作,而不要求您在更改页面样式时更改它们。

在这种情况下,具体来说,一个选项可能是定义一个名为.hidden的css类,它设置display:none;在一个元素上隐藏它。

喜欢这个:

css:

.hidden {
  display:none;
}

html:

<div class="hidden">HIDE ME!</div>

水豚:

it {should have_css('div.hidden') }

这个capybara只是寻找一个div的隐藏的类 – 你可以使这个匹配器更复杂,如果你需要。

但是主要的一点是 – 将样式附加到css类名称,然后将测试绑定到类,而不是样式。

猜你在找的CSS相关文章