Test di automazione dei burattinai: Tutorial 6

Burattinaio è un framework basato su libreria node js disponibile come open-source. Può essere utilizzato per strumenti di web scraping. Viene anche utilizzato per gli strumenti di automazione dei test. Oggigiorno, l'utilizzo di Burattinaio sta aumentando rapidamente nello spazio di test del software automatizzato. Per la comprensione è richiesta una conoscenza di base della riga di comando, di Javascript e della struttura HTML DOM tutorial per burattinai. L'intero tutorial è suddiviso negli articoli seguenti. 

Tutorial burattinaio

Tutorial Tosca # 1: Panoramica del burattinaio

Tosca Tutorial # 2: Variabili d'ambiente del burattinaio

Tosca Tutorial # 3: Panoramica su Puppeteer Web Scraping e Puppeteer Test Automation

Tosca Tutorial # 4: Installa Puppeteer

Tosca Tutorial # 5: Progetto Puppeteer di esempio

Tutorial Tosca # 6: Test di automazione dei burattinai

In questo tutorial "Puppeteer Automation Testing", spiegheremo i passaggi dettagliati per Puppeteer Automation dall'inizio. Di seguito verranno spiegate le funzionalità per comprendere da zero i test di Puppeteer Automation:

· Installa Puppeteer

· Avvia l'applicazione Web

· Identifica le proprietà degli oggetti dal browser Chrome

· Fasi di invio del modulo: immettere testo, evento clic, verifica

· Cattura di screenshot

· Esegui script per Puppeteer Automation

Automazione dei burattinai

I test sono necessari per garantire la qualità dei prodotti software. Esistono più livelli di test definiti nei processi di sviluppo del software. Per testare le funzionalità di un software, può essere eseguito manualmente o tramite processo automatizzato. Gli scopi principali del test automatico del software sono:

  • Ciclo di esecuzione del test veloce.
  • Evita le possibilità di errori umani.
  • Riduci i tempi di esecuzione del test.
  • Ridurre il tempo del ciclo di rilascio.
  • Ottieni più funzionalità senza scendere a compromessi con la qualità.
  • L'esecuzione multipla può essere eseguita parallelamente.

 Puppeteer è una libreria di nodi basata su javascript che fornisce un'interfaccia per applicazioni (API) di alto livello per controllare il browser Web Chrome tramite il protocollo Chrome DevTools. La maggior parte delle operazioni manuali eseguite nel browser Chrome possono essere automatizzate utilizzando Puppeteer. Quindi, il burattinaio è una buona scelta per i test di unità su applicazioni web in modo rapido e semplice. 

Approccio al test dell'automazione dei burattinai:

I passaggi coinvolti con il test dell'automazione dei burattinai sono spiegati di seguito: 

Step1 # Identifica lo scenario di test funzionale:

Mostreremo l'approccio passo dopo passo all'esecuzione dell'automazione del burattinaio per lo scenario seguente: 

· Avvia il browser web.

· Richiama l'applicazione Web Amazon.

  • Cerca il libro "Testing Book".
  • Aggiungi il libro al carrello dal risultato.
  • Apri il carrello e controlla se il libro è disponibile nel carrello.
  • Cattura la schermata e chiudi il browser.

Step2 # Installa Puppeteer e crea test case:

Crea un file javascript vuoto come "sample_script.js" in una cartella specifica. Qui, considereremo la cartella principale come SampleProject. Per installare Puppeteer, useremo il comando - "npm install puppeteer". La procedura di installazione richiede del tempo in base alla velocità della rete. Scaricherà circa 350 MB di dati. Dopo l'installazione, la cartella node_modules, che contiene diversi componenti del pupazzo e il file package-lock.json, verrà creata nella cartella principale del progetto Puppeteer di esempio.

Step3 # Cattura le proprietà di identificazione dell'oggetto di test:

Possiamo acquisire le proprietà di identificazione utilizzando lo strumento per sviluppatori del browser web Chrome. Analizzando le diverse proprietà come, id, name, XPath, ecc., Sceglieremo quella corretta che può essere utilizzata nello scripting per eseguire qualsiasi operazione. In questo tutorial "Puppeteer Automation Testing", utilizzeremo XPath nello script. Di seguito i passaggi da seguire per ottenere XPATH o qualsiasi altra proprietà,

1. Apri gli Strumenti per sviluppatori disponibili in "Menu -> Altri strumenti" e vai alla scheda Elementi.

2. Utilizzando lo strumento Finder (facendo clic sull'icona della freccia disponibile nell'angolo in alto a sinistra della scheda Elementi), evidenziare l'oggetto di prova dall'applicazione. Qui, esamineremo la casella di ricerca.

Test dell'automazione dei burattinai: apri lo strumento per sviluppatori Chrome
Test dell'automazione dei burattinai: apri lo strumento per sviluppatori Chrome

