使用webdriver.js，如何获得<select>的选定选项？

Question

大量的java和C＃的答案，但我找不到如何在JavaScript中做到这一点。似乎API是不同的...

Answer 1

是的，这是可能的。假设我们有以下select元素：

<select name="test" id="select"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
</select> 

您使用getValue获取当前选定的选项，您可以使用click更改选择。这里有一个简单的例子：

var webdriverjs = require('webdriverjs'), 
    client  = webdriverjs.remote({desiredCapabilities:{browserName:'phantomjs'}}).init(); 

client 
    .url('http://localhost:8080') 
    .getValue('#select',function(err,val){ 
     console.log(val); // will output "1" 
    }) 
    .click('//*[@id="select"]/option[3]') 
    .getValue('#select',function(err,val){ 
     console.log(val); // will output "3" 
    }) 
    .end(); 

希望有帮助。

欢呼

Answer 2

对于那些谁只是在寻找纯WebDriverJS的解决方案，而不是具体的像webdriver.io或量角器任何框架，这里是代码，

var element = driver.findElement(wd.By.id('mySelect')); 
element.getAttribute('value').then(function(selected) { 
    if(selected === 'the one I expected') { 
     done(); 
    } 
    else { 
    done(new Error('something went wrong'); 
    } 
}); 

Answer 3

如果您想要的选项元素，使用then回调的返回值：

driver.findElement(By.css('select[name=eventTypes]')) 
    .then((select) => { 
    return select.getAttribute('value').then((value) => { 
     return {select: select, value: value}; 
    }); 
    }) 
    .then((data) => { 
    return data.select.findElement(By.css('option[value="'+data.value+'"]')); 
    }) 
    .then((option) => { 
    //do something. 
    }); 

Answer 4

如果你有这个在你的HTML为例

<select name="test" id="myId"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
</select> 

您可以像这样

var driver = new firefox.Driver(); 
driver.findElement(By.css('#myId>option:nth-child(2)')).click(); 

为我过了例如选择3选择，我使用硒的webdriver用JavaScript