javascript 如何使用 node.js 在 selenium webdriver 中选择下拉值

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26041791/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 05:24:25  来源:igfitidea点击:

how to select a dropdown value in selenium webdriver using node.js

javascriptselenium

提问by Pritam Maske

I have following HTML structure :

我有以下 HTML 结构:

<button class="dropdown-toggle selectpicker btn btn-primary" data-toggle="dropdown" type="button" data-id="strategic_reseller_country" title="United States">
<div class="dropdown-menu open" style="max-height: 245.6px; overflow: hidden; min-height: 40px;">
<ul class="dropdown-menu inner selectpicker" role="menu" style="max-height: 243.6px; overflow-y: auto; min-height: 38px;">
<li class="" rel="0">
<a class="" style="" tabindex="0">
<span class="text"/>
<i class="glyphicon glyphicon-ok icon-ok check-mark"/>
</a>
</li>
<li rel="1">
<a class="" style="" tabindex="0">
<span class="text">Andorra</span>
<i class="glyphicon glyphicon-ok icon-ok check-mark"/>
</a>
</li>
<li rel="2">
<a class="" style="" tabindex="0">
<span class="text">United Arab Emirates</span>
<i class="glyphicon glyphicon-ok icon-ok check-mark"/>
</a>
</li>
<li rel="3">
<a class="" style="" tabindex="0">
<span class="text">Afghanistan</span>
<i class="glyphicon glyphicon-ok icon-ok check-mark"/>
</a>
</li>
<li rel="4">
<li rel="5">
<li rel="6">
<li rel="7">
<li rel="8">
<li rel="9">
<a class="" style="" tabindex="0">
<span class="text">Netherlands Antilles</span>
<i class="glyphicon glyphicon-ok icon-ok check-mark"/>
</a>
</li> 
</ul>
</div>

So how could I get the item from list?

那么我怎么能从列表中获取项目呢?

I am new to Node.Js(JavaScript) so I don't know how to achieve it in node.Jsbut it can be achieved in java as follows :

我是Node.Js(JavaScript) 的新手,所以我不知道如何实现它,node.Js但它可以在 Java 中实现,如下所示:

Select dropdown = new Select(driver.findElement(By.class("dropdown-menu inner selectpicker"))); 
dropdown.selectByVisibleText("Andorra");

采纳答案by Meetai.com

I would use Cheeriofor this.

我会为此使用Cheerio

module.exports = {
    "login": function (browser) {
        var cheerio = require("cheerio")

        browser
            .url("http://www.wikipedia.org")
            .waitForElementVisible('body', 1000)
            .waitForElementVisible('select#searchLanguage', 1000)
            .source(function(result) { // .source() dump the page source in the variable
                $ = cheerio.load(result.value)
                var num_languages = $('select#searchLanguage option').length
                console.log('Wikipedia.org Languages: ' + num_languages);
            })
            .end();
    }
};

or simply using the .execute()command

或者简单地使用.execute()命令

回答by Andrew Cope

Just click the desired option.

只需单击所需的选项。

driver.findElement(webdriver.By.css('#mySelection > option:nth-child(4)'))
    .click();

Note that I've changed your 'By' to a css selector. I'm lazy and like to just drill into the option from developer tools and select Copy CSS Path (chrome) or Copy Unique Selector (firefox).

请注意,我已将您的“By”更改为 css 选择器。我很懒,喜欢从开发人员工具中钻取选项并选择复制 CSS 路径 (chrome) 或复制唯一选择器 (firefox)。

回答by UnTalJohanPerez

You can create a function that select the value you desire

您可以创建一个函数来选择您想要的值

like this...

像这样...

driver.wait(
    until.elementLocated(By.id("continents")), 20000
).then(element => {
    selectByVisibleText(element, "Africa")
});

function selectByVisibleText(select, textDesired) {
    select.findElements(By.tagName('option'))
    .then(options => {
        options.map(option => {
            option.getText().then(text => {
                if (text == textDesired)
                    option.click();
            });
        });
    });
}

回答by GARPdev

For anyone stuck on this, heres how I did it for a option:

对于任何坚持这一点的人,这是我如何做的一个选项:

<select id='mySelection'>
   <option value='0'>Hello</option>
   <option value='1'>Everybody</option>
   <option value='2'>Got</option>
   <option value='3'>It</option>
</select>

In Selenium for NodeJS, you would grab the "It" :

在用于 NodeJS 的 Selenium 中,您将获取 "It" :

var webdriver = require('selenium-webdriver');

var driver = new webdriver.Builder().
   withCapabilities(webdriver.Capabilities.chrome()).
   build();


driver.findElement(webdriver.By.id('mySelection')).sendKeys('3');

When you .sendKeys() for the option it has to equal the value=''

当您为选项使用 .sendKeys() 时,它必须等于 value=''

In your case just grab the parent element then sendKeys() for the child element.

在您的情况下,只需获取父元素,然后为子元素使用 sendKeys() 即可。