无法在 python 中使用 selenium 单击 Angular 组件

Question

我想要做的是单击在 python 中使用 Selenium 用 Angular 编写的特定按钮/跨度/输入。当单击包含值test search... 的跨度时，将激活搜索属性。输入搜索短语后，组合框将显示相关结果列表。

问题说明图：

1。

2。 3. 选择第一个结果并点击它。

为此，我实现了以下代码：

buy_container = driver.find_elements_by_xpath("//div[@class='instrument-search-box ng-isolate-scope']/button[@ng-click='titleClicked()']")
buy_container.click()
buy_container.send_keys('Mostafa')

AttributeError: 'list' 对象没有属性 'click'

我已经搜索了整个源代码以查找是否有与ng-click='titleClicked()'相同类型函数的类，但我没有找到！

源代码

<div
  class="instrument-search-box ng-isolate-scope"
  focus-me="page.doSearch"
  show-btns="true"
  show-search="page.myList != 2"
  show-add-to-watch="page.myList == 1"
  select="getThisInstrument(instrument)"
  empty="emptyFirstInstrument()"
  add="marketWatch.addToWatch(instrument)"
  parent="theScope"
>
  <!-- ngIf: showWatchListCombo && $root.setting.closeRightBar && $root.changeLayout!==1 --><!-- ngIf: showWatchListCombo && $root.setting.closeRightBar && $root.changeLayout!==1 -->
  <div
    class="search-part searchable"
    ng-class="{'select-watch-list': showWatchListCombo &amp;&amp; $root.setting.closeRightBar &amp;&amp; $root.changeLayout!==1}"
  >
    <i
      class="question"
      ng-click="$root.showHelpModal('searchInstrument', $event)"
    ></i
    ><i class="Font Ico-search" ng-click="titleClicked()"></i>
    <div
      class="typeahead ng-isolate-scope ng-valid ng-hide ng-not-empty"
      ng-show="ins.doSearch"
      focus-me="focusMe"
      instrument-combo=""
      ng-model="ins.instrumentName"
      select="getInstrument(item)"
      empty="emptyInstrument()"
    >
      <input
        ng-disabled="ngDisabled"
        ng-model="ngModel"
        ng-change="query()"
        type="search"
        autocomplete="off"
        style="width: 100%;"
        placeholder="جستجوی نماد"
        class="ng-pristine ng-untouched ng-valid ng-not-empty"
        ng-show="ins.doSearch"
        focus-me="focusMe"
        instrument-combo=""
      /><!-- ngIf: isLoading -->
      <div class="combo" style="display: none;">
        <table class="table">
          <thead>
            <tr>
              <th>عنوان</th>
              <th>شرکت</th>
              <th>بازار</th>
            </tr>
          </thead>
          <tbody>
            <!-- ngRepeat: instrument in items -->
          </tbody>
        </table>
      </div>
    </div>
    <span
      ng-click="titleClicked()"
      ng-show="$root.selectedInstrument &amp;&amp; $root.selectedInstrument.Isin &amp;&amp; !ins.doSearch"
      title="با کلیک روی این قسمت امکان جستجوی نماد برای شما فراهم میگردد"
      class="ng-binding"
    >
      test search... </span
    ><!-- ngIf: (!$root.selectedInstrument || !$root.selectedInstrument.Isin) && !ins.doSearch -->
  </div>
  <div class="action">
    <!-- ngIf: showAddToWatch && ins.instrument && ins.instrument.Isin && $root.firstInstrument && ins.instrument.Isin == $root.firstInstrument.Isin --><!-- ngIf: showEmpty --><!-- ngIf: showBtns --><button
      class="btn-buy ng-scope"
      ng-if="showBtns"
      ng-click="$root.showOrderEntryModal('buy', 'SearchBar')"
    >
      خرید</button
    ><!-- end ngIf: showBtns --><!-- ngIf: showBtns --><button
      class="btn-Sell ng-scope"
      ng-if="showBtns"
      ng-click="$root.showOrderEntryModal('sell', 'SearchBar')"
    >
      فروش</button
    ><!-- end ngIf: showBtns -->
  </div>
  <!-- ngIf: !ins.doSearch && $root.selectedInstrument && $root.selectedInstrument.Isin && checkTime() --><!-- ngIf: !ins.doSearch && $root.selectedInstrument && $root.selectedInstrument.Isin && !checkTime() --><span
    title="قیمت پایانی"
    class="field ng-binding ng-scope green"
    ng-if="!ins.doSearch &amp;&amp; $root.selectedInstrument &amp;&amp; $root.selectedInstrument.Isin &amp;&amp; !checkTime()"
    ng-class="{green: $root.selectedInstrument.FinalPrice > 0, red: $root.selectedInstrument.FinalPrice < 0}"
    ><i class="question" ng-click="$root.showHelpModal('order', $event)"></i
    >
</div>

PS：我也尝试了以下方法，但遇到了另一个错误：

buy_container = WebDriverWait(driver, 5).until(EC.element_to_be_clickable((By.XPATH,"//div[@class='instrument-search-box ng-isolate-scope']/button[@ng-click='titleClicked()']")))
buy_container.click()

43 buy_container = WebDriverWait(driver, 5).until(EC.element_to_be_clickable((By.XPATH,"//div[@class='instrument-search-box ng-isolate-scope']/button[@ng-click='titleClicked()']")))
     44 buy_container.click()
     45 # buy_container.send_keys('Mostafa')

/home/mostafa/.local/lib/python3.6/site-packages/selenium/webdriver/support/wait.py in until(self, method, message)
     78             if time.time() > end_time:
     79                 break
---> 80         raise TimeoutException(message, screen, stacktrace)
     81 
     82     def until_not(self, method, message=''):
TimeoutException: Message:  

它没有唯一标识符或名称等属性，我该如何解决这个问题？

Answer 1

find_elements_by_xpath 返回一个列表，使用find_element_by_xpath。由于 Angular 正在更新 DOM，我会建议使用“等待”策略，如下所示。

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

driver = webdriver.Chrome("PATH_TO_CHROMEDRIVER")

buy_container = WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH,"//span[contains(., 'test search...')]")))
#(By.XPATH,"//i[@ng-click='titleClicked()']")
buy_container.click()