Reputation: 1488
I'm trying to get an element from a dropdown list, to select it and go over, but I can't.
I know that the xpath of the element i want to select from the dropdown is:
/html/body/div[1]/div/div[1]/div[1]/div[2]/div/div/div[1]/div[2]/div[1]/div/div/div/div[2]/div/div/ul/li[2]
while the dropdown window has id rw_2_input
the dropdown list lets you to select one of five options: less than 18, 18-40, 40-60, and so on; so I did:
// select the dropdown and click on it
const age = await driver.findElement(By.id('rw_2_input'))
await age.click()
then
// select the dropdown item then click on it
const ageChoice = driver.wait(until(elementIsVisible((By.XPATH, "/html/body/div[1]/div/div[1]/div[1]/div[2]/div/div/div[1]/div[2]/div[1]/div/div/div/div[2]/div/div/ul/li[2]"))))
await ageChoice.click()
on top of the file, i used those imports:
const { Builder, By, Key, util } = require('selenium-webdriver')
const chrome = require('selenium-webdriver/chrome')
const expect = require('expect')
const { elementIsVisible } = require('selenium-webdriver/lib/until')
My issue is that it says until is not defined
.
I'm sure I'm doing something wrong in importing, but I don't know what. I searched here to understand what and how to import, but i had no clue. If i try to select the element in the dropdown using
const ageChoice = await driver.findElement(By.xpath('/html/body/div[1]/div/div[1]/div[1]/div[2]/div/div/div[1]/div[2]/div[1]/div/div/div/div[2]/div/div/ul/li[2]'))
await ageChoice.click()
it says
ElementNotInteractableError: element not interactable
Why it should not be interactable?? I don't get it.
* * *
***** UPDATE: *****
I managed to work something, but still says "Element not interactable": what I did is
const ageChoice = await driver.findElement(By.xpath("//li[contains(text(),'Tra 19 e 40')]"))
await ageChoice.click()
If I comment out the .click()
function everything works fine; however I don't have the option selected. How can I select it since it says that it is not interactable?
Upvotes: 0
Views: 2672
Reputation: 1488
I finally managed what is the problem. I'll post here for future reference.
Well, I got that I have 2 dropdown list in my page, and when I select an option from the first one, options temporarily "covers" the second dropdown, Which causes a "not interactable error".
After discovering this (and it took hours, since no one in documentations says nothing about that), I managed how to "wait" for the first dropdown to close.
Basically, you have to do both two checks:
a) That the element is visible.
b) That it is enabled.
No checks, no party, so the code becomes:
const ageChoice = await driver.findElement(By.xpath("//li[contains(text(),'Tra 19 e 40')]"))
await driver.wait(until.elementIsVisible(ageChoice), 3000)
await driver.wait(until.elementIsEnabled(ageChoice), 3000)
await ageChoice.click()
This way it finally works.
Note that if you use wait-until elementIsVisible
and elementIsEnabled
you dont't need to wait-until elementLocated
: you DO NOT NEED to use this code
const ageChoice = await driver.wait(until.elementLocated(By.xpath(By.xpath("//li[contains(text(),'Tra 19 e 40')]"))
Instead, this code must be used when you dont do these 2 checks, but the element is at the bottom of a page that contains a lot of dropdowns and it goes in timeout before it is reached. In this case, use
const ageChoice = await driver.wait(until.elementLocated(By.xpath(By.xpath("//li[contains(text(),'Tra 19 e 40')]"))
ageChoice.click()
Upvotes: 0
Reputation: 1586
This could be a quick fix. (Not a solution). You can execute JavaScript on the webpage with this command driver.executeScript(command)
.
Select the element by ID, or otherwise, that you would like to click and execute JavaScript for example:
driver.executeScript('document.getElementById('#someID').click()')
Upvotes: 1