-
Notifications
You must be signed in to change notification settings - Fork 255
Description
Reproduction example
https://github.com/ItamarGronich/react-testing-library-submit-form
Prerequisites
- Clone the repo
- Install dependencies with
pnpm i - run test with
pnpm test
Expected behavior
Submitting a form by simply clicking the submit button should not log any errors to the console.
Actual behavior
Submitting a form by clicking the submit button logs jsdom errors for unimplemented submit
Error: Not implemented: HTMLFormElement.prototype.requestSubmit
User-event version
14.6.1
Environment
Testing Library framework: @testing-library/[email protected]
JS framework: [email protected]
Test environment: [email protected]
DOM implementation: [email protected]
Additional context
First of all i want to express my deep appreciation of testing library, how it's orchestrated and written.
It's truly a fine piece of open source software and a delight to use so Kudos to everyone involved 🎉 🐙
I know this is an un-implemented feature in jsdom.
I was actually shocked and couldn't believe that it was, because well....
The internet was made so people can submit forms...
But it's true: jsdom/jsdom#1937
And i understand why, Domenic said it was a massive undertaking.
So this is technically not @testing-library/user-event's fault.
What can we do to make this experience better?
Can you think of a way that testing library can help here?
I thought maybe we can implemented some workaround in the code like creating a userEvent.submit utility which handles this special case without triggering jsdom unimplemented submit , or maybe explain the problem and how to submit forms with a click on the submit button without error logs?
Because right now, my ci logs are spammed with ungodly amount of these error logs, and i want to keep my CI logs clean, lean and inspectable while also taking care not to mute and nuke important error logs coming from my tools.
I know that it doesn't actually fail anything because it's not a real error but just a console error, but I dove quite deep in the rabbit hole to try and find some workarounds.
Some workarounds involved:
- mocking the virtual console in the test - i don't like this. i don't want to ask my users to workaround such a trivial case of submitting a form the solution has to be at the infrastructure level.
- creating a wrapper jsdom environment and muting the jsdom submit errors. This might be the solution but it feels also a bit shaky since i'm muting an error which actually tells me something is un-implemented. if someone where to use submit anywhere it won't work and no error would appear.
- fire submit event directly on the form - this is wrong imho because it goes against the testing-library philosophy of testing like a real user and the whole reason user-events was created in the first place. users don't go submitting forms programmatically, the click on the submit button.
I feel like jest+jsdom+user_events should be a very common pattern. Possbily the most common pattern.
And submitting forms, is surely the most common action to do on the web.
And right now, this very popular and modern combo has an error log when you submit a form the right way.