Playwright Mouse Click

In this article, we will see about the mouse click function in the playwright. The mouse click is nothing but a method that performs a simple human click.

await page.locator('//i[@class="fas fa-search"]').click()

• This clicks on the element it was passed.

await page.locator('//a[@class="we-mega-menu-li"][normalize-space()="Tutorials"]').hover()

• This hovers over the element and reveals the hover menu if it is there.

await page.locator('//i[@class="fas fa-search"]').dblclick()

• This one double-clicks on the provided element.

await page.locator('//i[@class="fas fa-search"]').click({button: 'right'})

• Context clicks on the element.

await page.locator('//i[@class="fas fa-search"]').click({ modifiers: ['Shift'] })

• It uses the shift+click key modifier, which opens a new tab.

await page.locator('//i[@class="fas fa-search"]').click({ position: { x: 0, y: 0} })

• Clicks based on pixel position.
• Sometimes apps use non-trivial logic, which overlays elements with another that intercepts the click.
• At this time, forcing a click is the best move.

await page.locator('//i[@class="fas fa-search"]').click({force: true})

• We can also dispatch a click event if you are not interested in using the actual condition.

await page.locator('//i[@class="fas fa-search"]').dispatchEvent('click');