Assertions

Assertions regroupe les vérifications prêtes à l'emploi appliquées à un composant et à l'une de ses clés d'élément.

En pratique, cette namespace permet d'écrire des attentes plus lisibles et plus homogènes qu'une succession d'appels Playwright dispersés dans les tests.

Exemple simple

import { Assertions, createComponent, createWebsite, type Website } from "@duplojs/playwright";
import test from "playwright/test";

interface TestFixtures {
	website: Website;
}

const testClient = test.extend<TestFixtures>({
	async website({ page, context }, use) {
		const website = createWebsite({
			playwrightPage: page,
			playwrightBrowserContext: context,
			envConfig: {
				baseUrl: "https://example.com",
			},
		});

		await use(website);
	},
});

const searchForm = createComponent(
	"searchForm",
	{
		getMainElement({ body }) {
			return body.locator("[data-search-form]");
		},
		getElements({ mainElement }) {
			return {
				query: mainElement.locator("input"),
				submit: mainElement.locator("button[type='submit']"),
			};
		},
	},
);

testClient("assertions example", async({ website }) => {
	const component = await website.iWantToSee(searchForm);

	await Assertions.toHaveValue(component, "query", "duplojs");
	await Assertions.toBeVisible(component, "submit");
});

Ce qui se passe ici

• le composant expose des éléments nommés
• Assertions.toHaveValue(...) et Assertions.toBeVisible(...) ciblent ces éléments directement
• le test reste orienté vérification métier plutôt que détail technique

À quoi ça sert ?

Assertions sert surtout à :

• mutualiser les attentes fréquentes
• garder un vocabulaire cohérent dans les tests
• éviter de répéter les mêmes séquences d'assertions
• centraliser des vérifications enrichies comme la visibilité préalable

toBeVisible

Assertions.toBeVisible(component, elementKey)

Vérifie qu'un élément est visible.

toHaveText

Assertions.toHaveText(component, elementKey, text)

Vérifie qu'un élément possède exactement le texte attendu.

toContainText

Assertions.toContainText(component, elementKey, text)

Vérifie qu'un élément contient le texte attendu.

toHaveNoText

Assertions.toHaveNoText(component, elementKey)

Vérifie qu'un élément n'a pas de texte.

toBeHidden

Assertions.toBeHidden(component, elementKey)

Vérifie qu'un élément est caché.

toHaveQuantity

Assertions.toHaveQuantity(component, elementKey, {
  quantity,
  operator?,
})

Vérifie le nombre d'éléments correspondant à un locator.

toBeEnabled

Assertions.toBeEnabled(component, elementKey)

Vérifie qu'un élément est activé.

toBeChecked

Assertions.toBeChecked(component, elementKey)

Vérifie qu'un élément est coché.

toBeDisabled

Assertions.toBeDisabled(component, elementKey)

Vérifie qu'un élément est désactivé.

toHaveAttribute

Assertions.toHaveAttribute(component, elementKey, name, value?)

Vérifie qu'un élément possède un attribut attendu.

toHaveClass

Assertions.toHaveClass(component, elementKey, value)

Vérifie qu'un élément possède la classe attendue.

toHaveValue

Assertions.toHaveValue(component, elementKey, value)

Vérifie qu'un élément possède la valeur attendue.

toBeBusy

Assertions.toBeBusy(component, elementKey)

Vérifie qu'un élément porte aria-busy="true".

toBeNotBusy

Assertions.toBeNotBusy(component, elementKey)

Vérifie qu'un élément porte aria-busy="false".

withStep

Assertions.withStep(label).assertion(component, elementKey, ...args)

Retourne les mêmes assertions, mais regroupées sous un test.step(...) personnalisé. L'appel utile est ensuite chaîné sur le wrapper retourné.

Voir aussi

• Actions - pour les interactions prêtes à l'emploi sur les composants.
• Component - pour définir les éléments sur lesquels les assertions s'appliquent.
• Component Interaction - pour créer des vérifications personnalisées si les assertions fournies ne suffisent pas.