Capybara cheatcheat
capybara
Rails
RSpec
find('[data-turbo-frame="menu"]').click
find_all("input").first.fill_in with: "tomas"
<input data-order="0001"> <input data-order="0002"> find_all("input") .sort_by { |input_node| input_node["data-order"].to_i } .last .fill_in with: "Nikola"
page.has_selector?("h2", text: "Ready to send", wait: 1)
expect(page).to have_link("Export", href: "http://www.test.com/companies/123") # title + exact url expect(page).to have_link(href: "http://www.test.com/companies/123") # exact url only expect(page).to have_link("Export", href: /companies\/123/) #regexp path = Regexp.escape("/users/#{user.id}/article/#{article.id}/conversion_reports/export.csv?report_type=weekly") expect(page).to have_link("Export", href: /#{path}/)
first(:link, href: "http://eq8.eu").click all(:link, href: "http://eq8.eu") all(:link, href: nil) click_link('Go to checkout') find_link(title: 'Add User') click_on('Save') find(:link_or_button, 'go-back')
Match hidden elements
Capybara match only visible elements, If element has display: none prop you need to:
expect(page).to have_selector("input[type=submit]", visible: false)
Match Tailwind pseudo class
<input type="radio" class="checked:bg-red-500" checked="checked"/>
expect(comp).to have_selector('.checked\:tw-bg-primary-600') #works expect(comp).to have_selector(%q(.checked\:tw-bg-primary-600)) #works expect(comp).to have_selector(".checked\:tw-bg-primary-600") # double quotes won't work due to interpolation
Partial match using star
<img src="https://eq8.eu/images/just_name.png?abc=123" alt="bla">
expect(page).to have_css(img[src*='just_name.png'][alt=bla]
Selectors
expect(page).to have_selector("[data-notification-type=notice]", text: "Element Must have selector + text") expect(page).to have_selector("[data-notification-type=notice][role=alert]", text: "Element Must have both selectors + text")