[Playwright Interview question #5]: Cách xử lý multiple tabs/windows trong Playwright?

Câu hỏi phỏng vấn #5: Cách xử lý multiple tabs/windows trong Playwright như thế nào?

Trả lời mẫu:

Playwright cung cấp nhiều cách để handle multiple tabs/windows:

1. Bắt new page/popup khi click link:

const [newPage] = await Promise.all([
  context.waitForEvent('page'),
  page.locator('a[target="_blank"]').click()
]);
await newPage.waitForLoadState();

2. Handle popup window:

const [popup] = await Promise.all([
  page.waitForEvent('popup'),
  page.locator('#open-popup').click()
]);
await popup.title(); // Làm việc với popup

3. Lấy tất cả pages đang mở:

const pages = context.pages();
console.log(`Có ${pages.length} tabs đang mở`);

4. Switch giữa các tabs:

// Bring to front
await page.bringToFront();
// Hoặc work với specific page
await pages[1].locator('#button').click();

💡 Tips:

• Luôn dùng Promise.all() để tránh race condition
• Mỗi page/popup có lifecycle riêng biệt
• Nhớ close pages không cần thiết để giải phóng resources
• Sử dụng context.newPage() để tạo tab mới manually

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!