kuinka Firebugia käytetään Selenium – komentosarjojen luomiseen-Selenium Tutorial #4

edellisessä opetusohjelmassa opimme luomaan automatisoituja testaussarjoja Selenium IDE: n ja sen tallennusominaisuuden avulla. Selasimme myös seleeni IDE: n väkirikkaita piirteitä. Pyrimme kätkemään lukijalle seleeni IDE: n tärkeimmät ominaisuudet ja komennot.

Just a reminder – this is our 4th tutorial in free Selenium training series.

nyt kun olet tottunut ja pystyt luomaan automaattisia skriptejä Selenium IDE: n tallennustilan avulla, siirtykäämme eteenpäin toisella työkalulla, jolla on erittäin tärkeä rooli auttaessamme meitä luomaan tehokkaita testiskriptejä, jotka tunnetaan nimellä ”Firebug”. Firebug auttaa meitä tarkastamaan web-elementtien ja verkkosivujen ominaisuuksia.

Tämä opetusohjelma koostuu siis Firebugin asennuksesta ja sen käytettävyydestä.

ota huomioon, että tämän opetusohjelman sisältöä ei voida soveltaa vain Selenium IDE: n yhteydessä; pikemminkin sitä voidaan soveltaa jokaiseen seleeni-sarjan työkaluun. Siksi käyttäisin mieluiten termiä seleeni seleeni IDE: n sijaan.

tässä opetusohjelmassa opetellaan Firebug-lisäosan käyttöä Selenium-skriptien luomiseen. Samalla opimme myös Firebugin asentamisen.

Johdatus Firebugiin

Firebug on Mozilla Firefoxin lisäosa. Tämä työkalu auttaa meitä tunnistamaan tai tarkemmin tarkastaa HTML, CSS ja JavaScript elementtejä web-sivulla. Se auttaa meitä tunnistamaan elementit yksilöllisesti verkkosivulla. Elementit löytyvät yksilöllisesti niiden paikannustyyppien perusteella, joista keskustelisimme myöhemmin tässä opetusohjelmassa.

kuinka Firebug asennetaan?

ymmärtämisen helpottamiseksi jakaisimme asennusprosessin seuraaviin vaiheisiin.

vaihe -1: Käynnistä Mozilla Firefox-selain ja siirry tälle Firebug-lisäosan lataussivulle. URL vie meidät Firefoxin lisäosat-osioon.

vaihe -2: klikkaa verkkosivun ”lisää Firefox” – painiketta. Katso seuraava luku samasta.

Step-3: Heti kun me klikkaa ” Lisää Firefox ”painiketta, turvallisuus hälytys ruutuun ilmestyy, klikkaa” Salli ” nappi nyt.

Vaihe 4: Nyt Firefox lataa lisäosan taustalla ja edistymispalkki näkyy.

Vaihe 5: heti kun prosessi on valmis, ohjelmiston asennusikkuna ilmestyy. Nyt klikkaa ”Asenna nyt” nappi.

Step-6: heti asennuksen päätyttyä ilmestyy ponnahdusikkuna, joka kertoo, että firebug on asennettu onnistuneesti. Nyt valitse sulkea tämä pop up.

Huomautus: Toisin kuin Selenium IDE, meidän ei tarvitse käynnistää Firefoxia uudelleen firebug-asennuksen heijastamiseksi, vaan se tulee helposti.

Step-7: nyt firebugin laukaisemiseksi voimme valita jommankumman seuraavista tavoista:

• paina F12
• Napsauta Firefoxin ikkunan äärimmäisessä oikeassa yläkulmassa olevaa Firebug-kuvaketta.



• Napsauta Firefoxin valikkopalkkia- >Web Developer- >firebug- >Open Firebug.

Vaihe-8: Nyt firebug voidaan nähdä alareunassa Firefox-ikkunan.

nyt kun olemme ladanneet ja asentaneet firebugin, mennään eteenpäin sen tyyppisten paikantimien kanssa, joita luomme firebugin avulla.

Selenium-komentosarjan luominen Firebug-komentosarjan avulla

toisin kuin Selenium-IDE: ssä, Firebugissa luomme automatisoituja testikomppanioita manuaalisesti lisäämällä useita testivaiheita loogisen ja johdonmukaisen testisarjan muodostamiseksi.

noudattakaamme edistyksellistä lähestymistapaa ja ymmärtäkäämme prosessia askel askeleelta.

skenaario:

• avoin ”https://accounts.google.com”.
• puolustaa sovelluksen otsikkoa
• syötä virheellinen käyttäjätunnus ja Virheellinen salasana ja lähetä tiedot kirjautumiseen.

Vaihe 1 – Käynnistä Firefox ja avaa Selenium IDE valikkopalkista.

Vaihe 2 – Syötä testattavan sovelluksen osoite (”https://accounts.google.com”) perusosoitteen tekstikenttään.

Vaihe 3 – oletuksena Record-painike on ON-tilassa. Muista virittää se pois tilasta, jotta voidaan poistaa tallennustila. Huomaa, jos tallennustila on päällä-tilassa, se voi johtaa vuorovaikutustemme tallentamiseen verkkoselaimen kanssa.

Step 4 – Avaa testattava sovellus (https://accounts.google.com) Firefoxissa.

Vaihe 5 – laukaise Firebug verkkoselaimessa.

Vaihe 6 – Valitse tyhjä testivaihe muokkaimessa.

Step 7-tyyppiä ”open” Editoripaneelissa olevassa komentotekstikentässä. ”Avaa” – komento avaa määritetyn URL-osoitteen verkkoselaimessa.

suositus: kirjoittaessaan komentoja komentotekstikenttään käyttäjä voi hyödyntää automaattisen valinnan ominaisuutta. Niinpä heti kun käyttäjä kirjoittaa sarjan merkkejä, vastaavat ehdotukset olisivat automaattisesti asuttu.

käyttäjä voi myös klikata komentoteksti-ruudussa olevaa pudotusvalikkoa katsoakseen kaikki Selenium IDE: n tarjoamat komennot.

Vaihe 8 – nyt, liike kohti verkkoselaimen Firebug-osiota, laajenna HTML-koodin ”head” – osiota. Huomaa HTML-tunniste <title>. Näin ollen verkkosivun nimen vahvistamiseksi vaadittaisiin <title> tag.

Kopioi verkkosivun otsikko, joka on meidän tapauksessamme ”Kirjaudu sisään – Google-tilit”.

Vaihe 9 – valitse toinen tyhjä testivaihe muokkaimessa.

vaihe 10 – Tyyppi ”assertTitle” muokkaimen ruudussa olevaan komentotekstikenttään. Komento ”assertTitle” palauttaa nykyisen sivun otsikon ja vertaa sitä määritettyyn otsikkoon.

vaihe 11 – Liitä vaiheessa 8 kopioitu otsikko toisen kohdekenttään.

Step 12 – Valitse nyt kolmas tyhjä testivaihe Editor – ruudussa

Step 13-Type ”type” – komento komentotekstikentässä. ”Type” – komento syöttää määritetyn web-elementin arvon käyttöliittymään.

vaihe 14 – vaihda nyt verkkoselaimeen, tuo hiiren kursori kirjautumislomakkeen ”Sähköposti” – tekstiruutuun ja paina hiiren oikealla painikkeella.

valitse ”tarkasta Elementti Firebugilla” – vaihtoehto. Huomaa, että Firebug korostaa automaattisesti web-elementin vastaavaa HTML-koodia eli ”Email Textbox”.

Step 15 – HTML-koodi yllä olevassa kuvassa ilmaisee erilliset ominaisuusattribuutit, jotka kuuluvat ”sähköposti” – tekstikenttään. Huomaa, että on olemassa neljä ominaisuutta (tunnus, tyyppi, paikkamerkki ja nimi), jotka yksilöivät web-elementin Web-sivulla. Näin se on jopa käyttäjän valita yksi tai useampi kuin yksi ominaisuus tunnistaa web Elementti.

tällöin paikantimeksi valitaan siis ID. Kopioi ID-arvo ja liitä se kolmannen testivaiheen kohdekenttään, jonka etuliitteenä on ”id=”, osoittaaksesi seleeni IDE: n paikantaaksesi web-elementin, jonka tunnus on ”sähköposti”.

(Klikkaa nähdäksesi suurennetun kuvan)

tee merkintä, että Selenium IDE on kirjainkoko herkkä, joten kirjoita attribuutin arvo huolellisesti ja täsmälleen sama kuin se näkyy HTML-koodissa.

vaihe 16 – napsauta Etsi-painiketta tarkistaaksesi, löytääkö valittu paikannin Web-sivulla määritellyn UI-elementin ja paikantaa sen.

vaihe 17 – nyt seuraava vaihe on syöttää testitiedot Editor-ruudussa olevan kolmannen testivaiheen Arvotekstilaatikkoon. Kirjoita” InvalidEmailID ” arvo-ruutuun. Käyttäjä voi muuttaa testitietoja halutulla tavalla.

Step 18 – Valitse nyt neljäs tyhjä testivaihe Editor – ruudussa

Step 19-Type ”type” – komento komentotekstikentässä.

vaihe 20 – siirry nyt verkkoselaimeen, tuo hiiren kursori kirjautumislomakkeen ”salasana” – tekstilaatikkoon ja paina hiiren oikealla painikkeella.

valitse ”tarkasta Elementti Firebugilla” – asetus.

Step 21 – alla oleva HTML-koodi ilmaisee ”salasana” – tekstikenttään kuuluvat erilliset ominaisuusattribuutit. Huomaa, että on olemassa neljä ominaisuutta (tunnus, tyyppi, paikkamerkki ja nimi), jotka yksilöivät web-elementin Web-sivulla. Näin se on jopa käyttäjän valita yksi tai useampi kuin yksi ominaisuus tunnistaa web Elementti.

tällöin paikantimeksi valitaan siis ID. Kopioi ID-arvo ja liitä se kolmannen testivaiheen kohdekenttään, jonka etuliitteenä on ”id=”.

(Klikkaa nähdäksesi suurennetun kuvan)

vaihe 22 – Etsi-painiketta tarkistaaksesi, löytääkö ja paikantaako välilehtinen KÄYTTÖLIITTYMÄELEMENTTI verkkosivulta.

vaihe 23 – nyt seuraava vaihe on syöttää testitiedot neljännen testivaiheen arvotekstilaatikkoon Editor-ruudussa. Kirjoita” InvalidPassword ” arvo-tekstikenttään. Käyttäjä voi muuttaa testitietoja halutulla tavalla.

Step 24 – Valitse nyt viides tyhjä testivaihe Editor – ruudussa

Step 25-tyyppinen ”click” – komento komentotekstikentässä. ”Click” – komento napsauttaa määritettyä web-elementtiä verkkosivun sisällä.

vaihe 26 – siirry nyt verkkoselaimeen, tuo hiiren kursori kirjautumislomakkeen ”Kirjaudu sisään” – painikkeeseen ja paina hiiren oikealla painikkeella.

valitse ”tarkasta Elementti Firebugilla” – asetus.

Step 27 – alla oleva HTML-koodi ilmaisee ”Sign in” – painikkeeseen kuuluvat erilliset ominaisuusattribuutit.

valitse PAIKANTIMEKSI tunnus. Kopioi ID-arvo ja liitä se kolmannen testivaiheen kohdekenttään, jonka etuliitteenä on ”id=”.

(Klikkaa nähdäksesi suurennetun kuvan)

vaihe 28 – Etsi-painiketta tarkistaaksesi, löytääkö valittu paikannin web-sivulta nimetyn UI-elementin.

koekuvaus on nyt valmis. Katso valmis testijakso seuraavasta kuvasta.

Step 29 – toista luotu testiohjelma ja tallenna se samalla tavalla kuin edellisessä opetusohjelmassa.

johtopäätös

tässä opetusohjelmassa esittelimme jälleen uuden skriptien luontityökalun tai pikemminkin työkalun, joka auttaa skriptien luomisessa.

Firebugilla on yllättäen suuri potentiaali paikantaa web-elementtejä verkkosivulta. Näin käyttäjä voi hyödyntää työkalun ominaisuuksia luoda tehokkaita ja tehokkaita automaatio testi skriptejä manuaalisesti.

Next Tutorial #5: Edetessämme seuraavassa tutorialissa tutustuisimme seleenin eri tyyppisiin paikantimiin ja niiden saavutettavuustekniikkaan testiskriptien rakentamiseksi. Sillä välin, lukija voi alkaa rakentaa hänen/hänen automaatio testi skriptejä käyttäen Firebug.