title: FormData object returns empty even for a non-empty form
body: <p><code>FormData</code> object is empty for a form with 2 input fields. <code>formData.getAll()</code> logs a error <code>TypeError: Not enough arguments to FormData.getAll.</code>.
  Here is my code:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html lang="en"&gt;
    &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;title&gt;Document&lt;/title&gt;
  
      &lt;script&gt;
        function test () {
          var element = document.getElementById("invite-form");
          console.log(element);
          var formdata = new FormData(element)
          console.log(formdata.getAll());
        }
      &lt;/script&gt;
  
    &lt;/head&gt;
    &lt;body&gt;
  
      &lt;form id="invite-form" method='POST' action=''&gt;
        &lt;label for="email"&gt;Email...&lt;/label&gt;
        &lt;input type="text" name="email" value="human@earth.com"/&gt;
        &lt;input type="hidden" name="csrf_token" value="random" /&gt;
        &lt;button class="btn" onclick="test()"&gt;Button&lt;/button&gt;
      &lt;/form&gt;
  
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I tried to populate the <code>FormData</code> object with the values from the form on clicking the button</p>