e.preventDefault(); not working in vanilla javascript [closed]

I made simple html form and want to prevent the default refreshing of the page using e. preventDefault(). But it is not working.

HTML:

<form id="player-details" action="">
    <input type="text" placeholder="Enter your name">
    <button id="play-btn" type="submit">Play</button>
</form>

JS:

const playerDetailsForm = document.querySelector("#player-details");
// event handling for player name input
playerDetailsForm.addEventListener("submit",(e)=> {
    e.preventDefault();
    //I tried to log the target but it is not working either
    console.log(e.target);
});