'v:0-0 v:0-1 ' + // inside first async subtree
'v:1-0 v:1-1' // inside second async subtree
// assert different async resolution order does not affect id stable-ness
- expect(await getOutput(() => factory(10, 20))).toBe(expected)
- expect(await getOutput(() => factory(20, 10))).toBe(expected)
+ expect(await getOutput(() => factory(0, 16))).toBe(expected)
+ expect(await getOutput(() => factory(16, 0))).toBe(expected)
})
test('serverPrefetch', async () => {
'v:0-0 v:0-1 ' + // inside first async subtree
'v:1-0 v:1-1' // inside second async subtree
// assert different async resolution order does not affect id stable-ness
- expect(await getOutput(() => factory(10, 20))).toBe(expected)
- expect(await getOutput(() => factory(20, 10))).toBe(expected)
+ expect(await getOutput(() => factory(0, 16))).toBe(expected)
+ expect(await getOutput(() => factory(16, 0))).toBe(expected)
})
test('async setup()', async () => {
'v:1-0 v:1-1' + // inside second async subtree
'</div>'
// assert different async resolution order does not affect id stable-ness
- expect(await getOutput(() => factory(10, 20))).toBe(expected)
- expect(await getOutput(() => factory(20, 10))).toBe(expected)
+ expect(await getOutput(() => factory(0, 16))).toBe(expected)
+ expect(await getOutput(() => factory(16, 0))).toBe(expected)
})
test('deep nested', async () => {
expect(await getOutput(() => factory())).toBe(expected)
expect(await getOutput(() => factory())).toBe(expected)
})
+
+ test('async component inside async setup', async () => {
+ const factory = (
+ delay1: number,
+ delay2: number,
+ ): ReturnType<TestCaseFactory> => {
+ const p1 = promiseWithDelay(null, delay1)
+ const p2 = promiseWithDelay(BasicComponentWithUseId, delay2)
+ const AsyncInner = defineAsyncComponent(() => p2)
+
+ const AsyncSetup = defineComponent({
+ async setup() {
+ await p1
+ return {}
+ },
+ render() {
+ return h(AsyncInner)
+ },
+ })
+
+ const app = createApp({
+ setup() {
+ const id1 = useId()
+ const id2 = useId()
+ return () =>
+ h(Suspense, null, {
+ default: h('div', [id1, ' ', id2, ' ', h(AsyncSetup)]),
+ })
+ },
+ })
+ return [app, [p1, p2]]
+ }
+
+ const expected =
+ '<div>' +
+ 'v:0 v:1 ' + // root
+ 'v:0-0-0 v:0-0-1' + // async component inside async setup
+ '</div>'
+ // assert different async resolution order does not affect id stable-ness
+ expect(await getOutput(() => factory(0, 16))).toBe(expected)
+ expect(await getOutput(() => factory(16, 0))).toBe(expected)
+ })
})