Selenium - how to locate value using dropdown using xpath - selenium

Question

The dropdown HTML on the header looks like this, usually I can manage if there's id on list, but there are none
<li class="nav-item dropdown pt-1">
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Add Data</a>
<div class="dropdown-menu text-center">
<a class="dropdown-item" href="<?=site_url()?>buku/create">Book</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="<?= base_url(); ?>pelanggan/create">User</a>
I tried using:
await driver.wait(until.elementLocated(By.xpath("//a[contains(text(),'Add Data')]")),5000).click();
currDate=new Date();
console.log(`${timeStart.getHours()}:${timeStart.getMinutes()}:${timeStart.getSeconds()} - Data added`);
But as I expected, it only clicked on the text, not the dropdown itself

Answer 1

You try click on the dropdown list itself instead of drop down item.Once the drop down list opens then only you can use Search by Text and click on the drop down items.
in this case i would suggest to use below xpath:
await driver.wait(until.elementLocated(By.xpath("//a[contains(text(),'Add Data')]/parent::li")),5000).click();
or
using css :
await driver.wait(until.elementLocated(By.cssSelector("li.nav-item.dropdown.pt-1")),5000).click();
if that also does not work you can dynamically change dropdown attribute using javascriptExecuter
document.querySelector('li.nav-item.dropdown.pt-1>a.nav-link.dropdown-toggle').setAttribute("aria-expanded", "true")
this will expand the drop down list by default. you don't have to click on the dropdown box.Then easily you can select elements from dropdown list.
it would be nice if you could provide the website url . if not hope this will give some sense how to handle this.