mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-25 23:22:02 +00:00
Merge 83a6a12e1b
into f94d3f2bc6
This commit is contained in:
commit
e93bce7c92
@ -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 })
|
||||
|
15
test/fixtures/basic/components/ComponentWithSharedUseAsyncData.vue
vendored
Normal file
15
test/fixtures/basic/components/ComponentWithSharedUseAsyncData.vue
vendored
Normal file
@ -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>
|
@ -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
|
||||
}
|
||||
}
|
||||
|
43
test/fixtures/basic/pages/useAsyncData/shared.vue
vendored
Normal file
43
test/fixtures/basic/pages/useAsyncData/shared.vue
vendored
Normal file
@ -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>
|
Loading…
Reference in New Issue
Block a user