1

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.

undetected Selenium
  • 183,867
  • 41
  • 278
  • 352
Benjamin Peinhardt
  • 406
  • 3
  • 13

1 Answers1

2

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

undetected Selenium
  • 183,867
  • 41
  • 278
  • 352
  • Wow what an awesome answer :) This is exactly what I needed. I appreciate the more general XPath solution as well for similar situations with non-anchor tags. It seems like the only difference in our XPath solutions is that you replace text() with the `.` operator. I'd be interested to know exactly what the text function does, may have to go down a rabbit hole :) – Benjamin Peinhardt Feb 27 '23 at 19:36
  • Feel free to discuss incase any queries in [Selenium](https://chat.stackoverflow.com/rooms/223360/selenium) room. – undetected Selenium Feb 27 '23 at 19:38