fix(runtime): implement setProps

resolves #534
nuxt · Dec 18, 2023 · 522f8bf · 522f8bf
1 parent 8d79927
commit 522f8bf
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 8 deletions.
diff --git a/examples/app-vitest-full/components/ExportDefaultReturnsRenderComponent.vue b/examples/app-vitest-full/components/ExportDefaultReturnsRenderComponent.vue
@@ -7,10 +7,11 @@ export default {
     }
   },
   setup(props) {
+    const pre = 'X' + props.myProp
     return () => h('div', [
       h('h1', 'ExportDefaultReturnsRenderComponent'),
       h('pre', props.myProp),
-      h('pre', 'X' + props.myProp)
+      h('pre', pre)
     ])
   },
 }

diff --git a/examples/app-vitest-full/tests/nuxt/mount-suspended.spec.ts b/examples/app-vitest-full/tests/nuxt/mount-suspended.spec.ts
@@ -138,12 +138,10 @@ describe.each(Object.entries(formats))(`%s`, (name, component) => {
     `.trim())
   })
 
-  // FIXME: https://github.com/nuxt/test-utils/issues/534
-  it.todo('can be updated with setProps', async () => {
-    wrapper.setProps({
-      title: 'updated title'
+  it.only('can be updated with setProps', async () => {
+    await wrapper.setProps({
+       myProp: 'updated title'
     })
-    await nextTick()
     expect(wrapper.html()).toEqual(`
 <div>
   <h1>${name}</h1><pre>updated title</pre><pre>XHello nuxt-vitest</pre>

diff --git a/src/runtime-utils/mount.ts b/src/runtime-utils/mount.ts
@@ -59,6 +59,7 @@ export async function mountSuspended<T>(
 
   let setupContext: SetupContext
   let setupState: any
+  const setProps = reactive<Record<string, any>>({})
 
   let passedProps: Record<string, any>
   const wrappedSetup = async (
@@ -89,7 +90,10 @@ export async function mountSuspended<T>(
               {
                 onResolve: () =>
                   nextTick().then(() => {
-                    (vm as any).setupState = setupState
+                    (vm as any).setupState = setupState;
+                    (vm as any).__setProps = (props: Record<string, any>) => {
+                      Object.assign(setProps, props)
+                    }
                     resolve(vm as any)
                   }),
               },
@@ -122,7 +126,7 @@ export async function mountSuspended<T>(
                         setup: setup ? (props: Record<string, any>) => wrappedSetup(props, setupContext) : undefined,
                       }
 
-                      return () => h(clonedComponent, { ...props, ...attrs }, slots)
+                      return () => h(clonedComponent, { ...defu(setProps, props) as typeof props, ...attrs }, slots)
                     },
                   }),
               }