6
votes

Comment trouver des éléments HTML spécifiques, AngularJs, Protractor

Je suis nouveau à Angularjs / Protractor, de sorte que tout conseil sur ceci est très apprécié. Étant donné que les JS angulaires instancient des éléments HTML via NG-Directives, il n'y a pas d'identifiant, etc. qui me permettent de localiser des éléments spécifiques. (Évidemment, je veux faire cela pour valider le contenu, cliquez sur eux, etc.) Mon extrait JS angulaire ressemble à:

element.all(by.repeater('item in myList')).then(function(rows) {
    noOfItems = rows.length;
    for (i = 0; i < noOfItems; i++) {
        row = element.all(by.repeater('item in myList')).get(i);
        row.isElementPresent(By.id('foo')).then(function (isP) {
            if (isP) {
                console.log("foo exists?" + isP);
                row.findElement(By.id('foo')).then(function (el) {
                    el.getText(txt).then(function (txt) {
                        console.log("Item name  " + txt);
                    });
                });
            }
        });
    }
});


1 commentaires

Etrange, rangée.findellement (...) devrait lancer une erreur, car il s'agit d'une matrice et ne doit pas avoir la fin de la fonction. ligne [0] .Findélialement devrait fonctionner. "Foo existe?" apparaît dans la console journal?


3 Réponses :


1
votes

Avant de répondre à votre question spécifique, deux choses semblent être abusives ici.

1) Je ne pense pas que la ligne 4 dans ce qui précède est ce que vous voulez faire. Il va revenir au navigateur pour chaque rangée, réorganisant la requête By.Repeater à chaque fois. Tout ce que vous avez vraiment besoin de faire est rangée = rangées [i] .

2) Mieux encore, vous pouvez simplement remplacer les quatre premières lignes avec élément.all (by.Repeeater ("élément de myList ')). Chaque (fonction (ligne) {

Quant à la question de la recherche de la SPAN FOO dans le contexte, vous pouvez essayer de trouver by.css (': étendue #foo') . Cela devrait vous donner une recherche d'ID = 'FOO' dans la portée de l'élément actuel.


0 commentaires

1
votes

Par une autre approche pour trouver les éléments générés angulaires droits consiste à utiliser le localisateur by.js . Ce n'est pas un localisateur spécifique de Protractor mais une fournie par le webdiverj sous-jacent, vous devez donc regarder Il pour les docs.

essentiellement by.js vous permet de fournir une fonction JavaScript qui sera exécutée sur le navigateur pour trouver l'élément que vous recherchez. Le JavaScript peut à son tour peut interroger des éléments DOM pour rechercher et inspecter les étendues de dollars angulaires qui leur ont été attachées et trouvent ainsi des éléments qui ont des valeurs de portée spécifiques. Par exemple, vous pouvez ainsi trouver un élément associé à un enregistrement réel qui est présent dans la portée mais n'a jamais été rendu dans HTML. Ceci est très utile car, étant donné à quel point les œuvres angulaires, vous devez rarement rendre ces types d'identifiants dans HTML, mais les tests doivent toujours pouvoir trouver les éléments qui les représentent!


0 commentaires

0
votes
var eleB = element(by.css('.ui-grid-render-container.ng-isolate-scope.ui-grid-render-container-body'));

eleB.element(by.repeater('(rowRenderIndex, row) in rowContainer.renderedRows track by $index').row(10)).$('.ui-grid-cell.ng-scope.ui-grid-coluiGrid-000B').getText().then(function(arr){
            console.log("-------------------\n" + arr);
});

1 commentaires