使用 selenium python 评估选择标签以单击下拉菜单时出错答案

【问题标题】：error while evaluating select tag to click on drop down using selenium python使用 selenium python 评估选择标签以单击下拉菜单时出错
【发布时间】：2022-08-13 21:21:36
【问题描述】：

我正在尝试使用 selenium python 从下拉菜单中选择一个选项，具体取决于以下代码行评估的值

elem = driver.find_element(\'xpath\',\'xpath_value\')
select = Select(driver.find_element(\'xpath\',\'//*[@id=\"qty\"]\'))
select.select_by_visible_text(elem.text)  # value of elem.text = 1

下拉菜单的 HTML 代码如下

select ng-disabled=\"c.data.product.limitPartsQuantity\" ng-if=\"part.dist_channel_status_msg == \'Orderable\' &amp;&amp; !c.data.isLightUser &amp;&amp; part.orderable &amp;&amp; !part.part_error\" id=\"qty\" name=\"qty\" ng-model=\"part.quantity\" ng-change=\"c.partSelected(part)\" class=\"ng-valid ng-scope ng-not-empty ng-dirty ng-valid-parse ng-touched\" style=\"\"> <option value=\"0\">0</option> <option value=\"1\">1</option> <option value=\"2\">2</option> <option value=\"3\">3</option> <option value=\"4\">4</option> <option value=\"5\">5</option> <option value=\"6\">6</option> <option value=\"7\">7</option> <option value=\"8\">8</option> <option value=\"9\">9</option> <option value=\"10\">10</option> <!-- ngIf: c.data.type==\'trade\' && c.pcf==false --><option ng-if=\"c.data.type==\'trade\' &amp;&amp; c.pcf==false\" value=\"15\" class=\"ng-scope\" style=\"\">15</option><!-- end ngIf: c.data.type==\'trade\' && c.pcf==false --> <!-- ngIf: c.data.type==\'trade\' && c.pcf==false --><option ng-if=\"c.data.type==\'trade\' &amp;&amp; c.pcf==false\" value=\"20\" class=\"ng-scope\">20</option><!-- end ngIf: c.data.type==\'trade\' && c.pcf==false --> <!-- ngIf: c.data.type==\'trade\' && c.pcf==false --><option ng-if=\"c.data.type==\'trade\' &amp;&amp; c.pcf==false\" value=\"25\" class=\"ng-scope\">25</option><!-- end ngIf: c.data.type==\'trade\' && c.pcf==false --> <!-- ngIf: c.data.type==\'trade\' && c.pcf==false --><option ng-if=\"c.data.type==\'trade\' &amp;&amp; c.pcf==false\" value=\"30\" class=\"ng-scope\">30</option><!-- end ngIf: c.data.type==\'trade\' && c.pcf==false --> <!-- ngIf: c.data.type==\'trade\' && c.pcf==false --><option ng-if=\"c.data.type==\'trade\' &amp;&amp; c.pcf==false\" value=\"50\" class=\"ng-scope\">50</option><!-- end ngIf: c.data.type==\'trade\' && c.pcf==false --> <!-- ngIf: c.data.type==\'trade\' && c.pcf==false --><option ng-if=\"c.data.type==\'trade\' &amp;&amp; c.pcf==false\" value=\"75\" class=\"ng-scope\">75</option><!-- end ngIf: c.data.type==\'trade\' && c.pcf==false --> <!-- ngIf: c.data.type==\'trade\' && c.pcf==false --><option ng-if=\"c.data.type==\'trade\' &amp;&amp; c.pcf==false\" value=\"100\" class=\"ng-scope\">100</option><!-- end ngIf: c.data.type==\'trade\' && c.pcf==false --> </select>

但是当代码运行时，会产生以下错误

selenium.common.exceptions.StaleElementReferenceException：消息：过时的元素引用：元素未附加到页面文档

我可以通过修改代码来解决错误，如下所示
elem = driver.find_element(\'xpath\',\'xpath_value\')
value = elem.text            # value = 1
select = Select(driver.find_element(\'xpath\',\'//*[@id=\"qty\"]\'))
select.select_by_visible_text(value)
我想知道为什么第一行代码失败但第二行代码有效，尽管它们基本上是相同的表达式。

你能确认这个网址，它可以公开访问吗？
发生这种情况是因为在多次往返浏览器上下文和返回之间...... DOM 发生了变化。这很常见，您应该考虑切换到 css_selector，因为 xpath 相对较慢。
@Abhishek 您要选择哪个<option>？
@platipus_on_fire 不，URL 是私有的。
@pguardiario 非常感谢。看了你的评论，我明白了逻辑。

标签： javascript python selenium select drop-down-menu

【解决方案1】：

从您提供的 HTML 中：

<select ng-disabled="c.data.product.limitPartsQuantity" ng-if="part.dist_channel_status_msg == 'Orderable' &amp;&amp; !c.data.isLightUser &amp;&amp; part.orderable &amp;&amp; !part.part_error" id="qty" name="qty" ng-model="part.quantity" ng-change="c.partSelected(part)" class="ng-valid ng-scope ng-not-empty ng-dirty ng-valid-parse ng-touched" style=""> 
    <option value="0">0</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    ...  
    ... 
    ...  
    <option value="10">10</option> 
    <!-- ngIf: c.data.type=='trade' && c.pcf==false -->
    <option ng-if="c.data.type=='trade' &amp;&amp; c.pcf==false" value="15" class="ng-scope" style="">15</option>
    <!-- end ngIf: c.data.type=='trade' && c.pcf==false --> 
    ...
    ...
    ...
    <option ng-if="c.data.type=='trade' &amp;&amp; c.pcf==false" value="100" class="ng-scope">100</option>
    <!-- end ngIf: c.data.type=='trade' && c.pcf==false --> 
</select>

很明显，html-select 元素及其后代<option>元素是Angular 元素。

解决方案

选择带有文本的<option>1您需要为element_to_be_clickable() 诱导WebDriverWait，您可以使用以下任一locator strategies：

使用CSS_SELECTOR和select_by_value()：

Select(WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "select#qty[name='qty']")))).select_by_value('1')

使用路径和select_by_visible_text()：

Select(WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//select[@id='qty' and @name='qty']")))).select_by_visible_text('1')

笔记：您必须添加以下导入：

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

【讨论】：