How to use Playwright to simulate the click event on a canvas element?

Question

When click everywhere on the canvas, the Playwright Inspector generates the same code:

page.click(":nth-match(canvas, 4)");

It can't trigger a event that happened on a button or a table line. Anybody could give me a solution to work out a automated test script on canvas?

Answer 1

You can provide X Y coordinates with the options object of the click action.

await page.locator('canvas').click({
  button: 'right',
  modifiers: ['Shift'],
  position: { x: 23, y: 32 },
});

https://playwright.dev/docs/api/class-locator#locator-click