LocalStorage not setting item on some pages

I’m running a local server with MAMP and my URL is https://dev.mysite.io. I’m trying to set a localStorage item containing just an expiry date and use it to show/hide stuff based on that date. Now, if I’m on my home page I’m able to set the localStorage item without problems, but if I go to page https://dev.mysite.io/test-page the localStorage item is not being set, yet if I’m on a page https://dev.mysite.io/test-page/test, the item is being set.. If I’m understanding everything correctly, the localStorage should be available for all pages under the domain https://dev.mysite.io, all pages have the same origin (protocol, port, domain & etc.).
Here is my JS:

$( function() {
    const storageKey = 'show_content';
    const expiry = 7 * 24 * 60 * 60 * 1000; // should be equal to 1 week in ms
    const expiryDate = new Date().getTime() + expiry;

    // Check if the content should be displayed
    const showContent = localStorage.getItem( storageKey );
    const timeNow = new Date().getTime();

    // Show content after 1 week time
    if ( ! showContent || timeNow > showContent ) {
        $( '.content' ).show();
        localStorage.removeItem( storageKey );
    }

    // Set the localStorage and hide the content when the close button is clicked
    $( '.content__close' ).on('click', () => {
        localStorage.setItem( storageKey, expiryDate );
        $( '.content' ).hide();
    } );
} );