Goniometro - Scrittura del primo test

In questo capitolo, vediamo come scrivere il primo test in Goniometro.

File richiesti da Goniometro

Goniometro necessita dei seguenti due file per essere eseguito:

Specifica o file di prova

È uno dei file importanti per eseguire Goniometro. In questo file scriveremo il nostro codice di prova effettivo. Il codice di test viene scritto utilizzando la sintassi del nostro framework di test.

Ad esempio, se stiamo usando Jasmine framework, quindi il codice di test verrà scritto utilizzando la sintassi di Jasmine. Questo file conterrà tutti i flussi funzionali e le asserzioni del test.

In parole semplici, possiamo dire che questo file contiene la logica e i locatori per interagire con l'applicazione.

Esempio

Quello che segue è un semplice script, TestSpecification.js, con lo scenario di test per navigare a un URL e controllare il titolo della pagina -

//TestSpecification.js
describe('Protractor Demo', function() {
   it('to check the page title', function() {
      browser.ignoreSynchronization = true;
      browser.get('https://www.tutorialspoint.com/tutorialslibrary.htm');
      browser.driver.getTitle().then(function(pageTitle) {
         expect(pageTitle).toEqual('Free Online Tutorials and Courses');
      });
   });
});

Spiegazione del codice

Il codice del file delle specifiche sopra può essere spiegato come segue:

Browser

È la variabile globale creata da Protractor per gestire tutti i comandi a livello di browser. È fondamentalmente un wrapper attorno a un'istanza di WebDriver. browser.get () è un semplice metodo Selenium che dirà a Protractor di caricare una pagina particolare.

  • describe e it- Entrambe sono le sintassi del framework di test Jasmine. Il’Describe’ viene utilizzato per contenere il flusso end-to-end del nostro caso di test mentre ‘it’contiene alcuni degli scenari di test. Possiamo avere più‘it’ blocchi nel nostro programma di test case.

  • Expect - È un'affermazione in cui stiamo confrontando il titolo della pagina web con alcuni dati predefiniti.

  • ignoreSynchronization- È un tag del browser che viene utilizzato quando proveremo a testare siti Web non angolari. Goniometro prevede di funzionare solo con siti Web angolari, ma se vogliamo lavorare con siti Web non angolari, questo tag deve essere impostato su“true”.

File di configurazione

Come suggerisce il nome, questo file fornisce spiegazioni per tutte le opzioni di configurazione di Goniometro. Fondamentalmente dice a Goniometro quanto segue:

  • Dove trovare i file di test o delle specifiche
  • Quale browser scegliere
  • Quale framework di test utilizzare
  • Dove parlare con Selenium Server

Esempio

Quello che segue è il semplice script, config.js, con il test

// config.js
exports.config = {
   directConnect: true,

   // Capabilities to be passed to the webdriver instance.
   capabilities: {
      'browserName': 'chrome'
   },

   // Framework to use. Jasmine is recommended.
   framework: 'jasmine',

   // Spec patterns are relative to the current working directory when
   // protractor is called.
   specs: ['TestSpecification.js'],

Spiegazione del codice

Il codice del file di configurazione sopra con tre parametri di base, può essere spiegato come segue:

Parametro delle capacità

Questo parametro viene utilizzato per specificare il nome del browser. Può essere visto nel seguente blocco di codice del file conf.js -

exports.config = {
   directConnect: true,

   // Capabilities to be passed to the webdriver instance.
   capabilities: {
      'browserName': 'chrome'
},

Come visto sopra, il nome del browser fornito qui è "chrome", che è il browser predefinito per Goniometro. Possiamo anche cambiare il nome del browser.

Parametro quadro

Questo parametro viene utilizzato per specificare il nome del framework di test. Può essere visto nel seguente blocco di codice del file config.js -

exports.config = {
   directConnect: true,

   // Framework to use. Jasmine is recommended.
   framework: 'jasmine',

Qui stiamo usando il framework di test "jasmine".

Parametro di dichiarazione del file di origine

Questo parametro viene utilizzato per specificare il nome della dichiarazione del file di origine. Può essere visto nel seguente blocco di codice del file conf.js -

exports.config = {
   directConnect: true,
   // Spec patterns are relative to the current working 
   directory when protractor is called.
   specs: ['TsetSpecification.js'],

Come visto sopra, il nome della dichiarazione del file sorgente qui fornito è ‘TestSpecification.js’. È perché, per questo esempio, abbiamo creato il file delle specifiche con nomeTestSpecification.js.

Esecuzione del codice

Dato che abbiamo una conoscenza di base dei file necessari e della loro codifica per l'esecuzione di Goniometro, proviamo a eseguire l'esempio. Possiamo seguire i seguenti passaggi per eseguire questo esempio:

  • Step 1 - Innanzitutto, apri il prompt dei comandi.

  • Step 2 - Successivamente, dobbiamo andare nella directory in cui abbiamo salvato i nostri file, ovvero config.js e TestSpecification.js.

  • Step 3 - Ora, esegui il file config.js eseguendo il comando Protrcator config.js.

La schermata mostrata di seguito spiegherà i passaggi precedenti per eseguire l'esempio:

Si vede nella schermata che il test è stato superato.

Ora, supponiamo che se stiamo testando siti web non angolari e non mettiamo il tag ignoreSynchronization su true, dopo aver eseguito il codice otterremo l'errore "Angular non è stato trovato sulla pagina".

Può essere visto nella seguente schermata:

Generazione di report

Fino ad ora, abbiamo discusso dei file necessari e della loro codifica per l'esecuzione di casi di test. Goniometro è anche in grado di generare il report per i casi di test. A tal fine, supporta il gelsomino. JunitXMLReporter può essere utilizzato per generare automaticamente rapporti di esecuzione dei test.

Ma prima, dobbiamo installare Jasmine reporter con l'aiuto del seguente comando:

npm install -g jasmine-reporters

Come puoi vedere, l'opzione -g viene utilizzata durante l'installazione di Jasmine Reporter, perché abbiamo installato Goniometro a livello globale, con l'opzione -g.

Dopo aver installato con successo jasmine-reporter, dobbiamo aggiungere il seguente codice nel nostro file config.js utilizzato in precedenza -

onPrepare: function(){ //configure junit xml report

   var jasmineReporters = require('jasmine-reporters');
   jasmine.getEnv().addReporter(new jasmineReporters.JUnitXmlReporter({
      consolidateAll: true,
      filePrefix: 'guitest-xmloutput',
      savePath: 'test/reports'
   }));

Ora, il nostro nuovo file config.js sarebbe il seguente:

// An example configuration file.
exports.config = {
   directConnect: true,

   // Capabilities to be passed to the webdriver instance.
   capabilities: {
      'browserName': 'chrome'
   },

   // Framework to use. Jasmine is recommended.
   framework: 'jasmine',

   // Spec patterns are relative to the current working directory when
   // protractor is called.
   specs: ['TestSpecification.js'],
   //framework: "jasmine2", //must set it if you use JUnitXmlReporter

   onPrepare: function(){ //configure junit xml report

      var jasmineReporters = require('jasmine-reporters');
      jasmine.getEnv().addReporter(new jasmineReporters.JUnitXmlReporter({
         consolidateAll: true,
         filePrefix: 'guitest-xmloutput',
         savePath: 'reports'
      }));
   },
};

Dopo aver eseguito il file di configurazione sopra nello stesso modo, abbiamo eseguito in precedenza, genererà un file XML contenente il report nella directory principale in reportscartella. Se il test ha avuto successo, il rapporto apparirà come di seguito:

Ma, se il test fallisce, il rapporto apparirà come mostrato di seguito: