Log in form not redirecting to new page / registering log in

Question

Have tried different methods of validating username and password, and sending to the new page but page just reloads after clicking button. Had thought preventDefault() would stop this. If anyone notices the problem, please let me know, thanks.

const loginForm = document.querySelector('login-form')
const loginButton = document.querySelector('login-form-submit')
loginButton.addEventListener("click", (e) => {
  e.preventDefault();
  const username = loginForm.username.value;
  const password = loginForm.password.value;
  if (username === 'admin' && password === 'admin1') {
    alert("You have logged in!");
    window.open('Data.html');
  } else {
    alert("Incorrect Password");
  }
})

<div class="signin">
  <form id="login-form">
    Sign in to access your account
    <br>
    <br>
    <label for="name">Account Name:</label>
    <input type="text" id="username-field" name="username" class="login-form-field" placeholder="Username"><br><br>
    <label for="password">Account Password:</label>
    <input type="password" id="password-field" name="password" class="login-form-field" placeholder="Password"><br><br>
    <input type="submit" value="Log In" id="login-form-submit">
  </form>
</div>

Answer 1

loginForm.addEventListener('submit', function(e){
    e.preventDefault();
    const username = e.currentTarget.querySelector('[name="username"]').value;
    const password = e.currentTarget.querySelector('[name="password"]').value;
})