Introduction aux tests iOS avec l’automatisation de l’interface utilisateur

I Imaginez uniquement pouvoir écrire des scripts qui interagissent automatiquement avec votre application iOS et pouvoir vérifier les résultats. Avec l’automatisation UI, vous pouvez. L’automatisation de l’UI est un outil fourni par Apple pour effectuer un niveau de test plus élevé dans votre application iOS au-delà de ce qui peut être atteint avec Xctest.

1. Boîte blanche Versus Test de la boîte noire

Vous avez peut-être entendu la comparaison des tests de boîte blanche contre les tests de boîte noire en ce qui concerne la manière dont un logiciel pourrait être testé. Si vous n’êtes pas familier avec ces concepts, laissez-moi vous expliquer comment ils fonctionnent.

Test sur la boîte blanche

Imaginez qu’il existe un logiciel dans une boîte. Avec des tests en boîte blanche, vous pouvez voir dans la boîte et voir toutes les pièces de la manière dont le logiciel fonctionne, puis apportez des décisions éclairées sur la manière de tester le logiciel. Vous pouvez également avoir des crochets de niveau plus profond dans le logiciel de test que vous écrivez.

Le test de l’unité est un test de boîte blanche. Lors de la rédaction des tests de l’unité, le testeur a un accès détaillé au code sous test. Le vérificateur peut réellement écrire des tests qui profitent du logiciel sous test dans la méthode, ou unité, niveau.

Dans le développement du logiciel iOS, nous utilisons le cadre XcTest pour effectuer ce type de test. Jetez un coup d’œil à un autre tutoriel que j’ai écrit sur la façon de commencer avec XCTest.

Test de boîte noire

dans des tests de boîte noire, la boîte est opaque. Le testeur ne peut pas voir à l’intérieur de la boîte. Le testeur ne peut pas accéder et ne connaît pas la mise en œuvre du code de base pour écrire des tests. Au lieu de cela, le testeur est obligé d’utiliser l’application en tant qu’utilisateur final interagirait avec l’application et d’attendre sa réponse, vérifiant les résultats.

Il existe au moins deux façons d’exécuter ce type de test.

  • un testeur qui effectue une série de étapes prédéfinies et vérifie visuellement les résultats.
  • Utilisez des outils spécialisés pour tester l’application avec API de forme similaire à la manière dont un être humain interagit.

Dans le développement d’applications iOS, Apple fournit un outil appelé Automatisation UI pour effectuer des tests sur la boîte noire.

2. Quelle est l’interface utilisateur Automatisation?

L’automatisation de l’UI est un outil que Apple fournit et maintient pour un niveau supérieur automatisé d’applications iOS. Les tests sont écrits en JavaScript, adhérant à une API définie par Apple.

Les tests d’écriture peuvent être simplifiés lors de l’accessibilité des étiquettes d’accessibilité pour des éléments d’interface utilisateur dans leur application. Ne vous inquiétez pas, si vous ne les avez pas définis, il existe des alternatives disponibles.

L’API d’automatisation de l’UI manque du format typique Xunit pour écrire des tests. Une différence avec des tests unitaires est que le testeur doit enregistrer manuellement le succès et les échecs. Les tests d’automatisation de l’UI sont exécutés à partir de l’instrument d’automatisation de l’outil Instruments fourni avec les outils de développement d’Apple. Les tests peuvent être exécutés dans le simulateur IOS ou sur un périphérique physique.

3. Écrire des tests d’automatisation UI

Étape 1: ouvrez le projet exemple

J’ai mis à jour le projet exemple utilisé dans le tutoriel précédent sur les tests iOS avec des éléments supplémentaires de l’interface utilisateur qui fournissent des crochets utiles pour ajouter des tests d’automatisation de l’interface utilisateur. Téléchargez le projet GitHub. Ouvrez le projet et exécutez l’application pour vous assurer que tout fonctionne comme prévu. Vous devriez voir une interface utilisateur similaire à celle indiquée ci-dessous.

Sample Application Capture d'écran

Avant d’écrire Testez, n’hésitez pas à essayer l’exemple d’application pour vous familiariser avec ses fonctionnalités. En tant qu’utilisateur, vous pouvez entrer du texte dans le champ de texte et appuyer sur le bouton pour afficher une étiquette à l’écran indiquant la chaîne inversée entrée entrée.

