bfcache Issue after adding i18n module

[BrocksiNet]

Environment

• Operating System: Linux
• Node Version: v20.11.1
• Nuxt Version: 3.11.1
• CLI Version: 3.11.1
• Nitro Version: 2.9.4
• Package Manager: [email protected]
• Builder: -
• User Config: devtools
• Runtime Modules: -
• Build Modules: -

Reproduction

https://stackblitz.com/edit/github-jjkr5f

Describe the bug

I was researching a lot today about that issue. 🔍

I assume that the issue comes from nuxt i18n module.

So I created a empty nuxt/vite project with that command:
pnpm dlx nuxi@latest init <project-name>

Testing this in preview mode is important because Vite is opening a WebSocket in dev mode, which can also cause an issue with bfcache.

So the steps for testing are:

1. pnpm build
2. pnpm preview
3. Open the Page in a Chrome Browser
4. Open Dev Tools -> Application -> Back/Forward Cache -> Click on Test Button

Result:

• Blank Nuxt/Vite Project -> No bfcache Issue ✔️
• Blank Nuxt/Vite Project + i18n module -> bfcache Issue ❌

Somehow I assume it has something to do with detectBrowserLanguage function. But not sure about that. 😕

Can someone reproduce or confirm? I hope I am wrong.

Additional context

No response

Logs

No response

[BobbieGoede]

This seems to be caused by useCookie provided by Nuxt (which is used by @nuxtjs/i18n), I modified your reproduction to demonstrate here.

I recommend opening an issue on the Nuxt repo as there isn't much we can do about this here.

[BrocksiNet]

But what about this PR in nuxt repo.
It should fix that problem?

[FlorianWerndl]

I tried disabeling detectBrowserLanguage but problem seems to persist.