How to adjust Capybara finders on a site using css-modules? How to adjust Capybara finders on a site using css-modules? selenium selenium

How to adjust Capybara finders on a site using css-modules?


Using custom capybara selectors you can abstract away from the actual css query being done and move it to one location. In your comments you mentioned the need to change to a class attribute that begins with a passed in value.

Capybara.add_selector(:class_starts_with) do  css { |locator| "[class^=\"#{locator}\"]"end

would do that and then can be called as

find(:class_starts_with, 'something')

or if you set Capybara.default_selector = :class_starts_with it would just be

find('something')

Rather than changing default_selector another option would be to just define a helper method like find_by_class_start or something that just calls find with :class_starts_with passed (how Capybara's #find_field, etc work).

Also note the custom selector above would only really work if only one class name was set, if multiple are expected you could change the selector to "[class^=\"#{locator}\"], [class*=\" #{locator}\"]"