[Playwright Interview question #16]: Cách wait cho Ajax request hoàn thành?

Câu hỏi phỏng vấn #16: Cách wait cho Ajax request hoàn thành?

Trả lời mẫu:

Playwright cung cấp nhiều cách để wait for network requests:

1. Wait for specific request:

// Wait for API call
await page.waitForRequest('**/api/data'); // With predicate
await page.waitForRequest(request => request.url().includes('/api/users') && request.method() === 'POST'
);

2. Wait for response:

// Wait for response
const response = await page.waitForResponse('**/api/submit');
console.log(await response.json()); // With status check
await page.waitForResponse(response => response.url().includes('/api/data') && response.status() === 200
);

3. Wait for network idle:

// Wait until no network activity
await page.waitForLoadState('networkidle'); // Custom network idle
await page.waitForLoadState('domcontentloaded');
await page.waitForTimeout(500); // If needed

4. Promise.all pattern:

const [response] = await Promise.all([ page.waitForResponse('**/api/save'), page.locator('#save-button').click()
]);

5. Wait for multiple requests:

// Wait for all API calls to complete
const responsePromises = [ page.waitForResponse('**/api/users'), page.waitForResponse('**/api/products'), page.waitForResponse('**/api/orders')
]; await page.click('#load-data');
await Promise.all(responsePromises);

💡 Tips:

• Prefer waitForResponse over waitForTimeout
• Use networkidle carefully - có thể slow
• Combine với expect() để verify data
• Monitor specific endpoints thay vì wait all

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!