Merge 83a6a12e1b into edc299a043

test/basic.test.ts

@@ -2619,6 +2619,70 @@ describe.skipIf(isWindows)('useAsyncData', () => {
   })
 })
 
+describe('useAsyncData regression with immediate:false', () => {
+  it('shared data, pending', async () => {
+    const page = await createPage('/useAsyncData/shared')
+    await page.waitForLoadState('networkidle')
+    await page.waitForFunction(
+      () => window.useNuxtApp?.()._route.fullPath === '/useAsyncData/shared'
+    )
+
+    expect(await page.locator('#pageWithSharedAsyncData__data').innerText()).toContain('default data')
+    expect(await page.locator('#pageWithSharedAsyncData__pending').innerText()).toContain('true')
+
+    expect(await page.locator('#componentWithSharedUseAsyncData__data').innerText()).toContain(
+      'default data'
+    )
+    expect(await page.locator('#componentWithSharedUseAsyncData__pending').innerText()).toContain(
+      'true'
+    )
+
+    await page.click('#pageWithSharedAsyncData__execute')
+
+    expect(await page.locator('#pageWithSharedAsyncData__data').innerText()).toContain('some data')
+    expect(await page.locator('#pageWithSharedAsyncData__pending').innerText()).toContain('false')
+
+    expect(await page.locator('#componentWithSharedUseAsyncData__data').innerText()).toContain(
+      'some data'
+    )
+    expect(await page.locator('#componentWithSharedUseAsyncData__pending').innerText()).toContain(
+      'false'
+    )
+  })
+
+  it('watch', async () => {
+    const page = await createPage('/useAsyncData/shared')
+    await page.waitForLoadState('networkidle')
+    await page.waitForFunction(
+      () => window.useNuxtApp?.()._route.fullPath === '/useAsyncData/shared'
+    )
+
+    expect(await page.locator('#pageWithSharedAsyncData__data').innerText()).toContain('default data')
+    expect(await page.locator('#pageWithSharedAsyncData__pending').innerText()).toContain('true')
+
+    expect(await page.locator('#componentWithSharedUseAsyncData__data').innerText()).toContain(
+      'default data'
+    )
+    expect(await page.locator('#componentWithSharedUseAsyncData__pending').innerText()).toContain(
+      'true'
+    )
+
+    await page.click('#pageWithSharedAsyncData__changeQuery')
+
+    expect(await page.locator('#pageWithSharedAsyncData__data').innerText()).toContain('some data')
+    expect(await page.locator('#pageWithSharedAsyncData__pending').innerText()).toContain('false')
+
+    expect(await page.locator('#componentWithSharedUseAsyncData__data').innerText()).toContain(
+      'some data'
+    )
+    expect(await page.locator('#componentWithSharedUseAsyncData__pending').innerText()).toContain(
+      'false'
+    )
+
+    await page.close()
+  })
+})
+
 describe.runIf(isDev())('component testing', () => {
   it('should work', async () => {
     const comp1 = await $fetchComponent('components/Counter.vue', { multiplier: 2 })

test/fixtures/basic/components/ComponentWithSharedUseAsyncData.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import { useSharedAsyncData } from '../composables/asyncDataTests'
+const { data, pending } = await useSharedAsyncData()
+</script>
+
+<template>
+  <div>
+    <div id="componentWithSharedUseAsyncData__data">
+      {{ data }}
+    </div>
+    <div id="componentWithSharedUseAsyncData__pending">
+      {{ pending }}
+    </div>
+  </div>
+</template>

test/fixtures/basic/composables/asyncDataTests.ts

@@ -5,3 +5,23 @@ export const useSleep = () => useAsyncData('sleep', async () => {
 })
 
 export const useCounter = () => useFetch('/api/useAsyncData/count')
+
+export const useSharedAsyncData = async () => {
+  const route = useRoute()
+
+  const { data, execute, pending } = await useAsyncData(
+    'sharedAsyncData',
+    () => Promise.resolve('some data'),
+    {
+      default: () => 'default data',
+      immediate: false,
+      watch: [() => route.query]
+    }
+  )
+
+  return {
+    data,
+    execute,
+    pending
+  }
+}

test/fixtures/basic/pages/useAsyncData/shared.vue

@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import { useSharedAsyncData } from '../../composables/asyncDataTests'
+import ComponentWithSharedUseAsyncData from '../../components/ComponentWithSharedUseAsyncData.vue'
+
+const { data, pending, execute } = await useSharedAsyncData()
+const router = useRouter()
+
+const page = ref(1)
+const changeQuery = () => {
+  page.value += 1
+  router.push({
+    query: {
+      page: page.value
+    }
+  })
+}
+</script>
+
+<template>
+  <div>
+    <div
+      id="pageWithSharedAsyncData__execute"
+      @click="() => execute()"
+    >
+      execute
+    </div>
+    <div
+      id="pageWithSharedAsyncData__changeQuery"
+      @click="changeQuery"
+    >
+      changeQuery
+    </div>
+
+    <div id="pageWithSharedAsyncData__data">
+      {{ data }}
+    </div>
+    <div id="pageWithSharedAsyncData__pending">
+      {{ pending }}
+    </div>
+
+    <ComponentWithSharedUseAsyncData />
+  </div>
+</template>