Vai al contenuto

Automatizzare i Test Web: Come Creare il Tuo Primo Test con Playwright

Scopri come automatizzare i test delle applicazioni web utilizzando Playwright, un potente framework open-source sviluppato da Microsoft.

Le applicazioni web moderne stanno diventando sempre più complesse, dinamiche e centrate sull’utente. Con l’implementazione continua favorita dai pipeline di integrazione e consegna costante, i test sono fondamentali per garantire un’esperienza utente affidabile e costante. Tuttavia, i metodi tradizionali di test manuale o con script fragili non sono più sufficienti per soddisfare le esigenze dello sviluppo web contemporaneo.

È qui che entra in gioco Playwright. Sviluppato da Microsoft nel 2020, Playwright è un framework open-source per il testing end-to-end delle applicazioni web. Supporta diversi linguaggi di programmazione come .NET, Python o Java, e può eseguire test su tutti i browser moderni (Chromium, Firefox, WebKit) e dispositivi emulati. Con una serie di funzionalità avanzate, Playwright rende il processo di testing più semplice, veloce e affidabile.

Iniziare con Playwright

Per iniziare con Playwright, è necessario installare e configurare il framework sulla propria macchina. In questo articolo utilizzeremo TypeScript per scrivere i test, quindi sarà necessario avere Node.js e npm installati. È possibile scaricare Node.js qui.

Utilizzeremo Visual Studio Code come editor di codice. Puoi scaricarlo qui. Una volta installati Node.js e Visual Studio Code, crea una nuova cartella per il progetto, ad esempio:

mkdir learn-playwright

Naviga all’interno della nuova directory con il comando:

cd learn-playwright

Ora possiamo installare Playwright e inizializzare il progetto:

npm init playwright@latest

Verranno poste alcune domande per configurare il progetto:

  • Quale linguaggio desideri usare per i test? JavaScript o TypeScript.
  • Nome della directory dei test? Il default è “tests”.
  • Aggiungere un’azione GitHub per l’automazione dei test? Opzionale.
  • Installare i browser Playwright? Opzione predefinita: True.

Dopo aver risposto alle domande, verrà creato un nuovo progetto npm con file package.json, e Playwright Test sarà installato. Playwright scaricherà anche i browser necessari per eseguire i test.

Scrivere e Eseguire Test con Playwright Test

Playwright Test è il test runner integrato di Playwright, che fornisce un modo semplice e flessibile di scrivere ed eseguire i test. Ecco un esempio di test creato da Playwright:

import { test, expect } from '@playwright/test';test('has title', async ({ page }) => {  await page.goto('https://playwright.dev/');  await expect(page).toHaveTitle(/Playwright/);});test('get started link', async ({ page }) => {  await page.goto('https://playwright.dev/');  await page.getByRole('link', { name: 'Get started' }).click();  await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();});

Il primo test verifica che il titolo della pagina contenga la parola “Playwright”. Il secondo test naviga verso la pagina, clicca sul link “Get started” e verifica che la sezione “Installation” sia visibile.

Esegui i test con il comando:

npx playwright test

I test verranno eseguiti in parallelo su browser differenti: Chromium, Firefox e WebKit. Playwright genera anche un report HTML per visualizzare i risultati in dettaglio:

npx playwright show-report

Il report fornisce informazioni dettagliate su ogni test eseguito, inclusi i tempi di esecuzione e eventuali errori.

Per Concludere

Abbiamo visto come iniziare con Playwright, dalla configurazione all’esecuzione dei test. Playwright offre un’API unificata per testare le applicazioni web su diversi browser, includendo anche funzionalità avanzate come l’auto-attesa, l’esecuzione in parallelo e la generazione di report dettagliati.

Per ulteriori approfondimenti, visita il modulo di formazione Microsoft Learn: Build Your first end-to-end test with Playwright.