Check that an element is hidden via CSS with Spreewald
If you have content inside a page that is hidden by CSS, the following will work with Selenium, but not when using the Rack::Test driver. The Selenium driver correctly only considers text that is actually visible to a user.
Then I should not see "foobear"
This is because the Rack::Test driver does not know if an element is visible, and only looks at the DOM.
offers steps to check that an element is hidden by CSS:
Then "foo" should be hidden
You can also check that an element is visible:
Then "foo" should be visible
- Regardless of whether we expect the text to be visible or hidden, we always expect the given text to be contained in the HTML. The test is about whether or not it is hidden via CSS.
- In a standard, non-Selenium Rack::Test scenario, the steps are considerably less clever. Here they consider a text hidden if it sits in a container with a
style="display: none"attribute. In a Rack::Test scenario the step will not recognize if the element is hidden via another CSS class.
Flaky tests are tests that sometimes fail for no obvious reason. They are the plague of many end-to-end (E2E) test suites that automate the browser through tools like Capybara and Selenium.
Join our free training event and learn to fix any flaky test suite, even in large legacy applications.