无法更改 Ruby Watir 中的下拉选择答案

【问题标题】：Unable to change drop-down selection in Ruby Watir无法更改 Ruby Watir 中的下拉选择
【发布时间】：2021-12-16 15:53:15
【问题描述】：

我正在尝试在下拉列表中一一选择值并且遇到困难。

selenium-webdriver (4.0.3)
水 (7.0.0)
ChromeDriver 94.0.4606.81

下拉菜单是 md-select，点击它会显示一个隐藏的 div，有 2 个选项。

<md-select ng-if="vm.datas.length" ng-model="vm.activeData" ng-change="vm.refreshDash()" id="active-data-select" aria-label="data selector" class="ng-pristine ng-valid md-default-theme ng-empty ng-touched" tabindex="0" aria-disabled="false" role="button" aria-haspopup="listbox" aria-invalid="false" aria-labelledby="active-data-select select_value_label_8" style="" aria-owns="select_listbox_10">
    <md-select-value class="md-select-value" id="select_value_label_8"><span><div class="md-text">My test data 1</div></span><span class="md-select-icon" aria-hidden="true"></span></md-select-value>
</md-select>

<div class="md-select-menu-container md-default-theme md-active md-clickable" aria-hidden="false" role="presentation" id="select_container_9" style="display: block; left: 507px; top: 8px; min-width: 336.891px; font-size: 20px;">  
    <md-select-menu role="presentation" class="_md md-default-theme" style="transform-origin: 152.445px 32px 0px;">
        <md-content role="listbox" tabindex="-1" aria-multiselectable="false" class="_md md-default-theme" id="select_listbox_10" aria-activedescendant="select_option_14">
            <!---->
                <md-option ng-repeat="data in ::vm.datas | orderBy:'name' track by $index" ng-value="data" value="[object Object]" ng-class="{'selected': data.name == vm.activeData.name }" tabindex="0" class="md-default-theme selected md-focused" role="option" id="select_option_14" selected="selected" aria-selected="true"><div class="md-text">My test data 1</div></md-option>
                <!---->
                <md-option ng-repeat="data in ::vm.datas | orderBy:'name' track by $index" ng-value="data" value="[object Object]" ng-class="{'selected': data.name == vm.activeData.name }" tabindex="0" class="md-default-theme" role="option" id="select_option_15"><div class="md-text">My test data 2</div></md-option>
            <!---->
        </md-content>
    </md-select-menu>
</div>

当我尝试执行以下操作以显示隐藏的 div 以选择下一个值时：

browser.element(id: 'active-data-select').click

我收到以下错误：元素定位，但在 30 秒后超时，等待 #<:htmlelement: located: true>"active-data-select"}> 出现

我尝试了很多不同的方法，但还没有找到解决方案。有什么想法吗？

谢谢你， -安德烈

【问题讨论】：

Located true 意味着它找到了元素，但由于某种原因，is Displayed atom 不认为应该能够看到该元素。仔细检查页面上是否存在具有该 ID 的其他元素。
我对 JS 库不熟悉，可能还会仔细检查是否真的可以点击打开它。
感谢您的回复。隐藏的 div 位于选择框的顶部。是否有可能阻止点击？
是的，如果它被隐藏，驱动程序不会点击它。您需要单击未隐藏的内容才能显示隐藏的内容
他们是否可能需要鼠标悬停之类的事件？我已经看到控件只有在指针移到该位置时才会出现您要单击的内容。

标签： ruby selenium watir

【解决方案1】：

如果您确定点击select 元素会解决您的问题

browser.element(id: 'active-data-select').fire_event :click

即使元素被遮挡或不在屏幕上也会执行点击

你也可以试试

browser.element(id: 'active-data-select').send_keys :enter

或

browser.element(id: 'active-data-select').send_keys [:down, :down, :enter]

在您的 html 中，似乎 div select_container_9 持有带有选项元素的选择，所以请尝试

browser.div(id: "select_container_9").select_list.options.first.select

它的 id 似乎是自动生成的，所以应该使用不同的定位器以防万一

但是您可能应该调试页面上有多少选择 browser.selects.count 然后您可以使用browser.selects[x].flash 闪烁每个select 以查明您所追求的那个，然后使用browser.selects[1].options.count 计算该选择中有多少可用选项，然后您可以继续使用@987654331 选择您想要的选项@然后改进定位器

【讨论】：