Cookie expiration trace problem in Chrome and Safari

[LazzyLizzard]

I have a problem tracing cookie expiration in Google Chrome and Safari browsers - but everything works fine in Firefox. My goal is when a cookie expires I must show a modal.

What I'm doing:

1. setting a test cookie with 15 seconds lifespan. This operation is successful.

 const [cookies, setCookie, removeCookie] = useCookies([COOKIE_NAME]);

 useEffect(() => {
  console.log('cookies', cookies);
  setCookieInfo(cookies[COOKIE_NAME] || 'NO');
}, [cookies]);

// some code skipped

 {COOKIE_NAME}: {cookieInfo}

<button
  onClick={() => {
    const date = new Date(Date.now() + 1000 * 15);
    setCookie(COOKIE_NAME, `TILL ${date.toUTCString()}`, {
       expires: date,
       path: '/',
    });
  }}
>

2. In parent component I'm checking if cookie expires

const [cookies, setCookie, removeCookie, updateCookies] = useCookies([
        COOKIE_NAME,
    ]);

    useEffect(() => {
        const interval = window.setInterval(() => {
            const date = new Date();
            updateCookies();
            console.log('tick', date.toUTCString());
        }, 1000);

        return () => {
            console.log('CDU');
            window.clearInterval(interval);
        };
    }, [updateCookies]);

Expected: as soon as cookie is set, I see cookieInfo. As it's expired, I see NO instead of cookie info. Actual: even if a cookie is expired, cookie information is still being displayed. Environment: React 18, react-cookies - 7.2.0, Chrome 128.0.6613.86

Here's a repo with minimal code - https://github.com/LazzyLizzard/cookie-check. Thank you.