\r\n ...\r\n````\r\n\r\nAdd some page with some async load time so to have the loading indicator show between route change.\n\n### Describe the bug\n\nThe browser view transition diffing makes the NuxtLoadingIndicator invisible up until the page is fully loaded when it shortly flashes to a 100%. If I remove the `viewTransition: true` it works as expected again.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2867,2870,2873],{"name":2868,"color":2869},"good first issue","fbca04",{"name":2871,"color":2872},"bug","d73a4a",{"name":2874,"color":2875},"馃敤 p3-minor","FBCA04",21280,"nuxt","open","NuxtLoadingIndicator is broken when using together with experimental.viewTransitions ","2024-11-19T16:20:26Z","https://github.com/nuxt/nuxt/issues/21280",0.61469597,{"description":2884,"labels":2885,"number":2897,"owner":2877,"repository":2877,"state":2878,"title":2898,"updated_at":2899,"url":2900,"score":2901},"### Environment\r\n\r\n- Operating System: Windows_NT\r\n- Node Version: v18.17.1\r\n- Nuxt Version: 3.10.2\r\n- CLI Version: 3.10.1\r\n- Nitro Version: -\r\n- Package Manager: pnpm@8.15.2\r\n- Builder: -\r\n- User Config: devtools, modules, routeRules\r\n- Runtime Modules: @nuxtjs/tailwindcss@6.11.4\r\n- Build Modules: -\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-uqxt1s\r\n\r\n### Describe the bug\r\n\r\nWhen using `NuxtLoadingIndicator`, an issue arises when navigating to a page with a different layout that contains an asynchronous operation within the setup function. In these specific cases, the loading indicator gets stuck and fails to disappear after the page has loaded.",[2886,2889,2890,2893,2894],{"name":2887,"color":2888},"workaround available","11376d",{"name":2871,"color":2872},{"name":2891,"color":2892},"pages","00DFB5",{"name":2874,"color":2875},{"name":2895,"color":2896},"suspense","C70109",25840,"NuxtLoadingIndicator gets stuck on page with different layout and async setup","2025-03-18T07:34:32Z","https://github.com/nuxt/nuxt/issues/25840",0.6416245,{"description":2903,"labels":2904,"number":2911,"owner":2877,"repository":2877,"state":2912,"title":2913,"updated_at":2914,"url":2915,"score":2916},"### Environment\r\n\r\n------------------------------\r\n- Operating System: `Windows_NT`\r\n- Node Version: `v16.16.0`\r\n- Nuxt Version: `3.2.0`\r\n- Nitro Version: `2.2.1`\r\n- Package Manager: `yarn@1.22.15`\r\n- Builder: `vite`\r\n- User Config: `modules`\r\n- Runtime Modules: `@nuxtjs/tailwindcss@6.4.0`, `@nuxtjs/fontaine@0.2.4`, `nuxt-icon@0.2.11`, `@nuxt/devtools@0.1.2`, `@nuxt/image-edge@1.0.0-27919678.2f5b64b`, `@nuxtjs/google-fonts@3.0.0-1`\r\n- Build Modules: `-`\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-tvjuvn?file=app.vue\r\n\r\n### Describe the bug\r\n\r\nIt seems that `NuxtLoadingIndicator` is not setting its opacity to `1` when it needs to be shown. This is a screenshot of the moment the loading indicator should appear:\r\n\r\n\r\n\r\n\r\n\r\n\r\n### Additional context\r\n\r\nNot working on v3.1.2 and edge either.\r\n\r\n### Logs\r\n\r\n_No response_",[2905,2908],{"name":2906,"color":2907},"3.x","29bc7f",{"name":2909,"color":2910},"pending triage","E99695",18969,"closed","`\u003CNuxtLoadingIndicator>` not working on `3.2.0`","2023-02-12T07:55:54Z","https://github.com/nuxt/nuxt/issues/18969",0.5826949,{"description":2918,"labels":2919,"number":2922,"owner":2877,"repository":2877,"state":2912,"title":2923,"updated_at":2924,"url":2925,"score":2926},"### Environment\n\n- Operating System: Darwin\r\n- Node Version: v20.10.0\r\n- Nuxt Version: 3.9.1\r\n- CLI Version: 3.10.0\r\n- Nitro Version: 2.8.1\r\n- Package Manager: yarn@4.0.2\r\n- Builder: -\r\n- User Config: ssr, runtimeConfig, app, modules, apiParty, devtools, eslint, storyblok, image, i18n, router, routeRules, components, vue, typescript\r\n- Runtime Modules: @nuxt/devtools@1.0.6, @nuxtjs/device@3.1.1, @nuxt/image@1.1.0, @nuxtjs/i18n@8.0.0, @nuxtjs/eslint-module@4.1.0, nuxt-api-party@0.22.3, nuxt-clarity-analytics@0.0.6, nuxt-jsonld@2.0.8, nuxt-swiper@2.0.0-0, @voctag/ui@1.0.50, @vueuse/nuxt@10.7.1, @pinia/nuxt@0.5.1, @storyblok/nuxt@6.0.0\r\n- Build Modules: -\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-wlowtc?file=app.vue\n\n### Describe the bug\n\nNuxtLoadingIndicator stuck/freeze\r\n\r\nHappens for example when you navigate from one page with layout A to another page with layout B via `navigateTo()`\r\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2920,2921],{"name":2906,"color":2907},{"name":2909,"color":2910},25081,"NuxtLoadingIndicator still not working properly in nuxt 3.9.1 when using navigateTo()","2024-02-18T14:36:09Z","https://github.com/nuxt/nuxt/issues/25081",0.59942764,{"description":2928,"labels":2929,"number":2932,"owner":2877,"repository":2877,"state":2912,"title":2933,"updated_at":2934,"url":2935,"score":2936},"### Environment\n\n- Operating System: `Darwin`\r\n- Node Version: `v16.15.1`\r\n- Nuxt Version: `3.2.0`\r\n- Nitro Version: `2.2.1`\r\n- Package Manager: `yarn@1.22.4`\r\n- Builder: `vite`\r\n- User Config: `modules`, `app`, `vite`, `i18n`, `build`, `runtimeConfig`, `telemetry`\r\n- Runtime Modules: `@pinia/nuxt@0.4.6`, `@nuxtjs/tailwindcss@6.2.0`, `@nuxtjs/i18n@8.0.0-beta.7`\r\n- Build Modules: `-`\r\n\n\n### Reproduction\n\n- Install the latest nuxt version (3.2.0)\r\n- create at least 2 pages for navigating\r\n- Add **NuxtLoadingIndicator** to your app.vue file like state [here](https://nuxt.com/docs/api/components/nuxt-loading-indicator#nuxtloadingindicator)\r\n\n\n### Describe the bug\n\nWhen adding **nuxtLoadingIndicator** to app.vue it will not show up. This only happens in Nuxt version 3.2.0. In Nuxt version 3.0.0 it works fine. \n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2930,2931],{"name":2906,"color":2907},{"name":2909,"color":2910},18996,"NuxtLoadingIndicator doesn't work in Nuxt 3.2.0","2023-02-14T16:25:01Z","https://github.com/nuxt/nuxt/issues/18996",0.60127836,{"description":2938,"labels":2939,"number":2942,"owner":2877,"repository":2877,"state":2912,"title":2943,"updated_at":2944,"url":2945,"score":2946},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.18.0\r\n- Nuxt Version: 3.9.0\r\n- CLI Version: 3.10.0\r\n- Nitro Version: 2.8.1\r\n- Package Manager: npm@9.4.2\r\n- Builder: -\r\n- User Config: extends\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/nuxt-examples-4fafzz?file=pages%2Findex.vue\r\n\r\nStep to reproduce:\r\n\r\n1. Click on Demo Link (doesnt work)\r\n2. Check console logs (`useLoadingIndicator().start();`is called but not working)\r\n3. Click on Start/Stop and see it's working fine from page.\r\n\r\n### Describe the bug\r\n\r\nI've tried implementing `useLoadingIndicator().start()`but failed because it doesn't work from plugin hooks/pinia store for unknown reason.\r\n\r\nI've provided reproduction which should work, check DevTools logs and click on ?\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2940,2941],{"name":2906,"color":2907},{"name":2909,"color":2910},24900,"useLoadingIndicator doesn't work correctly","2023-12-28T09:45:09Z","https://github.com/nuxt/nuxt/issues/24900",0.6088301,{"description":2948,"labels":2949,"number":2952,"owner":2877,"repository":2877,"state":2912,"title":2953,"updated_at":2954,"url":2955,"score":2956},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Darwin\r\n- Node Version: v21.5.0\r\n- Nuxt Version: 3.11.0\r\n- CLI Version: 3.10.1\r\n- Nitro Version: -\r\n- Package Manager: pnpm@8.15.4\r\n- Builder: -\r\n- User Config: modules, app, css, site, i18n, colorMode, ui, robots, sitemap, linkChecker, runtimeConfig, devServer, devtools\r\n- Runtime Modules: @nuxt/image@1.4.0, @nuxt/ui@2.14.2, @nuxtjs/i18n@8.2.0, @nuxtjs/seo@2.0.0-rc.9, @vueuse/nuxt@10.9.0, @pinia/nuxt@0.5.1, @pinia-plugin-persistedstate/nuxt@1.2.0\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nI tried but I guess nuxt is broken on stackblitz? \r\n\r\nhttps://stackblitz.com/edit/nuxt-starter-uq849c?file=README.md\r\n\r\n### Describe the bug\r\n\r\nBefore nuxt 3.11.0 I was able to use the loading indicator like this\r\n\r\n```ts\r\nconst { start, isLoading, finish } = useLoadingIndicator()\r\nstart()\r\n...\r\nfinish()\r\n```\r\n\r\nNow it gives me a type error if a don't add {} inside the finish func\r\n```ts\r\nconst { start, isLoading, finish } = useLoadingIndicator()\r\nstart()\r\n...\r\nfinish({})\r\n```\r\n\r\n### Additional context\r\n\r\n\r\n\r\nSince force is the only entry inside opts and it's optional, I guess opts should be\r\n```ts\r\nopts?: {\r\n\tforce?: boolean | undefined\r\n}\r\n```\r\n\r\nSorry in advance if I'm saying anything wrong here!\r\n\r\n### Logs\r\n\r\n_No response_",[2950,2951],{"name":2906,"color":2907},{"name":2909,"color":2910},26317,"[3.11.0] useLoadingIndicator finish type error","2024-03-17T19:13:47Z","https://github.com/nuxt/nuxt/issues/26317",0.61449826,{"description":2958,"labels":2959,"number":2962,"owner":2877,"repository":2877,"state":2912,"title":2963,"updated_at":2964,"url":2965,"score":2966},"### Environment\n\nmultiple environments\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-ni6a1j?file=app.vue\n\n### Describe the bug\n\nNot sure if this was deprecated?\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2960,2961],{"name":2906,"color":2907},{"name":2909,"color":2910},23568,"NuxtLoadingIndicator stopped working","2023-12-19T10:18:12Z","https://github.com/nuxt/nuxt/issues/23568",0.62260735,{"description":2968,"labels":2969,"number":2973,"owner":2877,"repository":2877,"state":2912,"title":2974,"updated_at":2975,"url":2976,"score":2977},"### Environment\n\n- Operating System: `Darwin`\r\n- Node Version: `v18.16.0`\r\n- Nuxt Version: `3.7.1`\r\n- CLI Version: `3.7.3`\r\n- Nitro Version: `2.6.2`\r\n- Package Manager: `yarn@1.22.19`\r\n- Builder: `-`\r\n- User Config: `devtools`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-cei3lp?file=app.vue\n\n### Describe the bug\n\nNuxtLoadingIndicator does not working for dynamic pages (loaded via `[...slugs].vue`). It works only for staticly added pages. I suppose that the last working version of nuxt is `3.5.0`, I tried with versions:\r\n- 3.6.0\r\n- 3.6.5\r\n- 3.7.0\r\n- 3.7.1 (latest)\r\n\r\n**Preview:**\r\nhttps://github.com/nuxt/nuxt/assets/33403174/bc8cf61b-5923-4f77-a183-4c80138f1cef\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2970,2971,2972],{"name":2906,"color":2907},{"name":2871,"color":2872},{"name":2874,"color":2875},23042,"NuxtLoadingIndicator does not working for dynamic pages","2024-01-16T10:45:23Z","https://github.com/nuxt/nuxt/issues/23042",0.6283055,{"description":2979,"labels":2980,"number":2982,"owner":2877,"repository":2877,"state":2912,"title":2983,"updated_at":2984,"url":2985,"score":2986},"### Environment\n\n- Operating System: Linux\n- Node Version: v20.19.1\n- Nuxt Version: 3.17.3\n- CLI Version: 3.25.1\n- Nitro Version: 2.11.12\n- Package Manager: npm@10.8.2\n- Builder: -\n- User Config: compatibilityDate, devtools\n- Runtime Modules: -\n- Build Modules: -\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-shxr5zha\n\n### Describe the bug\n\nCan't trigger NuxtLoadingIndicator on query change. I know that useAsyncData doesn't trigger indicator on query change (unfortunately :c). Tried to use:\n\n`useNuxtApp().callHook('page:loading:start')` + `useNuxtApp().callHook('page:loading:end')`\nand\n`useLoadingIndicator().start()` + `useLoadingIndicator().finish()`\n\nIs it a bug or am I doing smth wrong?\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2981],{"name":2909,"color":2910},32132,"Can't trigger NuxtLoadingIndicator","2025-05-17T15:47:30Z","https://github.com/nuxt/nuxt/issues/32132",0.6325271,["Reactive",2988],{},["Set"],["ShallowReactive",2991],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fnOLy7iLgi5XuQOcxjXh5WZFOu8YXgvSVBtyXyTraET8":-1},"/nuxt/nuxt/18630"]