How to Test If a Div Has a Certain CSS Style in Rspec/Capybara

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

I'd recommend that instead of trying to locate the css style, you instead write your tests to find the css class name.

This way you can change the underlying css styling while keeping the class the same and your tests will still pass.

Searching for the underlying style is brittle. Styles change frequently. Basing your rspecs on finding specific style elements makes your tests more brittle -- they'll be more likely to fail when all you do is change a div's look and feel.

Basing your tests on finding css classes makes the tests more robust. It allows them to ensure your code is working correctly while not requiring you to change them when you change page styling.

In this case specifically, one option may be to define a css class named .hidden that sets display:none; on an element to hide it.

Like this:

css:

.hidden {
  display:none;
}

html:

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

capybara:

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

This capybara just looks for a div that has the hidden class -- you can make this matcher more sophisticated if you need.

But the main point is this -- attach styles to css class names, then tie your tests to the classes, not the styles.

How to test the value of a CSS selector using Capybara and RSpec?

Presumably, you are trying to verify that this div uses the specified background image. I would probably do something like this:

it "has a user image" do
  page.should have_selector('div.user-image')
end

it "displays the user image" do
  page.find('div.user-image')['style'].should == 'background-image:url(/images/user_image.jpg)'
end

RSpec, however, is likely the wrong tool for the job. Consider using Cucumber for tests like this.

Rspec + Capybara: check existence of tag with it's css class

OK, I found the solution. I should use have_css method:

it "should have pagination" do
  page.should have_css('div.pagination.pagination-centered')
end

---

Related Topics