Select Kendo 使用 Selenium 的下拉菜单 IDE

Select Kendo Dropdown with Selenium IDE

我正在使用 Selenium IDE,但我无法从 kendo 下拉菜单中 select 我想要的项目。有人知道如何使用 Selenium IDE 做到这一点吗? (或者在 C# 中,但我暂时无法对其进行测试)。

这是一个有下拉菜单的网站,我试图通过断言其他一些下拉选项来练习,但没有成功。 http://derp-bear.herokuapp.com/ui_widgets/kendo_ui_example

<tr>
    <td>open</td>
    <td>http://derp-bear.herokuapp.com/ui_widgets/kendo_ui_example</td>
<td></td>
</tr>
<tr>
    <td>click</td>
    <td>css=span.k-input</td>
    <td></td>
</tr>
<tr>
    <td>assertText</td>
    <td>css=span.k-input</td>
    <td>XL - 7 5/8</td>
</tr>

任何帮助都会很棒!

这不是传统的 select 下拉菜单。所以下拉菜单和选项在两个不同的地方。

下拉箭头位于下面的代码

<span class="k-select" unselectable="on">
    <span class="k-icon k-i-arrow-s" unselectable="on">select</span>
</span>

可以使用 css 选择下拉箭头

css=span.k-select    

下拉选项位于以下位置。单击下拉箭头后将激活此部分。

<ul class="k-list k-reset" unselectable="on" style="overflow: auto;" tabindex="-1" role="listbox" aria-hidden="true" id="size_listbox" aria-live="off">
    <li class="k-item" unselectable="on" role="option" tabindex="-1">S - 6 3/4</li>
    <li class="k-item" unselectable="on" role="option" tabindex="-1">M - 7 1/4</li>
    <li class="k-item k-state-selected k-state-focused" unselectable="on" role="option" tabindex="-1" id="size_option_selected" aria-selected="true">L - 7 1/8</li>
    <li class="k-item" unselectable="on" role="option" tabindex="-1">XL - 7 5/8</li>
</ul>

可以使用 xpath 选择 4 个下拉选项中的任何一个

xpath=//li[@class='k-item'][.='L - 7 1/8']

Selenium IDE 代码如下:

<tr>
    <td>open</td>
    <td>/ui_widgets/kendo_ui_example</td>
    <td></td>
</tr>
<tr>
    <td>click</td>
    <td>css=span.k-select</td>
    <td></td>
</tr>
<tr>
    <td>pause</td>
    <td>3000</td>
    <td></td>
</tr>
<tr>
    <td>click</td>
    <td>xpath=//li[@class='k-item'][.='XL - 7 5/8']</td>
    <td></td>
</tr>
<tr>
    <td>pause</td>
    <td>3000</td>
    <td></td>
</tr>
<tr>
    <td>assertText</td>
    <td>css=span.k-input</td>
    <td>XL - 7 5/8</td>
</tr>

使用 pause 等待内容加载。