How to solve: Locate and Click Elements in Playwright?

Question

Accepted Answer

Playwright handles multiple tabs/pages by listening to events on the browser context:
1. Start listening for the `page` event on the context: `const pagePromise = context.waitForEvent('page')`.
2. Locate the link using semantic filters: `page.locator('.social-grid').getByText('GitHub')`.
3. Click the link. This triggers the tab opening.
4. Await the page promise to resolve the target tab: `const newTab = await pagePromise`.
5. Run assertion: `await expect(newTab).toHaveURL(/github\.com/)`.