Playwright Automatic Test Common Pocket: Ces 3 erreurs sont les plus faciles à renverser.

Playwright Automatic Test Common Pocket: Ces 3 erreurs sont les plus faciles à renverser.

Playwright est un outil moderne d'automatisation de navigateur, mais beaucoup de gens pas dans le processus. Et aujourd'hui, je vais éliminer les trois erreurs les plus courantes, et je vais vous aider à éviter les fosses.

Erreur 1: Opérations sans attendre le chargement des éléments

C'est la fosse la plus courante. Beaucoup de gens écrivent des codes qui ont l'air corrects, mais ils se trompent :element not foundJe ne sais pas.

Erreur:

await page.click("#submit-btn");

Le problème est que la page peut ne pas être chargée et le bouton n'existe pas.

Pratique correcte:

await page.waitForSelector("#submit-btn");
await page.click("#submit-btn");

Ou de manière plus moderne:

await page.locator("#submit-btn").click();

Le localisateur de Playwright attend automatiquement que les éléments interagissent, ce qui est un avantage majeur par rapport au Sélénium.

Erreur 2: Négligence en attente d'un chargement dynamique

De nombreux sites Web utilisent JavaScript dynamiquement pour rendre le contenu. Votre script peut avoir commencé à extraire des données avant le chargement du contenu.

Erreur:

await page.goto("https://example.com");
const text = await page.textContent(".dynamic-content");
console.log(text); // 可能是 null 或空字符串

Pratique correcte:

await page.goto("https://example.com");
await page.waitForLoadState("networkidle");
const text = await page.textContent(".dynamic-content");
console.log(text);

Ou pour des éléments spécifiques:

await page.locator(".dynamic-content").waitFor({ state: "visible" });
const text = await page.textContent(".dynamic-content");

Erreur 3: Le contexte et le cycle de vie de la page du navigateur n'ont pas été traités correctement

Beaucoup de gens créent des exemples de navigateur et oublient de les désactiver, causant une fuite de mémoire. Ou fermez le navigateur au mauvais moment, provoquant l'effondrement du script.

Erreur:

const browser = await chromium.launch();
const page = await browser.newPage();
await page.goto("https://example.com");
// 忘记关闭浏览器

Pratique correcte:

const browser = await chromium.launch();
try {
  const page = await browser.newPage();
  await page.goto("https://example.com");
  // 你的操作
} finally {
  await browser.close();
}

Ou d'une manière plus élégante:

const browser = await chromium.launch();
const context = await browser.newContext();
const page = await context.newPage();

try {
  await page.goto("https://example.com");
  // 你的操作
} finally {
  await context.close();
  await browser.close();
}

Résumé

Le noyau du dramaturge estAttendez.etGestion du cycle de vieJe ne sais pas. Rappelez-vous ces trois points :

1. Attendez toujours que les éléments soient chargés
2. Le contenu dynamique doit être visible.
3. N'oubliez pas de fermer le navigateur et le contexte

Ainsi, 99 % des erreurs courantes peuvent être évitées.