how use firebug creating selenium scripts selenium tutorial 4
A la tutorial anterior , vam aprendre a crear scripts de prova automatitzats amb Selenium IDE i la seva funció de gravació. També vam fer un cop d'ull a la població característiques de Selenium IDE . Teníem com a objectiu protegir el lector amb les funcions i ordres més vitals de Selenium IDE.
Només un recordatori: aquest és el nostre 4t tutorial gratuït Cicles formatius de seleni .
Ara que ja esteu acostumat i capaç de crear scripts automatitzats mitjançant el mode de gravació de Selenium IDE, anem a avançar amb una altra eina que juga un paper molt important per ajudar-nos a crear scripts de prova eficaços coneguts com a 'Firebug'. Firebug ens ajuda a inspeccionar les propietats dels elements i de les pàgines web.
Per tant, aquest tutorial comprèn la instal·lació de Firebug i la seva usabilitat.
Tingueu en compte que el contingut d’aquest tutorial no només és aplicable en el context de Selenium IDE; més aviat es pot aplicar a totes i cadascuna de les eines de la selecció Selenium. Per tant, preferiblement estaria fent servir el terme Seleni en lloc de Selenium IDE.
En aquest tutorial, aprendrem a utilitzar el complement Firebug per crear scripts Selenium. En el procés, també aprendrem a instal·lar Firebug.
Què aprendreu:
- Introducció a Firebug
- Com instal·lar Firebug?
- Creació de Selenium Script mitjançant Firebug
- Conclusió
- Lectura recomanada
Introducció a Firebug
Firebug és un complement de Mozilla Firefox. Aquesta eina ens ajuda a identificar o ser més particulars a inspeccionar elements HTML, CSS i JavaScript en una pàgina web. Ens ajuda a identificar els elements de manera única en una pàgina web. Els elements es poden trobar exclusivament en funció dels seus tipus de localitzadors, que tractarem més endavant en aquest tutorial.
Com instal·lar Firebug?
Per facilitar la comprensió, bifurcarem el procés d’instal·lació en els passos següents.
Pas 1: Inicieu el navegador Mozilla Firefox i aneu-hi Pàgina de descàrrega del complement Firebug . L'URL ens porta a la secció de complements de Firefox.
Pas -2: Feu clic al botó 'Afegeix a Firefox' que apareix a la pàgina web. Consulteu la figura següent per obtenir el mateix.
Pas 3: Tan bon punt fem clic al botó 'Afegeix a Firefox', apareixerà un quadre d'alerta de seguretat, feu clic al botó 'Permet' ara.
Pas 4: Ara Firefox descarrega el complement al fons i es mostra una barra de progrés.
Pas 5: Tan bon punt finalitza el procés, apareix la finestra d'instal·lació del programari. Ara feu clic al botó 'Instal·la ara'.
Pas 6: Tan bon punt finalitza la instal·lació, apareix una finestra emergent que diu que el firebug s'ha instal·lat correctament. Ara trieu tancar aquesta finestra emergent.
Nota : A diferència de Selenium IDE, no estem obligats a reiniciar el Firefox per reflectir la instal·lació de firebug, sinó que es fa fàcilment.
Pas 7: Ara per llançar firebug, podem optar per qualsevol de les maneres següents:
- Premeu F12
- Feu clic a la icona de Firebug que hi ha a l'extrem superior dret de la finestra de Firefox.
-
- Feu clic a la barra de menú de Firefox -> Desenvolupador web -> firebug -> Obriu Firebug.
Pas 8 : Ara el firebug es pot veure a la part inferior de la finestra de Firefox.
Ara que hem descarregat i instal·lat firebug, avancem amb els tipus de localitzadors que crearíem amb firebug.
Creació de Selenium Script mitjançant Firebug
A diferència de Selenium IDE, a Firebug, creem scripts de prova automatitzats manualment afegint diversos passos de prova per formar un script de prova lògic i coherent.
Seguim un enfocament progressiu i entenem el procés pas a pas.
Escenari:
- Obriu 'https://accounts.google.com'.
- Afirmar el títol de la sol·licitud
- Introduïu un nom d'usuari i una contrasenya no vàlids i envieu els detalls per iniciar la sessió.
Pas 1 - Inicieu el Firefox i obriu Selenium IDE a la barra de menú.
Pas 2: Introduïu l'adreça de l'aplicació que es prova ('https://accounts.google.com') al quadre de text de l'URL base.
Pas 3: Per defecte, el botó Grava està en estat ON. Recordeu posar-lo en estat OFF per desactivar el mode de gravació. Tingueu en compte si el mode de gravació està en estat ACTIVAT, pot resultar en enregistrar les nostres interaccions amb el navegador web.
Pas 4: Obriu l'aplicació en proves (https://accounts.google.com) al Firefox.
Pas 5: Inicieu Firebug al navegador web.
Pas 6: Seleccioneu el pas de prova buit a l'Editor.
Pas 7: Escriviu 'obre' al quadre de text de l'ordre que hi ha al panell de l'editor. L'ordre 'obre' obre l'URL especificat al navegador web.
Recomanació: mentre escriu ordres al quadre de text de l'ordre, l'usuari pot aprofitar la funció de selecció automàtica. Per tant, tan bon punt l’usuari escrigui una seqüència de caràcters, els suggeriments coincidents s’ompliran automàticament.
L'usuari també pot fer clic al menú desplegable disponible al quadre de text de l'ordre per veure totes les ordres proporcionades per Selenium IDE.
Pas 8: Ara, moveu-vos cap a la secció Firebug al navegador web, amplieu la secció 'head' del codi HTML. Fixeu-vos en l'etiqueta HTML. Per tant, per afirmar el títol de la pàgina web, necessitaríem el valor de l'etiqueta.
Copieu el títol de la pàgina web que és 'Inici de sessió: comptes de Google' en el nostre cas.
Pas 9: Seleccioneu el segon pas de prova buit de l'Editor.
Pas 10: Escriviu 'assertTitle' al quadre de text de l'ordre que hi ha al panell de l'editor. L'ordre 'assertTitle' retorna el títol de la pàgina actual i el compara amb el títol especificat.
fase d’anàlisi del cicle de vida del desenvolupament de programari
Pas 11: Enganxeu el títol copiat al pas 8 al camp Objectiu del segon.
Pas 12: Ara seleccioneu el tercer pas de prova buit al panell Editor
Pas 13 - Escriviu l'ordre 'tipus' al quadre de text de l'ordre. L'ordre 'tipus' introdueix un valor a l'element web especificat a la GUI.
Pas 14: Ara canvieu al navegador web, porteu el cursor del ratolí al quadre de text 'Correu electrònic' del formulari d'inici de sessió i premeu un clic dret.
Trieu l'opció 'Inspecciona l'element amb Firebug'. Tingueu en compte que Firebug ressalta automàticament el codi HTML corresponent per a l'element web, és a dir, 'Quadre de text per correu electrònic'.
Pas 15 - El codi HTML de la il·lustració anterior mostra els atributs de propietat diferents que pertanyen al quadre de text 'Correu electrònic'. Tingueu en compte que hi ha quatre propietats (identificador, tipus, marcador de posició i nom) que identifiquen de forma única l'element web de la pàgina web. Per tant, correspon a l'usuari triar una o més propietats per identificar l'element web.
Així, en aquest cas, escollim ID com a localitzador. Copieu el valor de l'identificador i enganxeu-lo al camp de destinació del tercer pas de prova amb el prefix 'id =' per indicar Selenium IDE per localitzar un element web que tingui l'identificador com a 'correu electrònic'.
(Feu clic per veure la imatge ampliada)
Tingueu en compte que Selenium IDE distingeix entre majúscules i minúscules i, per tant, escriviu el valor de l'atribut amb cura i exactament igual que es mostra al codi HTML.
Pas 16 - Feu clic al botó Cerca per verificar si el localitzador seleccionat troba i localitza l'element d'interfície d'usuari designat a la pàgina web.
Pas 17: Ara, el següent pas és introduir les dades de la prova al quadre de text Valor del tercer pas de prova dins del panell Editor. Introduïu 'InvalidEmailID' al quadre de text Valor. L'usuari pot modificar les dades de la prova quan i quan ho desitgi.
Pas 18 - Ara seleccioneu el quart pas de prova buit al panell Editor
Pas 19 - Escriviu l'ordre 'tipus' al quadre de text de l'ordre.
Pas 20: Ara canvieu al navegador web, porteu el cursor del ratolí al quadre de text 'Contrasenya' del formulari d'inici de sessió i premeu un clic dret.
Trieu l'opció 'Inspecciona l'element amb Firebug'.
Pas 21 - El codi HTML següent mostra els diferents atributs de propietat que pertanyen al quadre de text 'Contrasenya'. Tingueu en compte que hi ha quatre propietats (identificador, tipus, marcador de posició i nom) que identifiquen de forma única l'element web de la pàgina web. Per tant, correspon a l'usuari triar una o més propietats per identificar l'element web.
Així, en aquest cas, escollim ID com a localitzador. Copieu el valor de l'ID i enganxeu-lo al camp Objectiu del tercer pas de prova amb el prefix 'id ='.
(Feu clic per veure la imatge ampliada)
Pas 22: Feu clic al botó Cerca per verificar si la pestanya localitzadora troba i localitza l'element d'interfície d'usuari designat a la pàgina web.
Pas 23 - Ara, el següent pas és introduir les dades de la prova al quadre de text Valor del quart pas de prova del panell Editor. Introduïu 'InvalidPassword' al quadre de text Valor. L'usuari pot modificar les dades de la prova quan i quan ho desitgi.
Pas 24 - Ara seleccioneu el cinquè pas de prova buit al panell Editor
Pas 25 - Escriviu l'ordre 'clic' al quadre de text de l'ordre. L'ordre 'clic' fa clic en un element web especificat de la pàgina web.
Pas 26 - Ara canvieu al navegador web, porteu el cursor del ratolí al botó 'Iniciar sessió' del formulari d'inici de sessió i premeu un clic dret.
Trieu l'opció 'Inspecciona l'element amb Firebug'.
Pas 27 - El codi HTML següent mostra els diferents atributs de propietat que pertanyen al botó 'Inicia la sessió'.
Trieu identificador com a localitzador. Copieu el valor de l'ID i enganxeu-lo al camp Objectiu del tercer pas de prova amb el prefix 'id ='.
(Feu clic per veure la imatge ampliada)
Pas 28 - Feu clic al botó Cerca per verificar si el localitzador ha escollit troba i localitza l'element d'interfície d'usuari designat a la pàgina web.
El guió de prova s'ha completat ara. Consulteu la següent il·lustració per veure l'script de prova acabat.
Pas 29 - Reproduïu l'script de prova creat i deseu-lo de la mateixa manera que vam fer al tutorial anterior.
Conclusió
En aquest tutorial, hem introduït una altra eina de creació de seqüències o més aviat una eina que ajuda a la creació de seqüències.
Sorprenentment, Firebug té un gran potencial per localitzar elements web en una pàgina web. Així, l'usuari pot aprofitar les capacitats de l'eina per crear manualment scripts de prova d'automatització eficaços i eficients.
Pròxim tutorial núm. 5 : Avançant en el següent tutorial, veuríem el diversos tipus de localitzadors a Selenium i la seva tècnica d’accessibilitat per construir scripts de prova . Mentrestant, el lector pot començar a construir els seus scripts de prova d’automatització mitjançant Firebug.
Heu utilitzat Firebug per inspeccionar elements HTML o per crear scripts? Us sembla útil? Comparteix la teva experiència als comentaris
Lectura recomanada
- Com s'utilitza el marc TestNG per crear scripts de Selenium - Tutorial # 12 de TestNG Selenium
- Tutorial de Cogombre Selenium: Integració de Cogombre Java Selenium WebDriver
- Com es poden localitzar elements als navegadors Chrome i IE per crear scripts Selenium - Tutorial Selenium # 7
- Creació de genèrics i proves: Tutorial Selenium núm. 22
- Introducció a Selenium WebDriver - Tutorial Selenium # 8
- Integració de Jenkins amb Selenium WebDriver: tutorial pas a pas
- Tutorials Eclipse en profunditat per a principiants
- Escenaris de scripts i resolució de problemes de Selenium eficients: tutorial núm. 27 de Selenium