[Playwright Interview question #28]: Cách troubleshoot test failures trong Playwright?

Câu hỏi phỏng vấn #28: How do you troubleshoot Playwright test failures?

Trả lời mẫu:

1. Use Debug Mode:

#Run with debug flag
npx playwright test --debug

#Debug specific test
npx playwright test example.spec.js:10 --debug

2. Trace Viewer:

// Enable trace on failure
use: {
  trace: 'on-first-retry',
}

// View trace
npx playwright show-trace trace.zip

3. Screenshots & Videos:

// playwright.config.js
use: {
  screenshot: 'only-on-failure',
  video: 'retain-on-failure',
}

// Manual screenshot
await page.screenshot({ path: 'debug.png' });

4. Console Logs:

// Capture browser console
page.on('console', msg => console.log('Browser:', msg.text()));
page.on('pageerror', error => console.log('Error:', error));

// Add debug logs
console.log('Current URL:', page.url());
console.log('Element visible:', await locator.isVisible());

5. Slow Motion & Headed Mode:

#Run slowly with UI
npx playwright test --headed --slow-mo=1000

6. Pause Execution:

test('debug test', async ({ page }) => {
  await page.goto('/');
  await page.pause(); // Opens inspector
  await page.click('#button');
});

7. HTML Report:

#Generate and open report
npx playwright test --reporter=html
npx playwright show-report

8. Network Logs:

// Log all requests
page.on('request', request => {
  console.log('>>', request.method(), request.url());
});

page.on('response', response => {
  console.log('<<', response.status(), response.url());
});

9. Element State Check:

// Debug element state
const element = page.locator('#button');
console.log({
  visible: await element.isVisible(),
  enabled: await element.isEnabled(),
  text: await element.textContent(),
  count: await element.count()
});

💡 Tips:

• Start với trace viewer - shows complete timeline
• Use headed mode để see actual behavior
• Check network tab trong trace cho API issues
• Add custom error messages trong assertions

Lời Kết

Playwright đang trở thành một trong những automation frameworks phổ biến nhất cho web testing. Thông qua series này, hy vọng bạn sẽ:

• Nắm vững kiến thức từ cơ bản đến nâng cao
• Tự tin trong các buổi phỏng vấn
• Áp dụng hiệu quả vào dự án thực tế
• Trở thành một phần của cộng đồng Playwright Việt Nam năng động

📚 Bắt đầu hành trình của bạn với: Bài 1: Playwright vs Selenium

💬 Có câu hỏi? Tham gia group Facebook của chúng mình!

⭐ Theo dõi series để không bỏ lỡ bài viết mới!