找不到 By.xpath 定位的元素

Question

i tried to click this button with xpath, classname, and css locator. I even put a time wait so it can load properly first, but nothing worked. still can't click the button, please help.

<div class="relative create-disbursement-dropdown" size="small">

<button data-v-a7f43302="" type="button" variant="solid" color="green" size="small" lefticon="" righticon="" options="[object Object],[object Object]" class="
    relative
    box-border
    transition-all
    duration-200
    font-sans font-semibold
    rounded-semi
    py-2
    disabled:pointer-events-none
    disabled:cursor-default
    focus:outline-none
   btn-small btn-solid btn-green"><div data-v-a7f43302="" class="flex items-center justify-center space-x-2">

<div data-v-a7f43302="" class="flex items-center justify-center space-x-2"><!---->

<span data-v-a7f43302=""> Create Disbursement </span>

</div>
</button>
</div>

 

[this is the button looks like]: https://i.stack.imgur.com/cml4u.png

my code was like this one:

WebElement createDisburseButton = wait.until(ExpectedConditions.elementToBeClickable(By.xpath("//*[@id=\"disbursement-root\"]/div/div[1]/div/button")));

createDisburseButton.click();

the error:

Expected condition failed: waiting for element to be clickable: By.xpath: //*[@id="disbursement-root"]/div/div[1]/div/button (tried for 10 second(s) with 500 milliseconds interval)

Answer 1

To click on Create Disbursement you can use either of the following Locator Strategies :

• Using Java and xpath :

   driver.findElement(By.xpath("//span[contains(., 'Create Disbursement')]")).click();

• Using Python and xpath :

   driver.find_element(By.XPATH, "//span[contains(., 'Create Disbursement')]").click()

Answer 2

Please check in the dev tools (Google chrome) if we have unique entry in HTML DOM or not.

xpath that you should check:

//span[contains(text(),'Create Disbursement')]/ancestor::button

Steps to check:

Press F12 in Chrome -> go to element section -> do a CTRL + F -> then paste the xpath and see, if your desired element is getting highlighted with 1/1 matching node.

If we have 1/1 matching node, Please make sure that:

1. This div is not under an iframe.
2. This div is not under a shadow-root.
3. You should not be on new tab/windows launched by selenium.

If you are sure that we have 1/1 matching node, and above 3 conditions did not meet.

Then you can use the below code trial.

There are basically 4 ways to click in Selenium.

I will use this xpath

//span[contains(text(),'Create Disbursement')]/ancestor::button

Code trial 1:

time.sleep(5)
driver.find_element_by_xpath("//span[contains(text(),'Create Disbursement')]/ancestor::button").click()

Code trial 2:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//span[contains(text(),'Create Disbursement')]/ancestor::button"))).click()

Code trial 3:

time.sleep(5)
button = driver.find_element_by_xpath("//span[contains(text(),'Create Disbursement')]/ancestor::button")
driver.execute_script("arguments[0].click();", button)

Code trial 4:

time.sleep(5)
button = driver.find_element_by_xpath("//span[contains(text(),'Create Disbursement')]/ancestor::button")
ActionChains(driver).move_to_element(button).click().perform()

Imports:

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