3. Analizza il codice sorgente evidenziato per identificare le proprietà del desiderio. Per ottenere la proprietà XPATH dell'oggetto di prova, fare clic con il pulsante destro del mouse sulla sezione evidenziata e fare clic su "Copia-> Copia Xpath" per copiare la proprietà XPATH negli appunti.

Test di automazione dei burattinai - Copia XPath
Test dell'automazione dei burattinai - Copia XPath

4. Ora, incolla Xpath nella casella di testo Finder e premi Invio per verificare se Xpath identifica l'oggetto in modo univoco.

Test dell'automazione dei burattinai: controlla XPath
Test dell'automazione dei burattinai: controlla XPath

5. Allo stesso modo, dobbiamo acquisire le proprietà di identificazione anche per un altro oggetto di prova.

Step4 # Passaggi per lo sviluppo dell'automazione del burattinaio:

Per completare il test case, dobbiamo eseguire alcune operazioni sulle pagine web. Per ciascuna operazione sono disponibili diversi metodi. I metodi utilizzati nel nostro scenario per il "test dell'automazione dei burattinai" sono spiegati qui.

Avvia applicazione - Dopo aver incluso il burattinaio, dobbiamo avviare il browser utilizzando il metodo di avvio del burattinaio. È possibile passare un riferimento a un oggetto a questo metodo per definire il browser headless o headful. Quindi dobbiamo creare l'istanza del browser web necessaria per navigare nell'URL. Qui, la funzione async viene utilizzata per utilizzare la parola chiave await per gestire il sincronizzatore web.

//Include il pacchetto burattinaio const burattinaio = require('burattinaio'); (async () => { //avvio del browser senza testa const browser = await puppeteer.launch({ headless: true }); //Crea un'istanza della pagina const del browser = await browser.newPage(); //Vai al url await page.goto('https://www.amazon.in/'); })()

L'intero test verrà eseguito in un browser headless. Se vogliamo aprire il browser headful, dobbiamo passare l'oggetto al metodo di avvio come "{Headless: false}".

Controlla l'esistenza - Dobbiamo usare il metodo pagina.waitForXpath che verificherà l'esistenza dell'Xpath e restituirà il riferimento dell'oggetto di prova. Testando il riferimento di restituzione, possiamo aggiungere un punto di verifica nel caso di test.

\tlet searchBox = attendono page.waitForXPath("//*[@id='twotabsearchtextbox']",{ visibile: true });
\tif (searchBox === null) //Verifica dell'oggetto di prova
\T{
\t\tconsole.log('La schermata di Amazon non viene visualizzata');
\T}

Immettere i dati - Usando il Digitare metodo di quel riferimento all'oggetto, possiamo inserire il testo.

await searchBox.type ("Libro di prova");

Fare clic su Elemento  - Allo stesso modo, utilizzando il clicca metodo di qualsiasi riferimento a un oggetto, possiamo eseguire operazioni di clic.

let btnSearch = await page.waitForXPath("//*/input[@id='nav-search-submit-button']",{visible:true }); btnSearch.click();

Stampa il messaggio nella console  - Usando il metodo console.log, possiamo stampare qualsiasi messaggio nella console come output.

console.log('Il ritardo della console è stato generato');

Fare riferimento alla nuova scheda - Utilizzando i metodi page.target e browser.waitforTarget, possiamo controllare e memorizzare il riferimento sulla nuova scheda in una variabile.

\tconst pageTarget = pagina.target();
\tconst newTarget = attendono browser.waitForTarget(target => target.opener() === pageTarget);
\t//ottieni il nuovo oggetto pagina:
\tconst page2 = attendono newTarget.page();

Catturare Screenshot - Usando il metodo pagina. Immagine dello schermo, è stata scattata un'istantanea della pagina specifica e salvata secondo il nome del file fornito come argomento.

await page.screenshot({ percorso: 'screenshot1.png' });

Chiudi pagina e browser - Usando il metodo close, possiamo chiudere sia la pagina web che il browser.

\tawait page.close(); \tawait browser.close();

Tempo di attesa - In alcuni casi, è necessario attendere il caricamento della pagina o il completamento di qualsiasi attività dipendente; dobbiamo mettere in pausa l'esecuzione per un tempo predefinito. Per eseguire ciò, possiamo usare il page.waitForTimeout metodo che può mettere in pausa l'esecuzione in base al valore (in millesimi di secondo) passato attraverso l'argomento.

attendi pagina.waitForTimeout(2000);

Ora abbiamo appreso i passaggi tecnici di base per automatizzare il nostro scenario funzionale. Sulla base delle conoscenze, possiamo passare attraverso il caso di test di Puppeteer Automation di seguito. La panoramica dettagliata delle classi e dei metodi più utilizzati sarà spiegata nei post successivi.

/**
 * @nome ricerca Amazon
 */
