CODEWITHSUNDEEP
htmlselenium-webdriverxpathwebdriverwaitpartiallinktext
Benjamin Peinhardt
Benjamin Peinhardt

Reputation: 486

How to locate an element using Selenium by its visible text

I have this common situation where I want to locate an element by it's visible text, but the text is next to an i tag used for icons (not sure if this is valid HTML or not). It's the way a certain button component is set up that's used all over the site under test.

Here's some example HTML

<a href="#/provider_data_files/create" ng-click="providerDataFileCtrl.showAddProviderDataFileModal()" class="btn btn-primary pull-right">
        <i class="fa fa-plus btn-icon"></i> 
        Add Provider Data File
</a>

For the moment, ignore all the other ways to locate this link, as my use case requires using the visible text. How can I locate this element by the visible text? The xpath:

//*[contains(text(), 'Add Provider Data File')]

fails, I assume because of the weird structure.

Upvotes: 1

Views: 573

Answers (1)

undetected Selenium
undetected Selenium

Reputation: 193078

Given the html:

<a href="#/provider_data_files/create" ng-click="providerDataFileCtrl.showAddProviderDataFileModal()" class="btn btn-primary pull-right">
    <i class="fa fa-plus btn-icon"></i> 
    Add Provider Data File
</a>

The desired <a> node consists of 2 child nodes:

  • A <i> node
  • A Text node with the text Add Provider Data File

Solution

To locate the element by it's visible text i.e. Add Provider Data File you can use either of the following locator strategies:

  • Using PARTIAL_LINK_TEXT:

    element = driver.find_element(By.PARTIAL_LINK_TEXT, "Add Provider Data File")

  • Using XPATH:

    element = driver.find_element(By.XPATH, "//a[contains(., 'Add Provider Data File')]")

To locate the visible element you need to induce WebDriverWait for the visibility_of_element_located() and you can use either of the following locator strategies:

  • Using PARTIAL_LINK_TEXT:

    element = WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.PARTIAL_LINK_TEXT, "Add Provider Data File")))

  • Using XPATH:

    element = WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.XPATH, "//a[contains(., 'Add Provider Data File')]")))

  • 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

Proof of concept

Add Provider Data File

Upvotes: 2

Related Questions