Cannot submit form when testing with playwright

Hi, I run into this issue:

  • Goal: I want to test my app using playwright

  • Steps: Given a simple form with a standard submit button that triggers a query on submit. Inside a playwright test, if i do something like

await page.getByRole('button', { name: 'Submit' }).click();

Despite the button is found by playwright, the submit event never occurs

  • Details: If i change the interaction type inside the button from submit to default and add the query trigger as an event listener, it works. But all the form validation logic is gone as well, and has to be rewritten with a run script handler

I created a little repo (https://github.com/lastraperas/retool-examples) with the setup code for running the playwright test and 2 versions of a really simple app. The only thing that's different between them is the button interaction type and that one fails the test and the other passes.

Hopes this help to understand what's going on, and if is there any other workaround possible that can be testable and doesn't involve losing the build validation logic.

Thanks
Mariano

2 Likes