web-dev-qa-db-fra.com

Comment obtenir la valeur d'option de l'élément select

J'essaie d'obtenir la valeur d'option d'un élément select en utilisant Protractor. Cependant, je ne parviens pas à trouver l'élément option.

HTML

<select ng-options="opions.c as options.n for option in options" ng-model="model">
    <option value="0">Option 1</option>
    <option value="1">Option 2</option>
</select>

Fichier de spécification 

describe('testing select option', function() {
    it('', function() {
        ptor = protractor.getInstance();

        //This will not get the option required
        ptor.findElement(protractor.By.binding('model'));
    });
});

Je n'arrive pas à trouver un moyen de saisir la valeur de l'option car je n'ai pas trouvé de fonction que je puisse utiliser qui ne donne pas d'exception ni de message d'erreur.

Est-ce que quelqu'un sait comment résoudre ce problème?

angularjsprotractor
17
Ian Richards

ok encore une fois, je suis maintenant capable de comprendre comment saisir l'élément d'option avec le rapporteur.

l'exemple de code ci-dessous montre comment y parvenir.

ptor.findElement(protractor.By.css('select option:nth-child(value of the option you require IE: the number)')).click();
5
Ian Richards

J'ai eu quelques problèmes pour que les listes déroulantes fonctionnent bien et j'ai passé du temps aujourd'hui à le régler (et je le partage donc ici au cas où quelqu'un le trouverait utile).

Dans les versions précédentes de Protractor, il y avait une by.selectedOption, qui fait en réalité la même chose que by.select, mais ne renvoie que l'élément sélectionné. Ainsi, pour obtenir le texte de l'option sélectionnée ci-dessus, vous pourriez avoir:

expect(element(by.selectedOption('model')).getText()).toEqual('Option 1');

J'ai écrit un article de blog si vous voulez plus de détails, il couvre également une fonction d'aide pour sélectionner l'option dans le menu déroulant: http://technpol.wordpress.com/2013/12/01/protractor-and-dropdowns-validation/

Les versions récentes de rapporteur ont supprimé cette fonction, la remplaçant par:

expect(element(by.id('my_id')).element(by.css('option:checked')).getText();

Ce qui est plus flexible, car il peut être appliqué à n’importe quel chercheur, alors que selectedOption ne fonctionnait qu’avec un modèle de Finder.

35
PaulL

Essayez d'utiliser xPath:

ptor.findElement(protractor.By.xpath('//select/option[1]'));

Vous pouvez utiliser la même technique pour choisir une option par valeur:

protractor.By.xpath('//select/option[text()="Option 2"]'));

J'ai eu besoin de faire cela pour configurer des formulaires où les entrées sont visibles en fonction des listes déroulantes sélectionnées, par exemple:

makeFord = protractor.By.xpath('//select[@id="make"]/option[text()="Ford"]'));
modelMustang = protractor.By.xpath('//select[@id="model"]/option[text()="Mustang"]'));
makeFord.click();
modelMustang.click();
0
corinna000

Voici comment vous pouvez obtenir la valeur d'une option dans une sélection:

HTML

<select ng-options="opions.c as options.n for option in options" ng-model="model">
    <option value="Africa">Option 1</option>
    <option value="Switzerland">Option 2</option>
</select>

fichier .spec

describe("Country <select>", function() {

  it("should have 'Africa' as the value of the first option", function() {

    browser.get('index.html');

    let all_options = element.all(
      by.options("opions.c as options.n for option in options") //use whatever string is assigned to the ng-options attribute in the html
    );

    let first_option = all_options.get(0);  //or all_options.first()
    let second_option = all_options.get(1); //or all_options.last()

    expect(
      first_option.getAttribute('value')
    ).toEqual("Africa");                           

  });

});

Pour obtenir la valeur d'un option sélectionnée (qui peut être une option sélectionnée par programme avec un rapporteur en appelant click () sur une option):

    expect(
      element(    
        by.model('model') //'model' is the string assigned to the select's ng-model attribute                                
      ).element(                  
          by.css('option:checked') 
        ).getAttribute('value')
    ).toEqual('Swizerland');
0
7stud

CA aidera.

//check whether the selected value is equal to the expected value.
expect(element(by.model("model")).getAttribute('value')).toEqual("0");

//catch the selected value
element(by.model("model")).getAttribute('value').then(function (value) {
   console.log('selected value', value);
});
0
Priyalal Koggalage