Informazioni sulla specifica dei test

  • 9 minuti

Il test predefinito viene eseguito nella specifica test/example.spec.ts . Disimballiamolo per vedere cosa contiene:

import { test, expect } from '@playwright/test';
test('has title', async ({ page }) => {
  await page.goto('https://playwright.dev/');

  // Expect a title "to contain" a substring.
  await expect(page).toHaveTitle(/Playwright/);
});

test('get started link', async ({ page }) => {
  await page.goto('https://playwright.dev/');

  // Click the get started link.
  await page.getByRole('link', { name: 'Get started' }).click();

  // Expects page to have a heading with the name of Installation.
  await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
});

Se hai effettuato sviluppo guidato dai test o test end-to-end, la struttura e il formato dei test dovrebbero essere familiari. Ma potresti vedere anche alcuni nuovi concetti. Prima di approfondire queste informazioni, si esaminerà la struttura dei test.

Informazioni sulla gerarchia dei test

Ecco come organizzare i test in Playwright.

  • Ogni metodo test() in tale specifica è un test case. Quando viene eseguita in una configurazione con più progetti, ogni progetto crea un'istanza di una versione di questo test case e la configura in base ai requisiti del progetto.
  • Ogni istruzione eseguibile all'interno del test case è un'azione di test che può essere rilevata nei flussi di strumenti per il reporter, il visualizzatore di traccia o la modalità interfaccia utente.
  • I test case possono essere raggruppati in modo esplicito in Gruppi di test usando la test.describe() funzione . È possibile visualizzare un esempio di questo esempio nel file test-examples/demo-todo-app-spec.ts . I test case verranno rivisti in un secondo momento.
  • I test case vengono raggruppati in modo implicito in gruppi in base al progetto a cui appartengono e al file in cui sono contenuti, che consente a Playwright di indirizzare i gruppi di test in vari modi per l'esecuzione.
  • Ogni esecuzione di test ha una suite Root, con una suite di progetto figlio per ogni progetto configurato. I gruppi di progetti hanno gruppi di file figlio per ogni specifica di test identificata per l'esecuzione. La suite File può avere oggetti Test Case (singoli) e oggetti Test Suite (raggruppati esplicitamente usando describe) come figli.

La direttiva test.describe consente di raggruppare logicamente gli oggetti Test Case in un file in modo da poter eseguire operazioni come applicare beforeEach e afterEach a tutti i test all'interno di un gruppo. Per informazioni di riferimento, vedere il frammento di codice seguente da test-examples/demo-todo-app.spec.ts :

test.describe('Mark all as completed', () => {
  test.beforeEach(async ({ page }) => {
    await createDefaultTodos(page);
    await checkNumberOfTodosInLocalStorage(page, 3);
  });

  test.afterEach(async ({ page }) => {
    await checkNumberOfTodosInLocalStorage(page, 3);
  });

  test('should allow me to mark all items as completed', async ({ page }) => {
    // test actions details omitted for clarity
  });

  test('should allow me to clear the complete state of all items', async ({ page }) => {
    // test actions details omitted for clarity
  });

  test('complete all checkbox should update state when items are completed / cleared', async ({ page }) => {
    // test actions details omitted for clarity
  });
});

Informazioni sulla struttura dei test

Per questa discussione è possibile esaminare uno dei due frammenti di specifiche di test precedenti (il primo da example.spec.ts, il secondo da demo-todo-app.spec.ts). Si userà il secondo perché ha un po ' di dettaglio più rilevante.

I test di Playwright seguono generalmente lo schema Arrange-Act-Assert

  • Disponi: configura l'ambiente per il test. Ciò può includere la fornitura delle fixture corrette, ma anche l'esecuzione degli hook beforeEach/beforeAll che configurano lo stato iniziale per tale test.
  • Atto: questi sono i passaggi all'interno del test che individuano gli elementi corretti con cui interagire, quindi agiscono su di essi. Ad esempio, il test potrebbe individuare un pulsante, quindi selezionarlo. Altre azioni includono check/uncheck (caselle di controllo), fill (moduli), hover (passare il mouse), focus (su un elemento), press (un singolo tasto) e così via.
  • Assert: queste affermazioni convalidano i risultati attesi dalle azioni. Playwright supporta asserzioni web-first, in cui asserzioni generiche (con expect) possono essere associate a matcher asincroni (per il localizzatore) per assicurarsi che l'elemento di destinazione sia pronto prima di valutare la condizione dell'asserzione.

Una volta compreso questo aspetto, diventa più facile comprendere, creare e perfezionare le specifiche di test usando gli strumenti Playwright.

Informazioni sui componenti di test

Si esaminerà ora questi concetti in azione esaminando i test/example.spec.ts precedenti in questa unità.

import { test, expect } from '@playwright/test';
test('has title', async ({ page }) => {
  await page.goto('https://playwright.dev/');

  // Expect a title "to contain" a substring.
  await expect(page).toHaveTitle(/Playwright/);
});

test('get started link', async ({ page }) => {
  await page.goto('https://playwright.dev/');

  // Click the get started link.
  await page.getByRole('link', { name: 'Get started' }).click();

  // Expects page to have a heading with the name of Installation.
  await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
});
  1. Disposizione: Questa specifica di test non contiene hook espliciti, tuttavia page è una Fixture che supporta anche questo obiettivo.
  2. Act: page.goto è un esempio di azione di navigazione in cui il browser automatizza l'azione dell'utente di passare a tale URL.
  3. Asserzione: expect.(\<locator>).toBeVisible() è un esempio di LocatorAssertion in cui Playwright attenderà che l'elemento individuato sia pronto (usando vari tentativi) prima di valutare l'asserzione (è visibile?).

Con questo semplice esempio, si conoscono tre concetti potenti in Playwright Testing:

  • Fixture: per stabilire l'ambiente e testare l'isolamento.
  • Localizzatori: per trovare elementi con attesa automatica e ripetizione automatica dei tentativi.
  • Asserzioni: Per convalidare i risultati delle azioni automatizzate con asserzioni web.

Prendetevi qualche minuto per acquisire familiarità con la documentazione per queste tre funzionalità e API. Quindi, dovresti essere pronto per immergerti nella progettazione e realizzazione di una specifica end-to-end per l'applicazione di esempio.

Ottimo. Ora parliamo dei principali strumenti di sviluppo per Playwright!