Chrome extension listener not triggering on event

Question

I am currently working on a Chrome extension that needs to capture and print the First and Last Name fields when a user registers on a certain webpage.

However, I am facing an issue where the listener for the registration event is not being triggered, and nothing appears in the console when the registration button is clicked.

I have already checked my manifest file and background script for any errors, and I'm not seeing any error messages in the console.

Here is the relevant portion of my manifest file:

{
  "name": "My extention",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Print user first+last name to the console",
  "permissions": [
    "webRequest",
    "<all_urls>",
    "webRequestBlocking"
  ],
  "background": {
    "scripts": ["background.js"],
    "persistent": true
  }
}

Here is the relevant portion of my background.js file:

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(`FirstName: ${userFirstName}, LastName: ${userLastName}`);
    }
  },
  { urls: ["<all_urls>"], types: ["main_frame"] },
  ["requestBody"]
);

Any help in resolving this issue would be greatly appreciated. Thank you!