Selenium: how to click on the first child of a html element

Question

I'm working on a Selenium Project, and I need to click on the first child of this ul got by xpath:

bot.find_element_by_xpath('//*[@id="mailappcomponent"]/div/div/div[2]/div/div/div[2]/div/div[1]/ul').click()

Can you help me?

Answer 1

To identify the first child of the <ul> element:

//*[@id="mailappcomponent"]/div/div/div[2]/div/div/div[2]/div/div[1]/ul

you have to use either the tag_name and/or the attributes of the child/descendant element.

In case the first child (descendant) is a <li> you have to append /li at the end as follows:

//*[@id="mailappcomponent"]/div/div/div[2]/div/div/div[2]/div/div[1]/ul/li

Incase the first child (descendant) is a <ol> you have to append /ol at the end as follows:

//*[@id="mailappcomponent"]/div/div/div[2]/div/div/div[2]/div/div[1]/ul/ol

Now, to click on the element you need to induce WebDriverWait for the element_to_be_clickable() and you can use either of the following Locator Strategies:

//in case of descendant li
WebDriverWait(bot, 20).until(EC.element_to_be_clickable((By.XPATH, "//*[@id="mailappcomponent"]/div/div/div[2]/div/div/div[2]/div/div[1]/ul/li"))).click()
//in case of descendant ol
WebDriverWait(bot, 20).until(EC.element_to_be_clickable((By.XPATH, "//*[@id="mailappcomponent"]/div/div/div[2]/div/div/div[2]/div/div[1]/ul/ol"))).click()

Note: You have to add the following imports :

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC

Answer 2

You Can Click on First list item by using XPATH

bot.find_element_by_xpath('//[@id="mailappcomponent"]/div/div/div[2]/div/div/div[2]/div/div[1]/ul/li[1]').click()

If want to click on second third and so on just change /li[number you want]