const burattinaio = require('burattinaio');
const reportPath = 'C:\\\\LambdaGeeks\\\\puppteer_proj_sample\\\\output\\\\';
const screenshot = 'screen1.png';
// Utilizzato per esportare il file in un file .docx
Tentativo {
  (asincrono () => {
    const browser = attendono burattinaio.launch({ headless: false });
    const pageNew = attendono browser.newPage()
    attendono pageNew.setViewport({ larghezza: 1280, altezza: 800 });
    attendono pageNew.goto('https://www.amazon.in/');
\t//Inserisci i criteri di ricerca
\tlet searchBox = attendono page.waitForXPath("//*[@id='twotabsearchtextbox']",{ visibile: true });
\tif (casella di ricerca === null)
\T{
\t\tconsole.log('La schermata di Amazon non viene visualizzata');
\T}
\telse{\t\t
\t\tawait searchBox.type("Libro di test");
\t\tconsole.log('I criteri di ricerca sono stati inseriti');
\t} \t\t
\t//Ho fatto clic sul pulsante di ricerca
\tlet btnSearch = attendono pageNew.waitForXPath("//*/input[@id='nav-search-submit-button']",{ visibile: true });
\tif (btnSearch === null)
\T{
\t\tconsole.log('Il pulsante Cerca non viene visualizzato');
\T}
\telse{
\t\tawait btnSearch.click();
\t\tconsole.log('Cliccato sul pulsante di ricerca');
\t}\t
\t//Fai clic su un risultato di ricerca specifico
\tlet myBook = attendono pageNew.waitForXPath("//*[contains(text(),'Selenium Testing Tools Cookbook Second Edition')]",{ visibile: true })
\tif (mioLibro === null)
\T{
\t\tconsole.log('Il libro non è disponibile');
\T}
\telse{
\t\tawait myBook.click();
\t\tconsole.log('Fare clic su un libro specifico per ordinarlo');
\t} \t
\t// Identifica se la nuova scheda è stata aperta
\tconst pageTarget = pageNew.target();
\tconst newTarget = attendono browser.waitForTarget(target => target.opener() === pageTarget);
\t//ottieni il nuovo oggetto pagina:
\tconst page2 = attendono newTarget.pageNew();\t
\tawait page2.setViewport({ larghezza: 1280, altezza: 800 });
\T
\t//Aggiungi al carrello
\tlet addToCart = attendono page2.waitForXPath("//*/input[@id='add-to-cart-button']",{ visibile: true });
\tif (addToCart === null)
\T{
\t\tconsole.log('Il pulsante Aggiungi al carrello non è disponibile');
\T}
\telse{
\t\tconsole.log('Fai clic sul pulsante Aggiungi al carrello');
\t\taattendi addToCart.click();\t\t
\t} \t\t
\t//Verifica il processo di aggiunta al carrello\t
\tlet successMessage = attendono page2.waitForXPath("//*[contains(text(),'Aggiunto al carrello')]",{ visibile: true });
\tif (messaggio di successo === null)
\T{
\t\tconsole.log('L'articolo non è stato aggiunto al carrello');
\T}
\telse{
\t\tconsole.log('L'articolo è stato aggiunto al carrello con successo');\t\t
\t} \t\t
\t// Cattura il numero del carrello
\tlet cartCount = attendono page2.waitForXPath("//*/span[@id='nav-cart-count']",{ visibile: true});
\tlet valore = attendono page2.evaluate(el => el.textContent, cartCount)
\tconsole.log('Conteggio carrello: ' + valore);
\tcartCount.focus();
\tawait page2.screenshot({ percorso: screenshot });
\T
\tawait pageNew.waitForTimeout(2000);
\aspetta pagina2.close();
\tawait pageNew.close();
    attendi browser.close();
  })()
} cattura (sbaglia) {
  console.errore(errore)
}

Step5 # Esecuzione del test dell'automazione del burattinaio:

Possiamo iniziare l'esecuzione usando il comando nodo sample_script.js tramite il prompt dei comandi. Durante l'esecuzione verrà aperto il browser Chromium e verranno eseguiti automaticamente i passaggi funzionali e memorizzerà lo screenshot della pagina finale. Lo screenshot e l'output della console appariranno come di seguito.

Test dell'automazione dei burattinai - Output della console
Test dell'automazione dei burattinai - Output della console
Test di automazione dei burattinai - Schermata acquisita
Test dell'automazione dei burattinai - Schermata acquisita

Conclusione:

In questo tutorial sul test dell'automazione del burattinaio, abbiamo imparato i passaggi dettagliati sul test dell'automazione del burattinaio. Nella prossima esercitazione del burattinaio, apprenderemo la panoramica dettagliata delle classi e dei metodi di burattinaio utilizzati più di frequente. Fare clic su qui per visitare il portale di riferimento per questo tutorial burattinaio. 

Lascia un tuo commento