CODEWITHSUNDEEP
javaseleniumintellij-ideaselenium-webdriverbrowser-automation
OhAye
OhAye

Reputation: 103

How do I click an li inside a ul using Selenium Webdriver

public void testHolidayLink() {

 // login
  driver.findElement(By.id("ctl00_MCPH_MainLogin_UserNameTextBox")).sendKeys("username");
  driver.findElement(By.id("ctl00_MCPH_MainLogin_PasswordTextBox")).sendKeys("password");
  driver.findElement(By.id("ctl00_MCPH_MainLogin_LoginButton")).click();
// click book holiday
  
  driver.findElement(By.xpath(".//*[@id='AddInMyQuickLinks']/div/span/ul/li[1]/h3/a")).click();
}

I'm trying to click an li inside a ul using xpath, im trying to use this

driver.findElement(By.xpath("//div[@class='indent'/ul/li[1]a")).click();

but it can't seem to find the element

<div class="AddIn  atScreens AddInViewportDESKTOP">
  <div style="width:100%;" data-role="collapsible" class="AddInCollapsible ui-accordion ui-widget ui-helper-reset" id="AddInMyQuickLinks" role="tablist">
    <h2 class="AddinTitleBar ui-accordion-header ui-helper-reset ui-state-default ui-accordion-header-active ui-state-active ui-corner-top ui-accordion-icons" role="tab" id="ui-accordion-AddInMyQuickLinks-header-0" aria-controls="ui-accordion-AddInMyQuickLinks-panel-0"
    aria-selected="true" tabindex="0"><span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-s"></span>My Quick Links</h2>
    <div class="AddInMain ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="display: block;" id="ui-accordion-AddInMyQuickLinks-panel-0" aria-labelledby="ui-accordion-AddInMyQuickLinks-header-0"
    role="tabpanel" aria-expanded="true" aria-hidden="false">
      <span><ul class="NoIndent"><li class="NoBullet jms-bullet"><h3><a href="javascript:ShowSelectedAddInScreen('-1','32f3c56c-5660-488c-b348-07552ea7d299','0','false',false,'false',true, 'Update Personal Details','e1ff7f13-59fe-4bfc-842d-64a33b0dd98f','b0ab7c0f-bd9d-4f0d-9d1e-508b414ab9ec');"><img alt="Update My Details" src="..\Images\hr.png">Update My Details <span title="Keep your personal information up to date" class="AddInItemDescription">Keep your personal information up to date </span>
      </a>
      </h3>
      </li>
      <li class="NoBullet jms-bullet">
        <h3><a href="javascript:ShowSelectedAddInScreen('-1','8142758e-269a-41f0-b551-433e56dd1225','0','false',false,'false',true, 'Submit a Holiday','e1ff7f13-59fe-4bfc-842d-64a33b0dd98f','4c1ea925-69e5-4950-aeae-18e8493fefd1');"><img alt="Book a Holiday" src="../Style Sheets/images/Holiday114.png">Book a Holiday <span title="Place a request for a holiday" class="AddInItemDescription">Place a request for a holiday </span></a></h3>
      </li>
      <li class="NoBullet jms-bullet">
        <h3><a href="javascript:ShowSelectedAddInScreen('D4292FDC-7213-464C-9C96-019BD67C12DA','bebbb0b6-5328-4737-9709-f389f065db8b','0','false',false,'false',false, 'Employee Mobility','e1ff7f13-59fe-4bfc-842d-64a33b0dd98f','');"><img alt="My Mobility" src="..\Images\hr.png">My Mobility <span title="Places where I would work" class="AddInItemDescription">Places where I would work </span></a></h3>
      </li>
      </ul>
      </span>
    </div>
  </div>
</div>

And this is the full xpath

/html/body/form[1]/div[3]/div[2]/div[1]/div/span[2]/div/div/div/span/ul/li[2]/h3/a

The div has an id which I think i can use to get to the li inside the span but I have no idea how. Apologies if I have not provided the information correctly its my first time posting so please do leave feedback in how I can structure my questions better so as to make it easier for people.

Upvotes: 3

Views: 36555

Answers (4)

Muhammad Qaiser Abas Khan Sial
Muhammad Qaiser Abas Khan Sial

Reputation: 140

To Get The Xpath of any Tag Do Following:

1) right click on Web Page

2)Select Inspect

3)Right click on Tag

4) Go to Copy  

5) Copy Xpath or Full Xpath

Upvotes: 0

XDavidT
XDavidT

Reputation: 181

In some browsers, you can inspect the element by right-click on it, Inspect the element, when you find the correct element in "developer mode" click right-click on it.

Under Copy->Copy XPath. Gave you the right way to get full path just copy-paste.

Upvotes: 0

noor
noor

Reputation: 3004

If you want to click on the first link, meaning

 update My details

then use this:

driver.findElement(By.cssSelector("li:nth-child(1).NoBullet.jms-bullet> h3>a[href^='javascript:ShowSelectedAddInScreen']")).click();

If you want to click on the second link, meaning

 Book a Holiday

then use this:

driver.findElement(By.cssSelector("li:nth-child(2).NoBullet.jms-bullet> h3>a[href^='javascript:ShowSelectedAddInScreen']")).click();

If you want to click on the third link, then use this:

driver.findElement(By.cssSelector("li:nth-child(3).NoBullet.jms-bullet> h3>a[href^='javascript:ShowSelectedAddInScreen']")).click();

This can be simplified by using the below code:

//first create a web element list which contains all elements inside a list:

List<WebElement> elems = driver.findElements(By.cssSelector("ul.NoIndent>li.NoBullet.jms-bullet> h3>a"));

//Now you can select individual elements from a list using:

 elems.get(0).click();//for the 1st element
 elems.get(1).click();//for the 2nd element
 elems.get(2).click();//for the 3rd element

Upvotes: 4

ThreeDots
ThreeDots

Reputation: 757

Your xpath is incorrect, try this (updated after html code was provided):

driver.findElement(By.xpath(".//*[@id='AddInMyQuickLinks']/div/span/ul/li[1]/h3/a")).click();

Upvotes: 1

Related Questions