Question

I have an xpath expression that looks like this:

find(:xpath, "//div[@id='drawer-1' and @class='drawer']/h2/a[@class='drawer-toggle']")

I was wondering, is it possible to somehow mix this with css to read something like this?

find("div#drawer-1.drawer/h2/a.drawer-toggle")

Or if this is not possible, is there another way to navigate a DOM with css?

Cheers!

Answer 1

You cannot mix xpath with css. However, in your example, the xpath can be translated to css.

You should be able to do:

find("div#drawer-1.drawer > h2 > a.drawer-toggle")

Note that the “/” are changed to “>”. Xpath uses “/” as child selector, where as css uses “>”.

A couple useful links:

• Child selectors
• A cheat sheet that compares xpath with css locators