Cookies are only saved when form data is submitted without the use of eventListeners

I'm in the middle of a really weird problem.  

So my panel has some really standard forms.  One for entering credentials and another for file upload.  For whatever reason the cookies are only set when I use the forms without event listeners. 

Here's an example: 

    <form action="http://localhost:3000/login" method="POST" id="loginForm">
        <div>
            <label for="email">Email</label>
            <input type="email" id="email" name="email" required>
        </div>
        <div>
            <label for="password">Password</label>
            <input type="password" id="password" name="password" required>
        </div>
        <a href="/forgotPassword">Forgot Password?</a>
        <button type="submit">Login</button>
    </form>
    

When I submit form data that way I get a cookie assigned just fine.  

However when I submit data via an event listener, the request goes through just fine but the cookies aren't saved.  This is particularly annoying because I need event listeners to do some followup action on the network request.  I know this works because I'm using this same exact logic below on a different webpage (outside of adobe) that relys on this function and it does exactly what it's supposed to do.  

        const loginForm = document.getElementById('loginForm');
        loginForm.addEventListener('submit', submitLoginForm);
        
        const submitLoginForm = async (event) => {
            event.preventDefault();

            const email = document.getElementById('email').value;
            const password = document.getElementById('password').value;
            const data = { email, password };

            try {
                const response = await fetch('http://localhost:3000/login', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json'
                    },
                    body: JSON.stringify(data)
                });

                const responseData = await response.json();
                const serverResponse = document.getElementById('serverResponse');
                serverResponse.innerText = serverResponse.message;

            } catch (err) {
                console.error(err);
            }
        }

I'm going through this cookie documentation to see if there are any clues: 
https://github.com/Adobe-CEP/CEP-Resources/blob/master/CEP_11.x/Documentation/CEP%2011.1%20HTML%20Extension%20Cookbook.md

If anyone has any feedback at all that would be great.  Thank you!