Étape 2: Créez une automatisation UI

Maintenant que vous connaissez l’application de l’exemple, il est temps d’ajouter un test d’automatisation de l’interface utilisateur. L’automatisation de l’UI est un outil qui peut être trouvé sur les instruments. Pour exécuter l’application de l’exemple de l’instrument, sélectionnez Produit > Profil dans le menu Xcode. Sélectionnez Automation dans la liste des outils.

Capture d'écran de l'instrument

La fenêtre principale de l’instrument s’ouvrira avec un seul instrument prêt à être exécuté, le Instrument d’automatisation (l’instrument d’automatisation exécute des cas de test d’automatisation UI). Vous verrez également une zone dans la moitié inférieure de la fenêtre qui ressemble à un éditeur de texte. Ceci est l’éditeur de script. C’est ici que vous écrirez vos tests d’automatisation de l’UI. Pour ce premier test, suivez les instructions ci-dessous, en ajoutant chaque ligne au script dans l’éditeur de script.

Commencez par stocker une référence au champ de texte dans une variable.

var inputField = target.frontMostApp().mainWindow().textFields();

Définissez la valeur du champ de texte.

inputField.setValue("hi”);

Vérifiez que la valeur a été correctement définie et, si C’était, passez le test. Échec du test si ce n’était pas comme ça.

if (inputField.value() != "hi") UIALogger.logFail("The Input Field was NOT able to be set with the string!");else UIALogger.logPass("The Input Field was able to be set with the string!");

tandis que ce test est assez trivial, il a une valeur. Nous venons d’écrire un test qui prouve la présence d’un champ de texte lorsque l’application est lancée et testez si une chaîne aléatoire peut être établie comme valeur du champ de texte. Si vous ne me croyez pas, supprimez le champ de texte de scénario et exécutez le test. Vous verrez qu’il échoue.

Ce test démontre trois systèmes d’automatisation de l’interface utilisateur importants de l’interface utilisateur. Tout d’abord, cela vous montre comment accéder à un élément d’interface utilisateur simple, au champ de texte. Plus précisément, nous accédons à un dictionnaire de tous les champs de texte de la vue de base de l’application via target.frontMostApp().mainWindow().textFields(), puis nous recherchons le champ de texte qui nous intéresse lors de la recherche de la clé qui a la clé Input Field. Cette clé est en réalité l’étiquette d’accessibilité du champ de texte. Dans ce cas, il est défini dans le script graphique. Nous pouvons également définir l’étiquette d’accessibilité dans le code à l’aide de la propriété dans NSObject

Accès à la fenêtre principale de l’application, la plus grande application frontale et l’objectif sont courants lorsque vous travaillez avec l’automatisation de l’interface utilisateur. Je vais vous montrer comment faire cela plus facile et moins détaillé plus tard dans ce tutoriel.

Deuxièmement, cela vous indique que vous pouvez interagir avec les éléments de l’interface utilisateur à l’écran. Dans ce cas, nous établissons la valeur du champ de texte, imitant l’utilisateur qui interagit avec l’application lors de la saisie de texte dans le champ de texte.

et troisième, l’exemple montre également une technique pour vérifier ce qui se passe dans L’application. Si la valeur est établie avec succès, le test passe. Si la valeur n’est pas définie, le test échoue.

Étape 3: Enregistrer les tests

Lorsque vous écrivez des tests dans l’éditeur de script est pratique, il devient rapidement encombrant et difficile à maintenir. Si vous laissez des instruments, tout changement non enregistré est rejeté. Nous devons garder les tests que nous écrivons. Copiez et collez simplement votre test dans un nouveau document dans votre éditeur de texte préféré et enregistrez-le. Vous pouvez trouver les tests créés dans ce didacticiel dans l’exemple projet dans Jumblify / JumbleCifyCifyCifyCifyCifyCIFIFYTES / Automationtes.js.

Pour exécuter le test, sélectionnez l’onglet Moyen de l’écran droit, à côté de l’éditeur des scripts, et sélectionnez Ajouter > importer.

Il vous sera demandé de sélectionner le script à importer. Naviguez jusqu’au script enregistré et imprez-le. Vous pouvez toujours modifier le script dans l’éditeur de script. Toute modification sera enregistrée automatiquement dans le fichier externe que vous avez créé.

Étape 4: Touchez une touche

Nous mettons à jour notre test pour tester l’interaction avec le bouton. Notre test ajoute déjà du texte au champ de texte. Nous n’avons donc besoin que d’ajouter du code pour toucher le bouton. Considérez d’abord comment trouver le bouton dans la vue afin que vous puissiez toucher. Il y a au moins trois façons d’y parvenir et chaque approche a sa compensation.

Focus 1

Nous pouvons programmer en programmant une coordonnée (x, y) à l’écran. . Nous faisons cela avec la ligne de code suivante:

Bien sûr, je n’ai aucune idée si ce sont même les coordonnées du bouton sur le bouton Écran et non je vais m’inquiéter de cela, car cette approche n’est pas le bon outil de ce travail. Je ne le mentionne que pour que vous sachiez qu’il existe. Utilisez la méthode dans target Pour toucher un bouton est sujette aux erreurs, car ce bouton n’est pas toujours trouvé dans cette coordonnée spécifique.

Focus 2

Il est également possible de trouver le bouton de recherche sur la matrice du bouton dans la fenêtre principale, de la même manière que nous accédons au champ de texte dans le premier test.Au lieu d’accéder directement à la touche à l’aide d’une clé, nous pouvons récupérer une matrice de boutons dans la fenêtre principale et encoder un index matricielle pour obtenir une référence au bouton.

target.frontMostApp().mainWindow().buttons().tap();

Cette approche est un peu meilleure. Nous ne codons pas d’une coordonnée, mais nous codons sur un index de matrice pour trouver le bouton. Si nous ajoutons un autre bouton sur la page, vous pouvez casser accidentellement ce test.

Focus 3

Cela me prend à la troisième façon de trouver le bouton sur la page, Utiliser des étiquettes d’accessibilité En utilisant une étiquette d’accessibilité, nous pouvons directement accéder au bouton, j’ai simplement aimé trouver un objet dans un dictionnaire avec une clé.

target.frontMostApp().mainWindow().buttons().tap();

Cependant, Si vous ajoutez la ligne précédente au script et l’exécuterez, vous obtiendrez une erreur.

Instruments Message d'erreur Capture d'écran

C’est pourquoi nous n’avons pas défini l’étiquette d’accessibilité pour le bouton. Pour ce faire, allez à Xcode et ouvrez le storyboard du projet. Recherchez le bouton dans la vue et ouvrez l’inspecteur d’identité à droite (Afficher > Utilitaires > Inspecteur d’identité). Assurez-vous que l’accessibilité est activée et configurez l’étiquette pour le bouton de bouton Jumblify.

Capture d'inspecteur d'accessibilité de constructeur

pour la course Le test à nouveau, vous devez exécuter l’application à partir de xcode en sélectionnant le produit > exécuter puis décrivez l’application en sélectionnant le produit > Profil. Cela exécute les tests et chaque test doit arriver maintenant.

Étape 5: Vérifiez la chaîne frontale (chaîne en désordre)

Comme je l’ai mentionné plus tôt, notre application prend une chaîne comme entrée et, lorsque L’utilisateur touche le bouton, il affiche la chaîne inversée. Nous devons ajouter un test de plus pour vérifier que la chaîne d’entrée a été inversée correctement. Pour vérifier que UILabel est plein avec la bonne chaîne, nous devons déterminer comment se référer à UILabel et vérifiez la chaîne montrant. Il s’agit d’un problème courant lors de la rédaction des tests d’automatisation, c’est-à-dire de déterminer comment faire référence à un élément de l’application pour faire une affirmation à ce sujet.

Il y a une méthode dans presque tous les objets de l’API Automatisation de l’interface utilisateur, logElementTree. Cette méthode enregistre les éléments imbriqués d’un élément donné. Ceci est très utile pour comprendre la hiérarchie des éléments de l’application et aider à déterminer comment orienter un élément spécifique.

Voyons comment cela fonctionne en enregistrant l’arborescence de l’élément de la fenêtre principale. Jetez un coup d’œil à la ligne de code suivante.

target.frontMostApp().mainWindow().logElementTree();

Ajouter cette ligne au script de test entraîne le résultat suivant:

Instruments LEGELEMENTREE Capture d'écran

Comment pouvez-vous voir, il y a un sous-élément UIAStaticText de UIAWindow et vous pouvez également voir que vous avez un nom de ih, Quelle est également la chaîne inversée que nous devons vérifier. Ahora, para completar nuestra prueba, solo necesitamos agregar código para acceder a este elemento y verificar que esté presente.

¿Por qué solo necesitamos verificar si el elemento UIAStaticText il est présent? Comme le nom de l’élément est la chaîne inversée de la chaîne d’entrée, la vérification de sa présence confirme que la séquence a été correctement investie. Si l’élément n’existe pas lorsque la référence est effectuée par nom, la chaîne inversée signifie que la chaîne n’a pas été inversée correctement.

var stringResult = target.frontMostApp().mainWindow().staticTexts();if (! stringResult.isValid()) UIALogger.logFail("The output text was NOT set with the correctly reversed string!");else UIALogger.logPass("The output text was set with the correctly reversed string!");

4. Gratte Surface

Il existe de nombreuses autres manières dans lesquelles un utilisateur final peut interagir avec un périphérique iOS tout en utilisant son application. Cela signifie qu’il existe de nombreux autres moyens d’utiliser l’interface utilisateur UI pour simuler ces interactions. Au lieu d’essayer de capturer une liste complète de ces interactions, j’irai à la documentation de référence de l’automatisation de l’UI.

Pour chaque type d’objet avec lequel vous pouvez interagir, vous pouvez voir la liste des méthodes disponibles en ce sens. objet. Certaines méthodes permettent de récupérer des attributs sur l’objet, tandis que d’autres doivent simuler une interaction tactile, telle que flickInsideWithOptions dans UIAWindow.

.

Enregistrement d’une session

Comme vous essayez d’essayer d’essayer de plus en plus d’applications compliquées avec l’automatisation de l’UI, vous verrez parfois qu’il est tout à fait fastidieux d’utiliser à plusieurs reprises logElementTree Pour trouver l’élément que vous recherchez.Cela devient également fastidieux et complexe pour les applications avec une hiérarchie ou une navigation complexe. Dans ces cas, vous pouvez utiliser une autre fonction d’instrument pour enregistrer un ensemble d’interactions utilisateur. Ce qui est encore plus important, c’est que les instruments génèrent le code JavaScript de l’automatisation de l’interface utilisateur nécessaire pour reproduire les interactions enregistrées. Voici comment vous pouvez l’essayer pour vous-même.

Intruments et avec l’instrument d’automatisation sélectionné, recherchez le bouton d’enregistrement au bas de la fenêtre.

Screenshot d'instruments montrant le bouton d'enregistrement

Si vous cliquez sur le bouton d’enregistrement, les instruments démarreront une session d’enregistrement comme indiqué dans la capture d’écran suivante.

Instruments lancera votre application dans le simulateur IOS et peut interagir avec elle. Les instruments généreront un script en fonction de leurs interactions en temps réel. Essaie. Tournez le simulateur IOS, touchez des emplacements aléatoires, faites un geste coulissant, etc. C’est un moyen très utile d’aider à explorer les possibilités de l’automatisation de l’interface utilisateur.

Évitez le code monolithique

comme vous pouvez prévoir, si nous continuons à ajouter plus de tests au test Dossier que nous avons créé avec la même méthode, il sera difficile de maintenir. Que pouvons-nous faire pour empêcher cela? Dans mes tests, je fais deux choses pour résoudre ce problème:

  • test pour une fonction: cela implique que les tests que nous écrivons devraient se concentrer sur une fonctionnalité spécifique. Je vous donnerai même un nom approprié, comme testEmptyInputField.
  • Groupez les tests associés dans un fichier: regroupant également des tests liés au même fichier. Cela conserve le code dans un fichier gérable. Cela facilite également la test des parties de fonctionnalité séparément en exécutant les tests dans un fichier spécifique. En outre, vous pouvez créer un script maître dans lequel vous appelez les fonctions ou que vous vous testez regroupés dans d’autres fichiers de test.

Dans le fragment de code suivant, nous importons un fichier JavaScript et celui-ci que le fonctions dans ce fichier JavaScript nous est disponible.

#import "OtherTests.js”

Conclusion

Dans ce tutoriel, vous avez appris la valeur de Des tests de niveau supérieur et la manière dont l’automatisation d’interface utilisateur peut aider à combler ce vide. C’est un autre outil dans votre boîte à outils pour vous assurer d’envoyer des applications fiables et robustes.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *