pertracTor tesztelési oktatóanyag: Automatizálási eszköz keretrendszer

Miért van szükségünk profikra?tractor keretrendszer?

JavaA szkriptet szinte minden webalkalmazásban használják. Ahogy nőnek az alkalmazások, JavaForgatókönyv méretében és összetettségében is növekszik. Ilyen esetben nehéz feladattá válik a tesztelők számára a webalkalmazás tesztelése különböző forgatókönyvekre.

Néha nehéz rögzíteni a webes elemeket az AngularJS alkalmazásokban JUnit or Selenium WebDriver.

pertracA tor egy NodeJS program, amely nyelven íródott JavaScript és fut a Node-dal, hogy azonosítsa a webes elemeket az AngularJS alkalmazásokban, és a WebDriver segítségével vezérli a böngészőt felhasználói műveletekkel.

Rendben, most beszéljük meg, mi is az AngularJS alkalmazás?

Az AngularJS alkalmazások olyan webalkalmazások, amelyek kiterjesztett HTML szintaxist használnak a webalkalmazás-összetevők kifejezésére. Főleg dinamikus webes alkalmazásokhoz használják. Ezek az alkalmazások kevesebb és rugalmas kódot használnak a normál webalkalmazásokhoz képest.

Miért nem találunk Angular JS webelemeket a Normal használatával? Selenium Web driver?

Az Angular JS alkalmazásoknak van néhány extra HTML attribútuma, mint például az ng-repeater, ng-controller, ng-model stb., amelyeket nem tartalmaz Selenium lokátorok. Selenium segítségével nem tudja azonosítani azokat a webes elemeket Selenium kód. Szóval, Protractetején lévő tor Selenium képes kezelni és vezérelni ezeket az attribútumokat a webalkalmazásokban.

A profitracA tor egy teljes körű tesztelési keretrendszer Angular JS alapú alkalmazásokhoz. Míg a legtöbb keretrendszer az Angular JS alkalmazások egységtesztjeinek elvégzésére összpontosít, a Pro...tracA tor az alkalmazás tényleges funkcionalitásának tesztelésére összpontosít.

Mielőtt elkezdenénk a Pro-ttractorhoz, a következőket kell telepítenünk:

1. SeleniumItt található a Selenium A telepítés lépései az alábbi linkeken, (https://www.guru99.com/installing-selenium-webdriver.html )
2. NPM (Node.js)NodeJS telepítés, telepítenünk kell a NodeJS-t a Pro telepítéséheztractor. A telepítési lépéseket a következő linken találja. ( https://www.guru99.com/download-install-node-js.html )

pertracTor telepítése

Step 1) Nyissa meg a parancssort, és írja be „npm telepítés –g protractor” és nyomja meg az Enter billentyűt.

A fenti parancs letölti a szükséges fájlokat és telepíti a Pro programottractor a kliens rendszeren.

Step 2) Ellenőrizze a telepítést és a verziót a használatával "pertractor – verzió. " Ha sikeres, az alábbi képernyőképen látható verziót jeleníti meg. Ha nem, hajtsa végre újra az 1. lépést.

(A 3. és 4. lépés nem kötelező, de a jobb gyakorlat érdekében ajánlott)

Step 3) Frissítse a webes illesztőprogram-kezelőt. A webes illesztőprogram-kezelőt az Angular webalkalmazáson futtatott tesztek futtatására használják egy adott böngészőben. After ProtracA tor telepítve van, a webes illesztőprogram-kezelőt frissíteni kell a legújabb verzióra. Ezt a következő parancs futtatásával teheti meg a parancssorban.

webdriver-manager update

Step 4) Indítsa el a webes illesztőprogram-kezelőt. Ez a lépés a webes illesztőprogram-kezelőt futtatja a háttérben, és figyeli a Pro-n keresztül futó teszteket.tracthor.

Egyszer ProtracHa a tor parancsot használjuk bármilyen teszt futtatásához, a webes illesztőprogram automatikusan betölti és futtatja a tesztet a megfelelő böngészőben. A webes illesztőprogram-kezelő elindításához a következő parancsot kell végrehajtani a parancssorból.

webdriver-manager start

Most, ha a következőre térsz át URL (http://localhost:4444/wd/hub/static/resource/hub.html) a böngészőben, valójában a webes illesztőprogram-kezelőt fogja látni a háttérben.

Példa az AngularJS alkalmazás tesztelésére Pro használatávaltractor

pertracA tor futtatásához két fájlra van szükség, egy spec fájlt, és konfigurációs fájlt.

1. Konfigurációs fájlEz a fájl segít a profiknaktractor oda, ahová a tesztfájlok kerülnek (specs.js), és hogy kommunikáljon vele Selenium szerver (Selenium Cím). A Chrome a Pro alapértelmezett böngészője.tracthor.

2. Spec fájl: Ez a fájl tartalmazza az alkalmazással való interakcióhoz szükséges logikát és helymeghatározókat.

Step 1) Be kell jelentkeznünk https://angularjs.org és írja be a szöveget „GURU99”-ként az „Írja be ide a nevet” szövegmezőbe.

Step 2) Ebben a lépésben a

1. Beírta a nevet „Guru99 "
2. A kimeneti szövegben a „Hello” Guru99″ látható.

Step 3) Most a név megadása után le kell rögzítenünk a szöveget a weboldalról, és ellenőriznünk kell a várt szöveggel.

Code:

El kell készítenünk a konfigurációs fájlt (conf.js) és spec fájl (spec.js) fent említett.

A spec.js logikája:

describe('Enter GURU99 Name', function() {
 it('should add a Name as GURU99', function() {
 browser.get('https://angularjs.org');
 element(by.model('yourName')).sendKeys('GURU99');
  var guru= element(by.xpath('html/body/div[2]/div[1]/div[2]/div[2]/div/h1'));
expect(guru.getText()).toEqual('Hello GURU99!');
  });
});

Code A spec.js magyarázata:

1. leírni('Írja be a GURU99 nevet', function()A leírás szintaxisa a Jasmine keretrendszerből származik. Itt a "describe" ('Írja be a GURU99 nevet') általában egy alkalmazás összetevőit határozza meg, amelyek lehetnek osztályok vagy függvények stb. A kódkészletben „Enter GURU99”-nek hívják, ez csak egy karakterlánc és nem egy kód.
2. it('hozzá kell adni egy nevet GURU99-ként', function()
3. browser.get("https://angularjs.org") Ahogyan itt Selenium A Webdriver browser.get parancs új böngészőpéldányt nyit meg a megemlített értékkel. URL.
4. elem(by.model('yourName')).sendKeys('GURU99') Itt azt a webelemet találjuk, amely a Modell nevét használja „yourName”-ként, ami az „ng-model” értéke a weboldalon. Nézze meg az alábbi képernyőképet -

5. var guru= element(by.xpath('html/body/div[2]/div[1]/div[2]/div[2]/div/h1')) Itt találjuk meg a webelemet XPath és tárolja az értékét egy „guru” változóban.
6. vár(guru.getText()).toEqual('Hello GURU99!') Végül ellenőrizzük a weboldalról kapott szöveget (gettext() ) a várt szöveggel.

A conf.js logikája:

exports.config = {
  seleniumAddress: 'http://localhost:4444/wd/hub',
  specs: ['spec.js']
};

Code A conf.js magyarázata

1. seleniumAddress: 'http://localhost:4444/wd/hub' A konfigurációs fájl jelzi a Pro számáratraca helyszínre Selenium Cím a beszélgetéshez Selenium WebDriver.
2. specifikációk: ['spec.js']Ez a sor jelzi a Pro-naktraca spec.js tesztfájlok helyére

A végrehajtás Code

Itt először megváltoztatjuk a könyvtár elérési útját, vagy navigálunk abba a mappába, ahol a confi.js és spec.js a rendszerünkben található..

Kövesse a következő lépést.

Step 1) Nyissa meg a parancssort.

Step 2) Győződjön meg arról, hogy a szelén web-illesztőprogram-kezelő működik és fut. Ehhez adja ki a „webdriver-manager start” parancsot, és nyomja meg az Enter billentyűt.

(Ha a selenium web driver nincs telepítve és fut, akkor nem tudjuk folytatni a tesztelést Pro verzióban.)trac(A tor nem találja a webes alkalmazás kezeléséhez szükséges webes illesztőprogramot.)

Step 3) Nyisson meg egy új parancssort, és adja ki a parancsot mint „profi”tractor conf.js” a konfigurációs fájl futtatásához.

Magyarázat:

• Itt ProtracA tor végrehajtja a konfigurációs fájlt a megadott spec fájllal.
• Láthatjuk, hogy a szelén szerver a következő helyen futhttp://localhost:4444/wd/hub” amit a conf.js fájlban adtunk meg.
• Ezenkívül itt látható az eredménye, hogy hány sikeres és hibás, mint a fenti képernyőképen.

Rendben, ellenőriztük az eredményt, amikor sikeres volt, vagy a vártnak megfelelően. Most nézzük meg a sikertelen eredményt is.

Step 1) Nyissa meg, és módosítsa a spec.js-t a „Hello change GURU99” értékre, az alábbiak szerint.

A spec.js módosítása után :

describe('Enter GURU99 Name', function() {
 it('should add a Name as GURU99', function() {
 browser.get('https://angularjs.org');
 element(by.model('yourName')).sendKeys('GURU99');
  var guru= element(by.xpath('html/body/div[2]/div[1]/div[2]/div[2]/div/h1'));
expect(guru.getText()).toEqual('Hello change GURU99!');
  });
});

Step 2) Mentse el a spec.js fájlt, és ismételje meg a fenti lépéseket a „A parancs végrehajtása” részben. Code”Szakasz

Most hajtsa végre a fenti lépéseket.

Eredmény:

Az eredményt sikertelenként láthatjuk, és a képernyőképen „F” jelzéssel jelzi az okot: „Várva: Hello GURU99! 'Hello change GURU99!'. Azt is megmutatja, hogy hány hiba történt a kód végrehajtása során.

El tudjuk-e érni ugyanezt azzal Selenium web driver?

Néha az AngularJS alkalmazások webes elemeit XPath vagy CSS szelektor segítségével azonosíthatjuk Selenium webes illesztőprogram. Az AngularJS alkalmazásokban azonban az elemek dinamikusan generálódnak és változnak. Tehát a ProtracA tor a jobb gyakorlat az AngularJS alkalmazásokkal való munkához.

Készítsen jelentéseket a Jasmine Reporters segítségével

pertracA tor támogatja a Jasmine reportereket tesztjelentések generálásához. Ebben a szakaszban a JunitXMLReporter segítségével automatikusan generálunk tesztvégrehajtási jelentéseket XML formátumban.

Kövesse az alábbi lépéseket XML formátumú jelentések készítéséhez.

A Jasmine Reporter telepítése

Ezt kétféleképpen teheti meg: lokálisan vagy globálisan

1. Nyissa meg a parancssort, és hajtsa végre a következő parancsot a helyi telepítéshez

npm install --save-dev jasmine-reporters@^2.0.0

A fenti parancs telepíti a jasmine reports csomópont-modulokat helyileg abból a könyvtárból, ahol a parancsot futtatjuk a parancssorban.

2. Nyissa meg a parancssort, és hajtsa végre a következő parancsot a globális telepítéshez

npm install –g jasmine-reporters@^2.0.0

Ebben az oktatóanyagban a jázminriportereket helyben telepítjük.

Step 1) Hajtsa végre a parancsot.

npm install --save-dev jasmine-reporters@^2.0.0

a parancssorból az alábbiak szerint.

Step 2) Ellenőrizze a telepítési mappákat a könyvtárban. A "Node_modules"-nak elérhetőnek kell lennie, ha sikeresen telepítette, mint az alábbi pillanatképen.

Step 3) Adja hozzá a következő színű kódot egy létező conf.js fájlhoz

exports.config = {
      seleniumAddress: 'http://localhost:4444/wd/hub',
      capabilities: {
          'browserName': 'firefox'
      },
      specs: ['spec.js'],
     framework: 'jasmine2' ,
      onPrepare: function() {
          var jasmineReporters = require('C:/Users/RE041943/Desktop/guru/node_modules/jasmine-reporters');
          jasmine.getEnv().addReporter(new jasmineReporters.JUnitXmlReporter(null, true, true)
          );
     }
   };

A kód magyarázata:

A kódban elkészítjük a „jelentést”JUnitXmlReporter” és megadja az elérési utat, ahol a jelentést tárolni kell.

Step 4) Nyissa meg a parancssort, és hajtsa végre a parancsot merttractor conf.js.

Step 5) Amikor végrehajtja a fenti kódot, a junitresults.xml az említett útvonalon generálódik.

Step 6) Nyissa meg az XML-t, és ellenőrizze az eredményt. A hibaüzenet a miénkként jelenik meg az eredményfájlban Teszt eset sikertelen. A teszteset meghiúsult, mivel a „spec.js” várt eredménye nem egyezik a weboldal tényleges eredményével

Step 7) Használja a junitresult.xml fájlt bizonyítékok vagy eredményfájlok számára.

Összegzésként

Bár Selenium meg tud csinálni néhány dolgot, amit a profiktraca tor csinálja, a profitracA tor az AngularJS alkalmazások tesztelésének ipari szabványa és legjobb gyakorlata. Egy profitracA tor több képességet is képes kezelni, és a webes elemek dinamikus változásait is képes kezelni a használatával. ng-modell, ng-click.. stb.. (Amire a szelén nem képes).