Automatisation des tests à l'aide de Selenide via Selenoid dans un conteneur Docker

Cet article sera utile aux experts en assurance qualité débutants, ainsi qu'à ceux qui sont intéressés par les fonctionnalités et les capacités de frameworks de test populaires tels que Selenide et Selenoid.

Nous examinons ici un projet de base sur le sélénium. Nous verrons comment connecter Selenium et TestNG au projet, un exemple de Page Object avec une description des éléments de la page et des méthodes utilisées.

Ensuite, familiarité avec Selenide : considérez le framework lui-même, ses principales caractéristiques et avantages, en ajoutant Selenide à un projet de test. Envisagez de travailler avec les éléments, les contrôles et les attentes disponibles dans Selenide.

Et enfin, connectons le framework Selenoid à notre projet pour exécuter des tests dans le conteneur Docker et à l'extérieur.




* L'article a été préparé sur la base d'un rapport de Nikita Kalinichenko - spécialiste senior en assurance qualité chez IntexSoft.
L'article contient des liens vers des documents externes.


1. Sélénium + TestNG


Nous envisageons un projet sur le générateur Maven , nous pouvons donc trouver une description de la structure du projet dans le fichier pom.xml . Afin d'utiliser Selenium et TestNG , les dépendances appropriées doivent être ajoutées à notre fichier pom.xml . Vous pouvez les observer entre les balises de dépendances ci-dessous:

<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>test</groupId> <artifactId>test</artifactId> <version>1.0-SNAPSHOT</version> <dependencies> <dependency> <groupId>org.seleniumhq.selenium</groupId> <artifactId>selenium-java</artifactId> <version>3.141.59</version> </dependency> <dependency> <groupId>org.testing</groupId> <artifactId>testing</artifactId> <version>6.14.3</version> <scope>test</scope> </dependency> </dependencies> </project> 

