Reading an element's attributes with Capybara
capybara_element['attribute_name']
Show archive.org snapshot
allows accessing an element's attributes in Capybara.
A few examples:
find('#my_element')['class']
# => "first-class second-class"
find('#my_input')['placeholder']
# => "My placeholder value"
find('a#example-link')['href']
# => "http://example.com"
find('#my_element')['missing_attribute']
# => nil
Related cards:
Capybara: Working with invisible elements
When Capybara locates elements in the DOM, by default it allows only accessing visible elements -- when you are using a driver that supports it (e.g. Selenium, not the default Rack::Test driver).
Consider the following HTML:
<div class=...
How to access before/after pseudo element styles with JavaScript
Accessing pseudo elements via JavaScript or jQuery is often painful/impossible. However, accessing their styles is fairly simple.
Using getComputedStyle
First, find the element in question.
let element = document.querySelector(...
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 ...
Use CSS attribute selectors with Capybara
You can use CSS attribute selectors in your step definitions like this:
Then /^the page should have a meta description "([^"]+)"$/ do |description|
page.should have_css("meta[name=\"descript...
Nice way to set data attributes when creating elements with Rails helpers
You can say this in helpers like link_to and content_tag:
= link_to 'Label', root_url, :data => { :foo => 'bar', :bam => 'baz' }
This will produce:
<a href="/" data-foo="bar" data-bam="baz">Label</a>
Only works in Rails 3. ...
Hover an element with Capybara < 2
You need this awkward command:
page.driver.browser.action.move_to(page.find(selector).native).perform
Note that there are better ways for newer Capybaras.
Change how Capybara sees or ignores hidden elements
Short version
- Capybara has a global option (
Capybara.ignore_hidden_elements) that determines whether Capybara sees or ignores hidden elements. - Prefer not to change this global option, and use the
:visibleoption when callin...
Using Capybara finder methods with arbitrary matching conditions
Capybara has a variety of finder methods like find_button to help you look up DOM elements. There are also matchers ...
How to test print stylesheets with Cucumber and Capybara
A print stylesheet is easy to create. Choose a font suited for paper, hide some elements, done. Unfortunately print stylesheets often break as the application is developed further, because they are quickly forgotten and nobody bothers to check if ...
Heads up: Capybara 3's text matchers no longer squish whitespace by default
Until Capybara 2, node finders that accept a text option were able to find nodes based on rendered text, even if it spans over multiple elements in the HTML. I...