选择->选项抽象

In Python, Java and several other selenium bindings, there is a very convenient abstraction over select->option HTML constructions, a Select class.For example, imagine there is the following select tag:<select id="fruits" class="select" name="fruits"> <option value="1">Banana</option> <option value="2">Mango</option></select>Here is how we can operate it in Python:from selenium.webdriver.support.ui import Selectselect = Select(driver.find_element_by_id('fruits'))# get all optionsprint select.options# get all selected optionsprint select.all_selected_options# select an option by valueselect.select_by_value('1')# select by visible textselect.select_by_visible_text('Mango')In other words, it is a very transparent and easy to use abstraction.Is is possible to manipulate select tag in protractor in a similar manner? 解决方案 No such thing in Protractor, but we can write our own:select-wrapper.js'use strict';var SelectWrapper = function(selector) { this.webElement = element(selector);};SelectWrapper.prototype.getOptions = function() { return this.webElement.all(by.tagName('option'));};SelectWrapper.prototype.getSelectedOptions = function() { return this.webElement.all(by.css('option[selected="selected"]'));};SelectWrapper.prototype.selectByValue = function(value) { return this.webElement.all(by.css('option[value="' + value + '"]')).click();};SelectWrapper.prototype.selectByPartialText = function(text) { return this.webElement.all(by.cssContainingText('option', text)).click(); };SelectWrapper.prototype.selectByText = function(text) { return this.webElement.all(by.xpath('option[.="' + text + '"]')).click(); };module.exports = SelectWrapper; Usagevar SelectWrapper = require('select-wrapper');var mySelect = new SelectWrapper(by.id('fruits'));# select an option by valuemySelect.selectByValue('1');# select by visible textmySelect.selectByText('Mango');Note that Select is a reserved word in JavaScript 这篇关于选择-&gt;选项抽象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！