Ensuite, nous allons voir un exemple d'un objet Page:

 import... public class SignUpPage { private WebDriver driver; public SignUpPage(WebDriver driver) { this.driver = driver; } private By emailFriend = cssSelector("#register-email"); private By confirmEmailFriend = cssSelector("#register-confirm-email"); private By passwordField = cssSelector("#register-password"); private By displayNameField = cssSelector("#register-displayname"); private By monthDropDown = cssSelector("#register-dob-month"); private By dayField = cssSelector("#register-dob-day"); private By yearField = cssSelector("#register-dob-year"); private By shareCheckbox = cssSelector("#register-thirdparty"); private By registerButton = cssSelector("#register-button-email-submit"); //    email public SignUpPage typeEmail(String email) { //       driver.findElement(emailField).sendKeys(email); return this; } //    Confirm email public SignUpPage typeConfirmEmailFriend(String email) {...} //    password public SignUpPage typePassword(String Password) {...} //      public SignUpPage typeName(String name) {...} //   public SignUpPage setMonth(String month) {...} //    Day public SignUpPage typeDay(String day) {...} //    Year public SignUpPage typeYear(String year) {...} 

Comme nous pouvons le voir, en haut du fichier java se trouve une description des variables avec des localisateurs pour les éléments de la page d'enregistrement. Sous la section variable se trouvent des méthodes permettant d'interagir directement avec les éléments de notre page.

Ouvrons les tests eux-mêmes:

 //    private WebDriver driver; //   private SignUpPage page; @BeforeMethod public void setUp() { //    geckodriver System.setProperty("webdriver.gecko.driver", "C:\\Users\\Nikita\\IdeaProjects\\autotests_examples\\drivers\\geckodriver.exe"); //   driver = new FirefoxDriver(); //  ,       driver.manage().timeouts().impicitlyWait(10, TimeUnit.SECONDS); // url      webdrivera get driver.get("https://www.spotify.com/us/signup/"); } 

Comme vous pouvez le voir, dans l'annotation BeforeMethod, nous décrivons ce que nous aurons avant chaque méthode.

 @Test public void typeInvalidYear() { //          driver page = new SignUpPage(driver); //  page.setMonth("December"); //  .typeDay("20") //  .typeYear("85") //  .setShare(true); //  ,    ; Assert.assertTrue(page.isErrorVisible("Please enter a valid year.")); 

L'annotation Test fournit du code pour les méthodes de test.

 @AfterMethod //,   public void tearDown() { driver.quit(); } 

Et l'annotation AfterMethod contient du code qui doit s'exécuter après chaque méthode.

Lors de l'exécution de tests à l'aide de Selenium , les événements suivants se produisent:

  1. Ouverture d'une fenêtre de navigateur distincte
  2. Aller à l'URL
  3. Exécution du code de test
  4. Fermer la session et la fenêtre du navigateur après chaque test

Le prochain test fera de même. Il convient de mentionner que l'exécution de tests sur le sélénium est un processus plutôt gourmand en ressources.

2. Séléniure: quoi, où et comment


Qu'est-ce que Selenide lui-même, quelles sont ses principales caractéristiques et avantages?

En bref, Selenide est un wrapper autour de Selenium WebDriver qui le rend rapide et facile à utiliser lors de l'écriture de tests. À la base, Selenide est un outil d'automatisation des actions des utilisateurs dans un navigateur, axé sur la commodité et la facilité d'implémentation de la logique métier dans les autotests dans la langue de l'utilisateur, sans être distrait par les détails techniques de l'utilisation du «pilote de navigateur». Par exemple, nous n'avons pas besoin de nous concentrer sur le travail avec les attentes des éléments dans le processus d'automatisation des tests d'applications Web dynamiques, ainsi que sur la mise en œuvre d'actions de haut niveau sur les éléments.

Principaux et principaux avantages de Selenide:

  • Syntaxe concise de style jQuery
  • Résoudre automatiquement la plupart des problèmes avec Ajax, les attentes et les délais
  • Gestion de la vie du navigateur
  • Créer automatiquement des captures d'écran

L'objectif de Selenide est de se concentrer sur la logique métier des tests et non de «gaspiller» l'énergie mentale sur les détails techniques.

Traduction du projet sur Selenide


Afin de connecter Selenide et de commencer à travailler avec lui, dans le fichier pom.xml entre les balises de dépendances, nous spécifions la dépendance à Selenide. Puisque nous n'avons plus besoin de la dépendance au sélénium, nous la supprimons simplement.

 <dependency> <groupId>com.codeborne</groupId> <artifactId>selenide</artifactId> <version>5.2.8</version> </dependency> 

De plus, afin de se connecter et de commencer à utiliser Selenide dans notre projet, nous devons effectuer plusieurs importations. Exemples d'importation:

import statique com.codeborne.selenide.Selenide. *;
import statique com.codeborne.selenide.Selectors. *;
import statique com.codeborne.selenide.Condition. *;
import statique com.codeborne.selenide.CollectionCondition. *;

Pour plus d'informations sur la connexion de Selenide à l'aide des autres générateurs de projet, consultez la section Démarrage rapide de la documentation Selenide.

Travailler avec des éléments, des contrôles et des attentes


Passons au travail de Selenide avec des éléments et familiarisons-nous avec certains des contrôles et des attentes qui s'offrent à nous à Selenide.

 import... public class SignUpTest { //    private SignUpPage page; @BeforeClass public static void setUp() { //Property baseurl,     Configuration     url baseurl = "https://www.spotify.com"; //Property browser,     Configuration          browser = "chrome"; } 

Dans le fichier de test, nous remplaçons l'annotation BeforeMethod par l'annotation BeforeClass , puisque nous n'en avons plus besoin, Selenide élimine le besoin d'écrire les méthodes Before et After - Selenide reprend la fonction AfterMethod. Il ne nous reste que l'annotation BeforeClass pour enregistrer quelques propriétés .

Dans l'annotation BeforeClass, nous avons enregistré une propriété baseurl , qui est dans la classe de configuration et sera l'url de base. Par conséquent, driver.get , que nous avons utilisé dans les tests sur Selenium, n'est plus nécessaire. Dans le navigateur de propriétés, nous définissons le navigateur sur lequel nous exécuterons nos tests.

Dans notre projet de test, nous pouvons abandonner complètement le pilote Selenium, Selenide se chargera de tout le travail avec lui, l'encapsulant dans ses classes. Nous devrons nous concentrer sur la logique des tests eux-mêmes.

Passons à l'utilisation de Selenide sur notre page:

 //       Selenide open public SignUpPage open() { //   Selenide.open (relativeOrAbsoluteUrl: "/us/signup/"); return this; } //    email public SignUpPage typeEmail(string Email) { //       $(emailFriend).sendKeys(email); return this; } 

Lorsque vous appelez la méthode open , Selenide lance le navigateur lui-même et ouvre la page. Il s'assure également que le navigateur se ferme à la fin. À Sélénide. ouvert, nous pouvons enregistrer le chemin complet avec http , ou en passer par rapport à baseurl - URL relative . En tant que baseurl, nous avons donc spécifié le chemin absolu dans la méthode Selenide. ouvrir il nous suffira de spécifier "/".

 //    email public SignUpPage typeEmail(String email) { //       $(emailField).sendKeys(email); return this; } //    Confirm email public SignUpPage typeConfirmEmailField(String email) { //       $(confirmEmailField).setValue(email); return this; } 

Afin de trouver un élément à l'aide de Selenide, nous devons spécifier $ au lieu de driver.findElement , qui est utilisé dans Selenium. Autrement dit, en utilisant la méthode d'un caractère de longueur, nous pouvons trouver directement l'élément lui-même. Par défaut, la méthode de recherche est acceptée sous forme de chaîne, similaire à la bibliothèque JavaScript jQuery.

Pour utiliser Selenide pour trouver une liste d'éléments, vous devez spécifier deux caractères $$ . Au lieu de List <WebElement , nous prescrivons ElementsCollection , qui est déjà étendu par des méthodes supplémentaires.


Pour travailler avec des éléments, nous pouvons utiliser à la fois les méthodes Selenium standard (sendKeys ()) et setValue () ou une version plus courte de val () .


Sur la base du nom, comme nous le voyons, les méthodes Selenide sont plus compréhensibles. La méthode click () reste ainsi. Bien que Selenide ait plusieurs méthodes click (): contextClick () (simulant un clic droit), doubleClick () (simulant un double-clic sur un élément), etc. Ayant déjà trouvé un élément, nous pouvons continuer la recherche en utilisant d'autres localisateurs.


La méthode Selenide find () diffère de la méthode Selenium driver.findElement (By) en ce qu'elle peut recevoir immédiatement des sélecteurs CSS et fonctionne avec des éléments Selenide et non avec des éléments Web. Fondamentalement, les éléments Selenide sont une alternative plus intelligente et avec leurs méthodes aux éléments Web Selenium.


Selenide contient déjà des méthodes qui devraient être exécutées via une classe d' actions ou d'une autre manière. Il vous permet d'écrire des méthodes courtes et «belles» écrites dans un langage compréhensible par tous. Selenide dispose également d'une grande flexibilité, grâce à laquelle nous pouvons utiliser les fonctionnalités standard de Selenium.


D'autres méthodes Selenide peuvent également être trouvées dans la documentation officielle .


Considérez les exemples larges et compréhensibles de contrôles que Selenide nous fournit:


 //  ,     page.getError("Please enter a valid year.").shouldBe(Condition.visible); //  ,      page.getError("When were you born?").shouldNotBe(Condition.visible); //       page.getErrors().shoildHave(CollectionCondition.size(6)); //      page.getErrorByNumber(3).shouldHave(Condition.text("Please enter your birth month.")); 

Le schéma de vérification Selenide nous permet de prendre un élément, de le trouver et d'utiliser les formulations suivantes pour lui: should, shouldBe, shouldHave, shouldNot, shouldNotBe et shouldNotHave. Le schéma de vérification se réduit à trouver l'élément et à l'appeler de ces formulations. Plus loin entre parenthèses, nous indiquons soit l'état auquel il doit correspondre ou non, soit un attribut.


Selon la logique et nos besoins, nous utilisons certaines méthodes. Si nous voulons vérifier que l'élément existe, nous utilisons la méthode should (exist), si nous voulons vérifier la visibilité de l'élément, nous utilisons shouldBe (visible), etc. En fait, nous utilisons seulement trois formulations: soit should, shouldBe, shouldHave, ou leur inverse shouldNot, shouldNotBe, shouldNotHave.


Les contrôles sur les éléments ou les collections d'éléments sont effectués sur Séléniure en utilisant les méthodes décrites ci-dessus, qui satisfont à la condition de vérification. Ils jouent le rôle d'attendre le moment où l'élément remplira une condition, et non seulement d'effectuer une vérification de la condition.


Le libellé de Selenide est tout à fait logique et compréhensible. Nous pouvons rédiger nos chèques, soit en utilisant les indices de l'environnement de développement, soit des hypothèses logiques. Et en soi, nous pouvons toujours regarder le code d'implémentation des méthodes nécessaires dans la documentation ou regarder l'implémentation de la méthode elle-même.


Captures d'écran automatiques dans le test


Pour JUnit :

Pour prendre automatiquement une capture d'écran après chaque test qui échoue, vous pouvez importer et spécifier la règle


 import com.codeborne.selenide.junit.screenShooter; @Rule public ScreenShooter makeScreenshotOnFailure = ScreenShooter.failledTests(); 

Mais en fait, c'est un rudiment, car Selenide prend depuis longtemps automatiquement des captures d'écran lorsque les tests tombent. C'est très pratique pour analyser nos erreurs. Par défaut, Selenide place les captures d'écran dans le dossier build / reports / tests .

Afin de prendre automatiquement une capture d'écran après chaque test (y compris le vert), vous pouvez utiliser la commande suivante:

 @Rule public ScreenShooter makeScreenshotOnFailure = ScreenShooter.failedTests().succeededTests(); 

Pour TestNG, nous importons également:


 import com.codeborne.selenide.testng.ScreenShooter; @Listeners({ ScreenShooter.class}) 

Pour prendre des captures d'écran après des tests verts, vous devez appeler la commande suivante avant d'exécuter les tests:


 ScreenShooter.captureSuccessfulTests = true; 

Vous pouvez également prendre une capture d'écran n'importe où dans le test sur une seule ligne:


 import static com.codeborne.selenide.selenide.screenshot; screenshot("my_file_name"); 

Selenide créera deux fichiers: my_file_name.png et my_file_name.html

3. Docker: caractéristiques et avantages


Passons directement à Docker et considérons ses avantages:


  • Processus de développement accéléré. Pas besoin d'installer des outils auxiliaires; ils peuvent être exécutés dans des conteneurs
  • Encapsulation d'application pratique
  • Surveillance claire
  • Mise à l'échelle facile

Lorsque nous parlons de Docker, les points suivants doivent être clarifiés:


Un conteneur est une instance exécutable qui encapsule le logiciel requis. Il se compose d'images. Il peut être facilement supprimé et recréé en peu de temps.


Une image est l'élément de base de chaque conteneur.


Docker Hub est un référentiel d'interface public fourni par Docker Inc. Il stocke de nombreuses images. La ressource est une source d'images «officielles» réalisées par l'équipe Docker ou créées en collaboration avec un développeur de logiciels.


Installer Docker


Pour obtenir Docker sur Windows, accédez à https://hub.docker.com et téléchargez l'application Docker Desktop pour Windows ou MacOS et installez-la plus tard.


Pour Ubuntu Linux, installez Docker avec la commande sudo apt install docker.io


Ensuite, vous devez démarrer Docker et le configurer pour qu'il démarre automatiquement au démarrage du système en exécutant les commandes suivantes:


  • sudo systemctl start docker
  • sudo systemctl enable docker


4. Selenoid: caractéristiques et avantages


Selenoid est un serveur qui exécute des navigateurs isolés dans des conteneurs Docker.


Avantages de l'utilisation de Selenoid:


  • Environnement unifié pour l'exécution d'autotests parallèles
  • Environnement isolé: chaque navigateur s'exécute dans un conteneur séparé, ce qui nous permet d'isoler complètement l'environnement de notre navigateur
  • Évolutivité: l'environnement n'affecte pas la qualité et les tests en continu
  • Consommation et utilisation des ressources: Selenoid vous permet de maintenir une charge élevée sans coûts de ressources supplémentaires; en outre, il recycle tous les conteneurs inactifs après la fin de sa session, maintenant ainsi constamment la quantité de mémoire libre nécessaire.
  • Installation: ne prend pas beaucoup de temps et s'effectue, en fait, avec une seule commande
  • Prise en charge simultanée de plusieurs versions d'un navigateur: cette option n'est disponible qu'avec Selenoid, pour cela vous devez créer plusieurs conteneurs avec les navigateurs nécessaires
  • Focus: le système d'exploitation fonctionne de telle manière qu'une seule fenêtre peut être mise au point. Lors de l'exécution de plusieurs navigateurs sur la même machine, les fenêtres peuvent commencer à rivaliser pour la mise au point. Selenoid n'a pas un tel problème, car chaque test s'exécute dans un conteneur séparé
  • Interface utilisateur et journaux: Selenoid vous permet d'accéder rapidement aux journaux existants. De plus, il est possible de l'intégrer à la pile ELK pour une collecte et une analyse plus rapides des fichiers actuels.

De plus, Selenoid est assez pratique à utiliser et possède une interface informative.


Installer Selenoid


Étapes préparatoires à l'installation de Selenoid:


  • Un Docker installé et en cours d'exécution est requis, car l'utilisation de Selenoid avec Docker est discutée plus en détail.
  • La façon la plus simple d'installer Selenoid est de télécharger Configuration Manager, qui est utilisé pour automatiser l'installation des produits Aerokube , qui est Selenoid
  • Renommez le fichier téléchargé en cm.exe (pour une interaction facile)
  • Exécutez Selenoid avec la commande:

    ./cm.exe selenoid start --vnc
    ./cm.exe selenoid-ui start

À la suite de la commande ./cm.exe selenoid start - vnc , les images seront chargées avec le serveur VNC, c'est-à-dire des images dans lesquelles la possibilité de voir l'écran du navigateur en temps réel est disponible. De plus, lors de l'exécution de cette commande, la dernière version de Selenoid sera téléchargée avec les conteneurs, les fichiers exécutables du pilote Web, les fichiers de configuration seront créés et la dernière étape lancera immédiatement Selenoid lui-même.

Avec la commande suivante ./cm.exe selenoid-ui start, nous téléchargeons et exécutons Selenoid UI - un shell graphique à travers lequel nous pouvons voir la progression de nos tests en temps réel, des enregistrements vidéo d'exécution de script, des exemples de fichiers de configuration, collecter des statistiques, etc. d.

Selenoid fonctionne par défaut sur le port Selenium 4444 standard. Le port peut être redéfini à l'aide du commutateur --port .

Selenoid a été créé pour fonctionner dans de grands clusters Selenium et n'a donc pas d'interface utilisateur intégrée. Essayez donc d'ouvrir
Point de terminaison pour les tests de l' hôte local : 4444 / wd / hub renverra une erreur 404.

Sélénoïde UI statistiques et sessions


L'interface utilisateur Selenoid est disponible sur http: // localhost: 8080 /


Ici, nous pouvons nous familiariser avec les statistiques et les sessions. Affichez l'utilisation actuelle des quotas, les navigateurs en attente et la file d'attente elle-même. Selenoid UI reçoit des mises à jour via SSE, vous n'avez donc pas besoin d'actualiser la page dans votre navigateur pour voir ce qui se passe. Après toute interruption temporaire, le contenu de la page sera automatiquement actualisé.


Si nous parlons de tests simultanés sur divers appareils: par exemple, nous avons une application Web multiplateforme avec une fonctionnalité de chat en temps réel, nous pouvons alors tester simultanément l'interaction entre eux, ce qui est certainement pratique.


Caractéristiques de Selenoid UI


Selenoid UI possède également les fonctionnalités suivantes:



Nous pouvons choisir un navigateur dans la liste des navigateurs disponibles et l'interface utilisateur nous fournira un exemple de configuration avec les capacités appropriées. La capture d'écran montre que les exemples sont disponibles pour plusieurs langues.



Lors du choix d'un navigateur, nous pouvons le lancer manuellement directement dans l'interface. Lors de l'exécution des tests, il est possible de se connecter au port vnc en temps réel et d'accéder à l'écran du navigateur souhaité, voire d'intervenir dans le processus d'exécution des autotests.

Journaux et VNC


Si vous utilisez la capacité enabaleVnc = true , vous pouvez voir une liste des statistiques disponibles sur la page. VNC nous permet de voir le navigateur et d'interagir avec lui. Alors que notre journal affichera toutes les actions du navigateur.


Session VNC:


Le mode VNC plein écran est le suivant:


Vous pouvez également voir les journaux du conteneur Docker pour chaque session, même sans VNC. Autrement dit, si, par exemple, vous n'avez pas utilisé l'indicateur --vnc lors de l'installation de Selenoid lui-même, vous ne verrez que les journaux.


Il est également possible de regarder des vidéos de nos tests. Vous pouvez accéder aux fichiers vidéo en ouvrant http: // localhost: 4444 / video / , ou en accédant à l'onglet «Vidéos» dans l'interface utilisateur de Selenoid.

Connexion à un projet Selenide Selenoid pour exécuter vos tests dans un conteneur Docker


Afin de connecter Selenoid, à l'annotation BeforeClass, nous devons ajouter la configuration suivante:

 Configuration.remote = "http://localhost:4444/wd/hub"; Configuration.browser = "chrome"; Configuration.browserSize = "1920x1080"; DesiredCapabilities capabilities = new DesiredCapabilities(); capabilities.setCapability(capabilityName: "enableVNC", value: true); capabilities.setCapability(capabilityName: "enableVideo", value: true); Configuration.browserCapabilities = capabilities; 

Nous supprimons la propriété baseurl , qui indiquait sur quel navigateur les tests ont été exécutés, puisque maintenant nous utilisons la propriété
Configuration.browser = "chrome" ;

Dans un projet, cela ressemble à ceci:

 @BeforeClass public static void setUp() { //Url    Configuration.remote = "http://10.0.75.1:4444/wd/hub"; //     Configuration.browser = "chrome"; //   Configuration.browserSize = "1920x1080"; //   DesiredCapabilities,         - DesiredCapabilities capabilities = new DesiredCapabilities(); //         capabilities.setCapability(capabilityName: "enableVNC", value: true); //       capabilities.setCapability(capabilityName: "enableVideo", value: true); // Browser capabilities Configuration.browserCapabilities = capabilities; 

Selenoid


  • : Selenoid Tmpfs – , . , , , .
  • Selenoid : . Browser Capabilities .
  • : Selenoid Google Chrome true Browser Capabilities :

    ChromeOptions options = new ChromeOptions();
    options.setCapability(“enableVideo”,true);

Selenoid Docker


Selenoid , , . , Windows Internet Explorer, . Selenoid “” Selenium Internet Explorer, Firefox Chrome Windows, , Selenoid Internet Explorer.

:

1. IEDriverServer - ( C: \)

2. Selenoid

3. browsers.json

browsers.json:

 { "internet explorer": { "default": "11", "versions": { "11": { "image": ["C:\\IEDriverServer.exe", "--log-level=DEBUG"] } } } } 


4. Selenoid:
./selenoid_win_amd64.exe -conf ./browsers.json -disable-docker

5. , endpoint http://localhost:4444/wd/hub capabilities :
browserName = internet explorer
version = 11

6. , Chrome, Chromedriver , , browsers.json

7. Selenoid , Selenoid -capture-driver-logs , .


La solution basée sur Selenide + Selenoid dans le conteneur Docker démontre un haut niveau de flexibilité dans la personnalisation de l'environnement d'exécution. La stabilité de cette solution, des gains de temps importants lors de son utilisation et un certain nombre de fonctionnalités supplémentaires vous permettent d'optimiser le processus et d'assurer des produits logiciels de haute qualité en peu de temps.Par conséquent, il est facile de privilégier les solutions ci-dessus, car elles vous permettent d'effectuer rapidement et avec précision des tests d'automatisation.

Source: https://habr.com/ru/post/fr473454/


All Articles