web-dev-qa-db-fra.com

Rechercher des éléments par attributs de données

J'améliore mes tests avec RSpec et capybara-webkit, en essayant de supprimer tous les sélecteurs css et xpath comme

find('#edit_user > div:nth-child(7) > div > div > button').click

et je cherche la meilleure option pour les remplacer.

J'allais utiliser le css class des éléments mais un testeur de capybara "pro" a dit que ce n'était pas la meilleure option.

Ma question est donc: puis-je utiliser les attributs data dans mes tests?
Si j'ai un élément

<button name="button" type="submit" class="button last" data-test="edit.update">Update/button>

pourrai-je faire

find('edit.update').click

?

Et pensez-vous que c'est une bonne idée? Si vous avez plus d'idées/infos sur ce sujet, n'hésitez pas à commenter!

ruby-on-railstestingrspeccapybaracapybara-webkit
17
thefabbulus

Pour localiser les éléments par leur attribut data- *, vous devez utiliser un sélecteur CSS ou XPath.

Pour le sélecteur CSS:

find('button[data-test="edit.update"]').click

Pour XPath:

find('//button[@data-test="edit.update"]').click

Que ce soit ou non une bonne idée dépend vraiment de l'application. Vous voulez choisir quelque chose qui identifie l'élément de manière unique. Si "edit.update" ne va pas être unique, ce ne serait pas un bon choix à utiliser. L'attribut class conviendrait si le bouton avait une classe unique, ce que "bouton" et "dernier" ne sont probablement pas.

La meilleure approche est vraiment d'utiliser des attributs statiques id car ils doivent être uniques dans la page et sont moins susceptibles de changer. La méthode find prend également en charge la localisation des éléments par id, ce qui signifie que vous n'avez pas à écrire de sélecteurs CSS ou XPath.

23
Justin Ko

La réponse donnée par Justin Ko est correcte, je voulais juste ajouter quelque chose d'un peu plus avancé qui peut aider à tester la lisibilité dans certaines situations. Vous pouvez ajouter vos propres "sélecteurs" à Capybara, donc si vous vouliez vraiment sélectionner des choses par un attribut de test de données (ce n'est pas une bonne idée car vous ne voulez pas vraiment ajouter des attributs uniquement pour les tests), vous pourriez faire beaucoup de choses

Capybara.add_selector(:dt) do
  css { |v| "*[data-test=#{v}]" }
end

ce qui permettrait

find(:dt, 'edit.update')

cela peut rendre les tests compréhensibles tout en limitant les requêtes CSS ou de chemin compliquées à un seul endroit dans votre code de test. Vous pouvez ensuite définir une méthode telle que

def find_by_dt(value)
 find(:dt, value)
end

si vous préférez le look de find_by_dt ...) pour trouver (: dt, ...)

Vous pouvez également ajouter des filtres et des descriptions à vos propres sélections pour plus de flexibilité, de meilleures descriptions d'erreurs, etc. - voir https://github.com/jnicklas/capybara/blob/master/lib/capybara/selector.rb pour les sélecteurs intégrés fournis par capybara

13
Thomas Walpole