search

shopware / frontends

Shopware Frontends is a framework for building custom, headless storefronts with Shopware 6.
https://frontends.shopware.com
MIT License
176 stars 49 forks source link

[BUG] bfcache Issue #767

Closed BrocksiNet closed 1 month ago

BrocksiNet commented 8 months ago

Is there an existing issue for this?

Current Behavior

That's the problem image

That could be a solution https://github.com/nuxt/nuxt/pull/23667

Expected Behavior

The Issue is not shown anymore in Lighthouse for the demo-store. The demo-store works like before without any errors.

Steps To Reproduce

No response

Environment

No response

Anything else?

Another related https://github.com/shopware/frontends/issues/539

InstantlyMoist commented 8 months ago

Currently having the same issue, no dependencies seem to interfere with it.

BrocksiNet commented 7 months ago

I was researching a lot today about that issue. :mag:

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:

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

Created an Issue here: https://github.com/nuxt-modules/i18n/issues/2876

BrocksiNet commented 1 month ago

Today, I tested again with the Blank Nuxt/Vite Project + i18n module and can not reproduce the bfcache Issue anymore. This is great 🎉

So, it would be super cool to eliminate that problem in the demo-store template. 💡

Currently, we are using @nuxtjs/i18n in version 8.3.1, and I guess we need to update package.json to ^8.5.5.

But when I execute this command: pnpm run generate && pnpm run preview

I got a lot of warnings and errors. So, we need to fix the generate command first.

BrocksiNet commented 1 month ago

So when I update @nuxtjs/i18n and comment out this part in app.vue: //useBroadcastChannelSync();

We do not have any bfcache Issue anymore: Image

FYI @mdanilowicz