Uncaught TypeError: Cannot read properties of null (reading 'addEventListener')

[ElliotM]

Hello there,

My script is not executing in the console when loading my page in Shopify.

This is the HTML

     <div class="formdomain">
         <form action="" method="post" id="domainCheck">
    <h3 style="font-size: 21px; color: black;">Kies je eigen domeinnaam</h3>
    <p style="margin-top: 5px; color: #666666;">Vul de door jouw gekozen domeinnaam hieronder in, deze wordt bevestigd zodra je een product aan je winkelmandje toevoegt.</p>
    <div style="margin-top:15px;">
    <form id="form" method="POST">
    <p class="line-item-property__field">
    <div class="input-wrapper">
    <input id="custom-text" type="text" name="customUrl" placeholder="Domeinnaam">
    <p style="font-weight:600; display:block; margin-top:15px;">example.app/domeinnaam</p>
    </div>
    <button id="AddButtonAPI" disabled>Toevoegen aan winkelwagen</button>
  </form>
  </div>
    <span id="domainAvailable">Typ een domeinnaam in om de beschikbaarheid te testen</span>
          </div>

This is the Javascript

const domainForm = document.getElementById('domainCheck');
      async function checkDomain(customUrl) {
      const formData = new FormData(domainForm)
      var appDomain = document.getElementById("domainAvailable");
      const response = await fetch( "https://example/api/checkCustomUrl", {
        method: 'POST',
        body: JSON.stringify({ customUrl: customUrl }),
        headers: {
          'Content-type': 'application/json',
          'Accept': 'application/json',
        }
      });
      return response.json();
      }
  let person = {
    exists: 'true',
    exists: 'false'
  };
    domainForm.addEventListener('change', (e) => {
      checkDomain(e.target.value)
      .then((response) => {
        if(response.exists == 'true'){
            console.log(response);
            document.getElementById("domainAvailable").innerHTML = "Domain is not free";
            document.getElementById("AddButtonAPI").disabled = true;
        } else if(response.exists == 'false'){
            console.log(response);
            document.getElementById("domainAvailable").innerHTML = "Domain is free";
            document.getElementById("AddButtonAPI").disabled = false;
        }
      })
    });

Does anyone knows why the script is not executing?

If i load the html file in my browser it works fine, in Shopify the console error keeps popping up and the function is not working.

Thanks alot!