Select item from dropdown - Assignment 6: Using XPath expressions

For assignment 6, I attempted using xpath to select an item in a dropdown list in two steps.
First step click the dropdown arrow to unhide the list of items.

Mouse Click - //*[@id=“mG61Hd”]/div/div[2]/div[2]/div[7]/div/div[2]/div[1]/div[2]
The second to step click the required item
Mouse Click - //div[@role=‘option’][@data-value=’${element[7]}’] where element 7 is the required item in the list.

I kept getting an “element not interactable” error. My first question is why doesn’t this work?

While work on a different solution, I happen to sandwich this step in between the two steps from above:
Web Element - get value for “data-value” from the first item on the list
My second question is why did this work?

Step 1 - Mouse Click - //[@id=“mG61Hd”]/div/div[2]/div[2]/div[7]/div/div[2]/div[1]/div[2]
Step 2 - Web Element - get value for “data-value”
Step 3 - Mouse Click - //div[@role=‘option’][@data-value=’${element[7]}’]

Thanks, Chris

1 Like

Yes, this XPath doesn’t work although in the Dev Tools you can find the element by it. Try using another XPath, for example, (//div[@data-value="${element[7]}"])[2]

By adding the [2] to the end of the xpath, the second div tag with data-value attribute equal to ${element[7]} would be selected, correct? But I can only find one data-value attribute equal to ${element[7]} using the Dev Tools. How did you know to add the [2] to the end of the xpath?

Yes, correct. If you look for the XPath //div[@data-value="${element[7]}"] in the Google Dev Tools, you will find 2 elements with such XPath, and by switching between them you’ll see that only the second one is the correct element and the one you need.

XPath (//div[@data-value="${element[7]}"])[2] will select the second element on the page with XPath //div[@data-value="${element[7]}"].
You can read more about such XPaths here: