title: How do i use jest to test javascript code with DOM elements
body: <p>Am new to javascript and i have been trying to write tests for his code but i have not been able to,we are supposed to use jest.
  I have researched for long without getting a solution.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>document.getElementById("signup").addEventListener("submit", function(e) {
    e.preventDefault();
    data = {
      username: document.getElementById("username").value,
      email: document.getElementById("email").value,
      password: document.getElementById("password").value,
      confirm_password: document.getElementById("confirmPassword").value,
    };
  });
  
  
  signUp = (data) =&gt; {
  
      fetch("https://diaryapi-v2.herokuapp.com/mydiary/v1/auth/register", {
          method: "POST",
          headers: {
            "Content-Type": "application/json"
          },
          body: JSON.stringify(data)
        })
        .then(res =&gt; res.json())
  
        .then(data =&gt; {
          if (data.message === "Your account was created") {
            let msg = data.message;
            document.getElementById("white").innerHTML = msg;
            window.location.href = "/signin";
          } else {
            let msg = Object.values(data);
            console.log(msg)
            document.getElementById("white").innerHTML = msg;
          }
  
        })
        .catch(error =&gt; console.error("Error:", error));
  
  }</code></pre>
  </div>
  </div>
  </p>