[FIXED] Selenium: How to locate the element with text Run Insight

Issue

I am automating an internal company webpage that loads its HTML dynamically with javascript. I have been trying to find the XPath for automating a click action (which I did), but somehow while running the script selenium throws an error:

Unable to locate element

The Html content is below:

<mat-nav-list _ngcontent-gki-c5="" class="mat-nav-list mat-list-base" dense="" role="navigation">
      <div _ngcontent-gki-c5="" class="mat-subheading-1 ng-tns-c5-1" style="">Insights</div>

      <!----><a _ngcontent-gki-c5="" class="mat-list-item mat-focus-indicator ng-tns-c5-1 ng-star-inserted" mat-list-item="" href="/insights/home"><div class="mat-list-item-content" style="background: rgb(204, 136, 136); border: 2px solid red;">
  <div class="mat-list-item-ripple mat-ripple" mat-ripple="" style="">
  </div>
    
  <div class="mat-list-text" style=""></div>
        Your Highlights
</div>
</a><a _ngcontent-gki-c5="" class="mat-list-item mat-focus-indicator ng-tns-c5-1 ng-star-inserted" mat-list-item="" href="/insights/downloads"><div class="mat-list-item-content" style="background: rgb(204, 136, 136); border: 2px solid red;">
  <div class="mat-list-item-ripple mat-ripple" mat-ripple="" style="">
  </div>
    
  <div class="mat-list-text" style=""></div>
        Downloads
      
</div>
</a>
      <a _ngcontent-gki-c5="" class="mat-focus-indicator ng-tns-c5-1 mat-list-item menu-item text-neutral-l1 font-size-sub-1 active" mat-list-item="" style=""><div class="mat-list-item-content" style="background: rgb(204, 136, 136); border: 2px solid red;">
  <div class="mat-list-item-ripple mat-ripple" mat-ripple="" style="">
  </div>
          
  <div class="mat-list-text" style=""></div>
        Run Insight
        <mat-icon _ngcontent-gki-c5="" class="mat-icon notranslate ng-tns-c5-1 material-icons ng-trigger ng-trigger-indicatorRotate mat-icon-no-color" role="img" aria-hidden="true" data-mat-icon-type="font" style="transform: rotate(180deg);"> expand_more </mat-icon>
</div>
</a>
      <!----><!---->
        <mat-form-field _ngcontent-gki-c5="" class="cds-mt-4 w-100 inner-icon-prefix mat-form-field ng-tns-c9-6 mat-primary ng-tns-c5-1 mat-form-field-type-mat-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-should-float mat-form-field-has-label mat-form-field-hide-placeholder ng-pristine ng-valid ng-star-inserted ng-touched" style=""><div class="mat-form-field-wrapper">
  <div class="mat-form-field-flex">
    <!---->
  </div>
        </div>
        </mat-form-field>
</mat-nav-list>

I want to click on the text "Run insight" from the dynamically generated list. The xpaths that I used are:

//a[@class='mat-focus-indicator ng-tns-c5-1 mat-list-item menu-item text-neutral-l1 font-size-sub-1 active']
//div[contains(text(),'Run Insight')]
//div[contains(@class, 'mat-list-item-content') and normalize-space(text()) = 'Run insight']

Is there a better XPath for the "Run insight" click action? Any suggestions would be appreciated.

Solution

The desired element is a dynamic element, so to click on the element with text as Run Insight you need to induce WebDriverWait for the element_to_be_clickable() and you can use either of the following locator strategies:

• Using PARTIAL_LINK_TEXT:

  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.PARTIAL_LINK_TEXT, "Run Insight"))).click()
  

• Using XPATH:

  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//mat-nav-list//a[@mat-list-item]//div[@class='mat-list-item-content' and contains(., 'Run Insight')]"))).click()
  

• 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
  

Answered By - undetected Selenium