Web App Failing to Write to Firestore Emulator or Firestore Production

Question

it's my first time working with Firebase, and I am trying to write to my Firestore database by using a rudimentary form. However, when I submit the form, nothing shows up in the database, both by using the emulator or on the production Firestore. Neither the id or the error is logged on the console. Any guidance would be appreciated, thank you in advance.

  // Initialize Firebase
  const app = initializeApp(firebaseConfig);
  const analytics = getAnalytics(app);
  const db = getFirestore(app);
  // connectFirestoreEmulator(db, '127.0.0.1', 8080);

  async function submitForm() {
    // Get form values
    var firstName = document.getElementById("firstName").value;
    var lastName = document.getElementById("lastName").value;
    var phoneNumber = document.getElementById("phoneNumber").value;

    // Create an object with the form data
    var formData = {
      "First_Name": firstName,
      "Last_Name": lastName,
      "Phone_Number": phoneNumber
    };
    try {
      const newDoc = await setDoc(doc(db, "attendees", "testID"), formData);
      console.log("new id is", newDoc.id);
    }
    catch (err) {
      console.error("write to firestore failed. reason :", err);
    }
    
    document.getElementById("firstName").value = "";
    document.getElementById("lastName").value = "";
    document.getElementById("phoneNumber").value = "";
  }
  var form = document.getElementById("infoform");
  form.addEventListener("submit", submitForm);
</script>

Tried running it on emulator and deployed temporarily, no effect.