Wzorzec AAA, czyli Arrange Act Assert

Powrót do: Praktyczne wprowadzenie do testów automatycznych z Playwright

Wzorzec AAA: Arrange Act Assert

Dodatkowe materiały

Kod do tej lekcji znajduje się tu: Sekcja 02, Lekcja 02

Pamiętaj, aby po każdej większej modyfikacji uruchamiać testy 😉

Wydzielenie danych testowych

W pierwszym teście login.spec.ts wyciągamy wartości do osobnych zmiennych:

test("successful login with correct credentials", async ({ page }) => {
  const url = "https://demo-bank.vercel.app/";
  const userId = "testerLO";
  const userPassword = "10987654";


  await page.goto(url);
  await page.getByTestId("login-input").fill(userId);
  await page.getByTestId("password-input").fill(userPassword);
  await page.getByTestId("login-button").click();


  await expect(page.getByTestId("user-name")).toHaveText("Jan Demobankowy");
});

Można taką akcję zrealizować za pomocą:

1. Kliknięcia w dane string.
2. Użycia skrótu klawiszowego Ctrl+Shift+R.
3. Wybierz pierwsza opcję naciskając Enter.
4. Nazwij zmienną.

Wyciągnięcie danych z asercji

test("successful login with correct credentials", async ({ page }) => {
  const url = "https://demo-bank.vercel.app/";
  const userId = "testerLO";
  const userPassword = "10987654";
  const expectedUserName = "Jan Demobankowy";


  await page.goto(url);
  await page.getByTestId("login-input").fill(userId);
  await page.getByTestId("password-input").fill(userPassword);
  await page.getByTestId("login-button").click();


  await expect(page.getByTestId("user-name")).toHaveText(expectedUserName);
});

Wzorzec AAA

Wzorzec AAA opiera się na podziale testu na 3 etapy:

1. Arrange: przygotowanie danych testowych.
2. Act: wykonanie akcji testowych.
3. Assert: zweryfikowanie oczekiwanych rezultatów.

Wyróżnienie AAA w teście

Wystarczy dodać odpowiednie komentarze jeśli test jest jasno podzielony.

test("successful login with correct credentials", async ({ page }) => {
  // Arrange
  const url = "https://demo-bank.vercel.app/";
  const userId = "testerLO";
  const userPassword = "10987654";
  const expectedUserName = "Jan Demobankowy";


  // Act
  await page.goto(url);
  await page.getByTestId("login-input").fill(userId);
  await page.getByTestId("password-input").fill(userPassword);
  await page.getByTestId("login-button").click();


  // Assert
  await expect(page.getByTestId("user-name")).toHaveText(expectedUserName);
});

AAA w pierwszym teście pulpitu

Wydzielenie danych testowych i opis poszczególnych bloków AAA:

test("quick payment with correct data", async ({ page }) => {
  // Arrange
  const url = "https://demo-bank.vercel.app/";
  const userId = "testerLO";
  const userPassword = "10987654";


  const receiverId = "2";
  const transferAmount = "150";
  const transferTitle = "pizza";


  // Act
  await page.goto(url);
  await page.getByTestId("login-input").fill(userId);
  await page.getByTestId("password-input").fill(userPassword);
  await page.getByTestId("login-button").click();


  await page.locator("#widget_1_transfer_receiver").selectOption(receiverId);
  await page.locator("#widget_1_transfer_amount").fill(transferAmount);
  await page.locator("#widget_1_transfer_title").fill(transferTitle);


  await page.getByRole("button", { name: "wykonaj" }).click();
  await page.getByTestId("close-button").click();


  // Assert
  await expect(page.locator("#show_messages")).toHaveText(
    "Przelew wykonany! Chuck Demobankowy - 150,00PLN - pizza"
  );
});

Użycie danych w asercji:

test("quick payment with correct data", async ({ page }) => {
  // Arrange
  const url = "https://demo-bank.vercel.app/";
  const userId = "testerLO";
  const userPassword = "10987654";


  const receiverId = "2";
  const transferAmount = "150";
  const transferTitle = "pizza";
  const expectedTransferReceiver = "Chuck Demobankowy";


  // Act
  await page.goto(url);
  await page.getByTestId("login-input").fill(userId);
  await page.getByTestId("password-input").fill(userPassword);
  await page.getByTestId("login-button").click();


  await page.locator("#widget_1_transfer_receiver").selectOption(receiverId);
  await page.locator("#widget_1_transfer_amount").fill(transferAmount);
  await page.locator("#widget_1_transfer_title").fill(transferTitle);


  await page.getByRole("button", { name: "wykonaj" }).click();
  await page.getByTestId("close-button").click();


  // Assert
  await expect(page.locator("#show_messages")).toHaveText(
    `Przelew wykonany! ${expectedTransferReceiver} - ${transferAmount},00PLN - ${transferTitle}`
  );
});