How to see form data with enctype = “multipart/form-data” in Chrome debugger

Question

I\'m trying to visualize form data in Chrome Debugger. Data are sent through a from which loads a file and sends some text. Something like this one:

Answer 1

I tested on my platform: Chrome 79.0.3945.130 (Official Build) (64-bit), Windows 10. I confirm that this problem remains on the up to date version of Chrome (as of 1/22/2020).

To be precise, the problem I found in Chrome 79.0.3945.130 (and Chromium Edge 79.0.309.68 as well) is as follows:

1. For a multipart/form-data POST request, if we don't specify any file to upload and hit the form submit button, we do see the "Form Data" section under Network tool's headers tab. The "Form Data" section lists all regular form fields, e.g., a form field is shown in the following pic, and the file field shows nothing because I didn't upload any file.

2. For a multipart/form-data POST request, if we actually upload a file, regardless of its size (such as 0B), the entire "Form Data" section disappears, including regular form fields! See the following pic in which I collapsed all sections under Headers to demonstrate the point.

I agree it makes good sense to hide the file content for performance reasons as described in this question and this discussion, but it makes no sense to hide all regular form fields as well. I believe this is a Chrome bug.

In FireFox, we see all Form Data and uploaded file content under F12 dev tools > Network > Params. In the following example, I uploaded file.txt with the content: hello Firefox from file.txt.

So Firefox offers a temporary solution before Chrome addresses this issue.