NBash
NBash

Reputation: 515

Capybara cannot find dropdown list

I'm working on some automation things with Capybara + Ruby. There is a dropdown list at the page and I need to click it and select the option. The problem is - its Google Play Console and all styles and ids are dynamic and change every page reload, so you cannot use them. Also, tags names do not help at all.

Could you help me to find the element and to choose the right option, please? For now, it works like this: browser.find(:xpath, '/html/body/div[2]/div/div[2]/div/div[2]/div/div[3]/div/div[2]/div/div[1]/div/div/div/div/div[2]/div/div[2]/div[3]/section/div[4]/div/fieldset/label[1]/div[2]/div').click.find(:xpath, '/html/body/div[12]/div/div/div/div/div[1]').select_option
I need to find a way to do so without using 'xpath'

Sorry for the screenshots. Didn't find the right way copying code from the browser So, 'Select an application type' is a placeholder of this dropdown list, which has two options: 'Applications', 'Games'. I need 'Applications'.

enter image description here

Adding a screenshot of options HTML for your reference:

enter image description here

Upvotes: 1

Views: 288

Answers (2)

NBash
NBash

Reputation: 515

store_listing = browser.find_link(title: 'Store listing')
store_listing.click

application_type = browser.find(:element, 'div', role: 'button', text: 'Select an application type')
application_type.click
browser.find(:element, 'div', role: 'option', text: 'Applications').click

category_type = browser.find(:element, 'div', role: 'button', text: 'Select a category')
category_type.click
browser.find(:element, 'div', role: 'option', text: 'Shopping').click

browser.fill_in(type: "email", with: "[email protected]")
browser.click_on('Save draft', wait: 100)
sleep 2

Upvotes: 0

Thomas Walpole
Thomas Walpole

Reputation: 49880

Capybara's select and select_option methods are designed to work with HTML <select> and <option> elements, although select_option is doing what you expect because the driver you're using is devolving to just click when used on an element that's not an <option>. In this case, you're dealing with a JS widget dropdown list so you'll need to just use the find methods and click.

You don't show the structure of the HTML for the actual choices that are displayed so I can't provide you with exact instructions for that, but for the initial click on 'Select an application type' any of the following would be a better option than what you have

find(:label, 'Select an application type').click
find('div[role="button"]', text: 'Select an application type').click
find(:element, 'div', role: 'button', text: 'Select an application type').click

For the option you want to select after that, assuming the widget continues using aria roles and uses a role of 'option', you could do something like

find('div[role="option"]', text: 'Applications').click

If my guess on the role being used for the option is wrong then update accordingly

Upvotes: 0

Related Questions