CSS 'contains' selector & upgrade of Capybara

Question

Previously my specs had these lines:

within "h3:contains('FooBar text') + dl" do
  page.should have_content 'FizzBuzz'
end

(within definition list next from header that contains specified text)

I upgraded capybara-webkit and now 'contains' selector does not work
(which is kind a fine and understandable since it's deprecated in CSS3).

I can't figure out an easy way to rewrite this. Any ideas?

Answer 1

If you want to avoid having to figure out the xpath, you can use Nokogiri::CSS.xpath_for It returns an array so you need to do [0]

within :xpath, Nokogiri::CSS.xpath_for("<CSS SELECTOR>")[0] do

Answer 2

I think you upgraded not only capybara-webkit but also capybara.

Capybara 2.1 now uses driver's implementation of CSS selectors.

Previously it worked because Capybara converted CSS selector to XPath using Nokogiri. Nokogiri seems to support :contains pseudo selector (as this code worked previously).

You can rewrite it using XPath like:

within(:xpath, "//dl[preceding-sibling::h3[contains(text(),'FooBar text')]]") do
  page.should have_content 'FizzBuzz'
end

However, I think it's not too readable so it may be better to choose a better selector that will be more short and readable.