我正在尝试使用以下函数返回列表中存在的选项。
.HTML
<select>
<option>one</option>
<option>two</option>
<option>three</option>
<select>
功能
getValues(){
var ele = element(by.xpath("......../select"));
return ele.all(by.tagName('option')).getAttribute('value').getText().then(function (text){
for (var i = 0; i < text.length; i++) {
text[i] = text[i].trim();
}
return text;
});
}
当我使用console.log(getValues())在控制台中打印值时，控制台显示ManagedPromise{.....}函数而不是选项。
但是我希望这些选项["one","two","three"]数组。谁能帮我？
如果你也可以这样做，为什么要为它创建一个复杂的方法
getValues() {
return element.all(by.css('select option')).getText();
}该getText()也可以在 ElementFinderArray 上执行，它将返回一个包含['one', 'two', 'three']
的承诺更新：带修剪功能
首先，由于两个原因，您的代码将无法正常工作：
- 量角器使用承诺，您首先需要解析承诺，然后才能使用该值。另请参阅您之前提出的 1 个问题
- 您正在使用
.getAttribute('value').getText().这永远不会奏效。
您将在下面找到 3 种不同样式的工作示例。
// with your code
getValues() {
var ele = element(by.xpath("......../select"));
return ele.all(by.tagName('option'))
.map(function(option) {
return option.getText()
.then(function(optionText) {
return optionText.trim();
});
});
}
// with protractor shorthand notation
getValues() {
return $$('select option').map((option) => {
return option.getText()
.then((optionText) => {
return optionText.trim();
});
});
}
// 1 line
getValues() {
return $$('select option').map((option) => option.getText().then((optionText) => optionText.trim()));
}最优雅的方式是使用.map()。 请参阅文档。
您唯一需要记住的是，.map()返回A promise that resolves to an array of values returned by the map function.
<!DOCTYPE html>
<html>
<body>
<select id="sel">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
<p>Click the button to display values</p>
<button onclick="clickHandler()">Try it</button>
<p id="demo"></p>
</body>
<script "text/javacript">
function clickHandler() {
var options = document.getElementById("sel").childNodes;
let results =[];
[].forEach.call(options, function(option) {
if (option instanceof HTMLOptionElement) {
results.push(option.text);
// Swap for option.value if you like too would be lower case
}
});
document.getElementById("demo").innerHTML = results.toString();
}
</script>
</html>
在此处
观看现场演示 HTMLOptionElement on MDN