Finding a div tab in Capybara?

Question

I'm currently trying to find this tab and click on it. I'm trying to find a easier way of clicking on this button. In my code, I tried to use find command and it's unable to find this tab.

<div role="tab" aria-disabled="false" aria-selected="true" class="ant-tabs-tab-active ant-tabs-tab">Animals</div>

Code:

find('tab[div=Animals]').click

Not sure what I'm doing wrong.

Answer 1

It looks like you need to study CSS selectors a bit more. 'Animals' is text content and CSS does not provide a way to query on text content. In Capybara you can use the text option to filter matching nodes by their text content so combining valid CSS with the text filter like

find('div[role="tab"]', text: 'Animals').click 

or

find('div.ant-tabs-tab', text: 'Animals').click

would be ways of clicking on that element

Note: I would recommend https://flukeout.github.io/ to learn what you can and can't do with CSS selectors.