Playwright 자동 테스트 Common Pocket: 이 3 오류는 가장 쉬운 오버턴입니다.

Playwright는 현대 브라우저 자동화 도구이지만 많은 사람들이 프로세스에서 단계. 그리고 오늘 나는 가장 일반적인 실수를 꺼내려고하고, 나는 당신이 pits을 피하는 데 도움이 될 것입니다.

오류 1 : 요소 로딩을 기다리지 않고 작업

이것은 가장 일반적인 pit입니다. 많은 사람들이 잘 보이는 코드를 작성하지만 잘못 실행 :element not found나는 모른다.

실수:

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

문제는 페이지가로드되지 않을 수 있으며 버튼은 존재하지 않습니다.

정확한 연습:

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

또는 더 현대적인 방법으로:

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

Playwright의 위치는 자동으로 요소가 상호 작용할 때까지 기다립니다. 이는 Selenium의 주요 장점입니다.

오류 2 : 동적로드를 기다리는

많은 웹 사이트 사용 JavaScript는 역동적으로 콘텐츠를 렌더링합니다. 여러분의 스크립트는 내용이 로드되기 전에 데이터를 추출할 수 있습니다.

실수:

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

정확한 연습:

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

또는 특정 요소:

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

Error 3: 브라우저의 컨텍스트 및 페이지 수명주기는 제대로 처리되지 않았습니다.

많은 사람들이 브라우저 예제를 만들고 메모리 누설을 유발하는 것을 잊지. 또는 잘못된 시간에 브라우저를 종료, 스크립트를 붕괴.

실수:

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

정확한 연습:

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

또는 더 우아한 방법으로:

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();
}

제품정보

Playwright의 핵심은(주)이름 *Life Cycle 관리나는 모른다. 이 세 가지 점을 기억하십시오:

항상 요소가 로드 될 때까지 기다립니다
동적 콘텐츠는 볼 수 있습니다.
브라우저와 컨텍스트를 닫으려면

이 방법, 일반적인 실수의 99 %는 피할 수 있습니다.