Js-cookie: Cookie disappears after it set

[hrahimi270]

Describe the bug
After creating a cookie and reloading the page, the cookie deletes (disappears). But, when I reload for the second time, it shows up again!
It's not an appropriate behavior due I need the cookie to handle some stuff on my application.
The creation and getting the cookie is just the same as doc.

To Reproduce
Steps to reproduce the behavior:

1. I give data from the server.
2. Send my data to a function to set the cookie.
3. After setting the cookie, I redirect the user to another page(not with hard-reload).
4. everything is ok here.
5. I reload the page, but the cookie is not there!
6. If I reload again for the second time, the cookie is back!

Expected behavior
The cookie must exist after it set. And not disappear after reloading.

Desktop

• OS: macOS
• Browser: Chrome
• Version: 84 (latest, but I tested in 83 too)

Additional context
I'm using React with Next.js framework. But I'm not sure this is the problem (:

[carhartl]

A test case allowing to reproduce would help.

[carhartl]

Doesn’t have to be a unit test of course, rather a stripped down version of your app deployed to vercel. Often times the process of creating the stripped down code helps to find the issue.

[carhartl]

Another thing to think of, why sending data to the client only to store it in a cookie.. — you could send the data in a cookie from the server right away.

[hrahimi270]

Thanks, @carhartl for your response.
Unfortunately, I can't reproduce it. There are lots of files and codes integrated together.
But here is the function that has the task for setting the cookie:

export function setAuthToken(tokenType: string, token: string, expires: number) {
    const value = JSON.stringify({tokenType, token})
    Cookies.set(COOKIE_NAME, value, {
        expires,
        path: ''
    })
}

And here is the function that has the task for getting the cookie:

export function getAuthToken(): IGetAuthToken {
    const tokenData = Cookies.get(COOKIE_NAME)

    if (!tokenData) {
        return {
            token: '',
            tokenType: ''
        }
    }

    const authToken: IGetAuthToken = JSON.parse(tokenData)
    return authToken;
}

---

you could send the data in a cookie from the server right away.

Because in my use case, I need to manage the cookie myself, not with the backend.
But I think it's not necessary to leave this task to the backend. I should be able to handle it myself😀

[carhartl]

Ah.. I think it’s because of path: ''. You’re setting the cookie only for the current path, and that matches exactly the behavior you’re describing. The default is path: '/', so you should just remove that config.

[hrahimi270]

Oh, my God!
Yes, it works fine now ((:
I didn't pay attention to that!
Thank you @carhartl for your help.