Parsing request body in a Chrome extension listener returns "undefined"

Question

I am building a Chrome extension that extracts user data from a registration form on a website. I have set up a listener to intercept the form data, but when I try to retrieve the user's first and last name using FormData, it returns "undefined".

Here's the relevant code:

manifest.json

{
  "name": "My extension",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Extract user data from a registration form",
  "permissions": [
    "webRequest",
    "<all_urls>",
    "webRequestBlocking"
  ],
  "background": {
    "scripts": ["background.js"],
    "persistent": true
  }
}

background.js

chrome.webRequest.onBeforeRequest.addListener(
  function(details) {
    if (details.url.includes("https://www.example.com/register/")) {
      const form = new FormData(details.requestBody.formData);
      const userFirstName = form.get('firstName');
      const userLastName = form.get('LastName');
      console.log(`First name: ${userFirstName}, Last name: ${userLastName}`);
    }
  },
  { urls: ["<all_urls>"], types: ["main_frame"] },
  ["requestBody"]
);

The Error from the console

I have confirmed that the listener is working and intercepting the form data, but I can't seem to retrieve the user's first and last name. Any ideas on what could be causing this issue?

Any help would be greatly appreciated. Thank you!