Testing form submissions: front end
I’d like to share how I routinely check my form submissions from the front end.
Firstly, press CMD+option+I and go to the network tab. Fill out the form with the data you want to submit. Next in chrome devtools , check preserve log, disable cache, and press the clear button to remove everything there at the moment.
From there, submit the form and look at the calls that are being made, specifically any requests POST/GET. 200 status means OKAY. 302 status means a redirect is taking place, but since we are preserving the log, we won’t lose the submission data once the page redirects. Click the network call you want to verify and check that the data is correct in the Headers>Response Headers section. If you are making multiple calls, be sure to check all of them in the same way.
If everything looks good, this means the call was made successfully! Any other issue that arises in the form of the user not receiving data, or incorrect data is very likely caused by an issue in the backend. I hope this helps in debugging your form submissions.