Fermer

janvier 13, 2022

Écrire des étapes codées pour Test Studio


Lorsque votre navigateur ou votre site Web parvient à empêcher l'enregistreur visuel de Test Studio d'obtenir toutes les frappes dont vous avez besoin, vous avez une solution : écrivez une étape codée. Et vous n'avez même pas besoin d'apprendre un nouveau SDK pour le faire. via les interfaces utilisateur d'une application. L'enregistreur visuel de Test Studio est un excellent exemple de la façon dont cette technologie peut à la fois permettre aux utilisateurs de participer aux tests et d'accélérer la création de tests. aura du mal avec – principalement parce que la technologie des navigateurs change plus rapidement que les nouvelles versions d'enregistreurs visuels ne peuvent être publiées (j'ai mis à jour ma copie de Chrome deux fois au cours des dernières semaines, par exemple). De plus, bien sûr, c'est aussi assez étonnant ce que certains concepteurs de sites Web ont fait faire à JavaScript… si étonnant que cela peut dérouter un enregistreur visuel. Aussi robuste que soit l'enregistreur de Test Studio, même Test Studio rencontrera parfois quelque chose qui défie son enregistreur.

C'est là que la possibilité d'ajouter des étapes codées à vos scripts Test Studio est utile : vous pouvez toujours écrire du code pour gérer (ou juste la nouvelle "fonctionnalité" de certains sites Web que l'enregistreur visuel actuel de Test Studio n'a pas encore rattrapé). La bonne nouvelle ici est que Test Studio lui-même fournit tous les exemples dont vous aurez besoin lorsque vous aurez besoin d'écrire une étape codée, y compris la prise en charge des tests basés sur les données de Test Studio. Chromium DatePicker

Comme étude de cas sur la façon d'écrire une étape codée, je vais utiliser le sélecteur de date Chromium qui est invoqué lorsqu'une page dans Chrome ou Edge contient un élément d'entrée de type date. Au moment où j'écris ceci (novembre 2021), le sélecteur de date current dans Chromium est pratiquement invisible pour l'enregistreur visuel current Test Studio current. Alors que l'enregistreur capturait les mouvements de mon curseur lorsque je fléchais dans la zone de texte des données, il ne relisait pas mes entrées de texte et, par conséquent, lorsque j'ai exécuté mon test, la date est restée inchangée.

Une mise en garde : reconnaissez cela. , au moment où vous lisez ceci, cette étude de cas particulière n'est peut-être plus vraie. En fait, j'ai soigneusement ignoré l'avis "Mise à jour disponible" dans ma barre d'état Test Studio pendant que je travaillais sur ce post au cas où la mise à jour obligerait l'enregistreur à gérer le sélecteur de date. J'ai pensé que j'avais la chance de trouver un exemple à utiliser dans cet article et, si cet exemple m'était retiré, je ne pensais pas pouvoir en trouver un autre.

La solution réelle à ce problème est assez simple : faites un clic droit sur l'étape, sélectionnez Afficher dans le code et commentez la première ligne de la méthode qui s'affiche. Cependant, d'autres problèmes peuvent nécessiter plus de code ou un code différent de celui que vous avez dans la méthode par défaut. Que ferez-vous alors ? Donc, en utilisant le sélecteur de date comme exemple, voici une solution plus complète pour créer une étape codée.

Et ce n'est pas difficile à faire. La création d'une étape codée simple nécessite simplement que vous fassiez trois choses :

  1. Ajoutez une étape de saisie de texte à votre script de test à l'endroit où vous avez navigué jusqu'au sélecteur de date
  2. Changez l'étape de saisie de texte en étape codée[19659012]Personnalisez le code fourni

1. Ajouter une étape de saisie de texte

Pour ajouter une étape de saisie de texte pour le sélecteur de date à votre script de test enregistré, cliquez d'abord sur l'étape de votre script où vous arrivez à la zone de texte de date (pour créer un script, voir cette étape par -guide d'étape. Assurez-vous que la zone grise à gauche de l'étape affiche la flèche supérieure à (« > »), cette flèche contrôle l'endroit où votre étape sera insérée.

Depuis le volet Générateur d'étape sur à droite, sélectionnez l'entrée Actions, puis développez le nœud Actions rapides à droite de celui-ci. Texte " sélectionné. La zone grise à sa gauche contient un signe supérieur à et est encerclée. À droite, dans le volet Générateur d'étapes, le choix Actions est sélectionné et le nœud Actions rapides développé pour afficher "Cliquez sur 'StartDateText', "Entrez du texte dans 'StartDateText'", et "Vérifier 'StartDateText' pour être 'False'". L'option "Entrer du texte" est sélectionnée. Dans le coin droit de l'écran se trouve un bouton Ajouter une étape encerclé. » title= »Test-Studio-DatePicker-Code-Step »/>

Sous le nœud Actions rapides, sélectionnez "Entrer du texte dans 'StartDateText'", puis, en bas du volet Générateur d'étape, cliquez sur le bouton Ajouter une étape bouton. Test Studio ajoutera la nouvelle étape de saisie de texte à votre script. Si vous développez cette étape, vous pouvez voir les options que vous pouvez définir, y compris le texte que l'étape saisira. Comme guide pour la prochaine étape du processus, entrez l'année que vous voulez pour votre date dans la zone de texte et réduisez l'étape (j'ai utilisé « 2024 »).

Un script de test montrant une nouvelle étape intitulée « Entrez le texte dans 'StartDateText' ». L'étape a été développée pour afficher une zone de texte intitulée "Texte" contenant 2024.

2 : Convertir en une étape de code

Cette étape est simple. Faites un clic droit sur l'étape que vous venez d'ajouter et sélectionnez le choix Modifier dans le code. Il vous sera d'abord demandé de choisir votre langue (j'ai sélectionné C#). Après cela, un nouvel onglet s'affichera à la place de votre script de test, affichant le code par défaut généré par Test Studio pour votre nouvelle étape.

La fenêtre Test Studio Code affichant le code dans une méthode appelée Update_Department_CodedStep avec le nom de la méthode encerclé.

3 : Personnaliser le code fourni

Vous pouvez désormais utiliser le code par défaut généré par Test Studio comme guide pour créer votre propre code. Le code par défaut typique ressemble à ceci (l'attribut CodedStep de cette méthode signale la méthode comme pouvant apparaître dans un script de test et fournit du texte qui apparaît dans l'affichage du script de test) :

[CodedStep( @"Entrez le texte '' dans 'StartDateText'")]
public void Update_Department_CodedStep()
{[1945]
   Actions.SetText(Pages.EditContosoUniversity.StartDateText, ""[19]6510 
   Pages.EditContosoUniversity.StartDateText.ScrollToVisible(
              ArtOfTest.WebAii.Core.ScrollToVisibleType.ElementCenterAtWindowCenter);;;
   ActiveBrowser.Fenêtre.SetFocus() ;
   Pages.EditContosoUniversity.StartDateText.Focus();
   Pages.EditContosoUniversity.StartDateText.MouseClick() ;
   Gestionnaire.Bureau.Clavier.TypeTexte("2024", 50[19651027] 100, true);
}

Et vous n'avez pas besoin d'apprendre le SDK qui est exploité ici. Vous pouvez utiliser le code de Test Studio comme guide pour créer le code dont vous avez besoin.

Vol de code

Par exemple, dans cette méthode, la ligne de code qui vous intéresse est la dernière : c'est la ligne qui tape le texte que vous avez entré pour cette étape ("2024", dans mon cas). De tout le code de la méthode par défaut, cette ligne est la seule dont vous aurez besoin. De même, vous pouvez convertir d'autres étapes en étapes codées pour obtenir d'autres exemples de code Test Studio que vous pouvez utiliser.

Par exemple, si vous convertissez une étape qui utilise deux fois la touche fléchée gauche, vous trouverez cette ligne utile dans le code par défaut qui montre comment imiter l'utilisateur en appuyant sur la touche fléchée gauche :

ActiveBrowser.Manager.Desktop.KeyBoard.[19659026]Touche enfoncée(
      ArtOfTest.WebAii.Win32.Clavier.KeysFromString("Gauche"[27] , 150, 2);

Des conversions similaires vous permettront d'assembler tout le code dont vous avez besoin pour gérer le sélecteur de date. Si cela ressemble à de la triche, reconnaissez qu'il y a au moins deux avantages à utiliser le code par défaut de Test Studio comme guide :

  • Vous n'avez pas besoin d'apprendre un tout nouveau SDK.
  • Vous profitez des deux. le dernier code et les meilleures pratiques de l'équipe de Test Studio. . Si, par exemple, vous essayez de saisir une date dans une zone de texte compatible avec le sélecteur de date dans Chrome ou Edge, vous constaterez que ces étapes vous permettront de saisir vos données :

    1. Cliquez sur la zone de texte de la date.[19659012]Utilisez la touche fléchée vers la gauche (deux fois) pour accéder au champ de l'année.
    2. Saisissez l'année.
    3. Utilisez la touche fléchée vers la droite (une fois) pour accéder au champ du mois.
    4. Saisissez le mois.
    5. ]Utilisez la touche fléchée droite (une fois) pour accéder au champ du jour.
    6. Entrez le jour.

    En tirant parti du code des étapes que vous avez utilisées comme exemple, il est assez facile de créer un bloc de code comme celui-ci ( cet exemple entre la date 1953-05-31 : 

    ActiveBrowser.Manager.Desktop.KeyBoard.KeyPress[1965] ](
              ArtOfTest.WebAii.Win32.Clavier.KeysFromString("Gauche"[27] , 150, 2) ;
    Gestionnaire.Bureau.Clavier.TypeTexte("1953", 50[19651027] 100, vrai);
    ActiveBrowser.Manager.Desktop.KeyBoard.KeyPress(
              ArtOfTest.WebAii.Win32.Clavier.KeysFromString("Droit"[27] , 150, 1) ;
    Gestionnaire.Bureau.Clavier.TypeTexte("05", 50 100, vrai);
    ActiveBrowser.Manager.Desktop.KeyBoard.KeyPress(
              ArtOfTest.WebAii.Win32.Clavier.KeysFromString("Droit"[27] , 150, 1) ;
    Gestionnaire.Bureau.Clavier.TypeTexte("31", 90 100, true);
    

    Une fois que vous avez écrit le code, vous pouvez enregistrer vos modifications, exécuter votre script de test et voir votre étape codée entrer vos données dans le sélecteur de date.

    Refactorisation du code

    À présent, vous aurez remarqué que le fichier de code de Test Studio est tout simplement du vieux .NET C#. Si vous avez plusieurs sélecteurs de date dans votre test, rien ne vous empêche de refactoriser le code pour créer une routine réutilisable. Une version refactorisée de mon code précédent pourrait ressembler à ceci :

    public void EnterText(string text)
    {
        Gestionnaire.Bureau.Clavier.TypeTexte(texte, 50,,,,, 19659027], vrai);
    }
    
    public vide Flèche(chaîne direction[19545] int fois)
    {
         ActiveBrowser.Manager.Desktop.KeyBoard.KeyPress(
               ArtOfTest.WebAii.Win32.Clavier.KeysFromString(direction[1959031]direction[1959004] 19659061]150, fois);
    }
    
    privé vide DatePicker([1965949590 chaîne mois, chaîne jour)
    {
       Flèche("gauche"0 2) ;
       Saisir du texte(année) ;
       Flèche(« droite »0 1) ;
       Saisir du texte(mois) ;
       Flèche(« droite »0 1);
       EnterText(day);
    }
    

    Maintenant, pour toute étape codée, j'ai juste besoin de cette ligne de code pour obtenir une donnée e est entré dans un sélecteur de date (j'ai même mis à jour le texte de l'attribut CodedStep pour rendre cette étape facile à repérer dans mon script de test):

    [CodedStep(@"Enter text 2024-05 -31 dans le sélecteur de date StartDateText")]
    public void Update_Department_CodedStep()
    {
                DatePicker[1965(19659250]DatePicker[1965(19659250] "2024","05","31"" ;0) 19659253]}
    

    Traitement des données

    Si vous utilisez un test basé sur les données, il est également facile d'intégrer votre étape codée dans ce processus. Encore une fois, vous pouvez tirer parti d'une étape existante : un rapide coup d'œil au code d'une étape basée sur les données liée à une colonne appelée FirstName affichera une ligne comme celle-ci :

    Manager.Desktop. Clavier.TypeTexte(
       ((chaîne)(Système[019459031].[194590] ].ChangeType(Données["FirstName"], typeof(string )[27 ]))), 50, 100, vrai);[196U59069] guide, il n'est pas difficile de mettre à jour votre étape codée pour extraire des données d'un champ de votre source de données. En supposant que ma source de données comporte des colonnes appelées StartYear, StartMonth et StartDay, mon étape codée basée sur les données ressemblera à ceci :

    [CodedStep(@"Enter Date from Data Source dans le sélecteur de date StartDateText")]
    public void Update_Department_CodedStep()
    {
       chaîne[194541945] année [90=41904] 19659298](chaîne)(Système.Convertir.ChangeType(Données[194596] "StartYear"], typeof(chaîne)));
       chaîne0 mois = (chaîne)(Système.Convertir.Modifier le type(Données[31945] 19659028]"MoisDébut"], typede(s chaîne))) ;
       chaîne jour = (chaîne)([1945].Convertir.ChangeType(Données["StartDay"], typeof[1965] 19659176]chaîne)));
       DatePicker(année,mois,,,,,[1945904]jour );
    }
    

    Comme vous pouvez le voir, vous êtes non seulement capable de créer une étape codée qui traitera tout ce que votre enregistreur visuel a de problèmes, vous pouvez également le lier aux données puissantes de Test Studio - capacités pilotées. Et vous pouvez le faire en tirant parti des exemples de code que Test Studio vous fournira.

    Mais, si vous voulez bien m'excuser, puisque cette étude de cas fonctionne maintenant, je clique sur ce lien Mise à jour disponible et voir ce qui a été ajouté récemment à Test Studio. J'espère presque que le sélecteur de date est toujours un problème - j'aime beaucoup ce code.




Source link