Bug: "ReferenceError: Cannot access 'wrapper' before initialization" when testing v-model

[souserge]

Describe the bug

I'm trying to test v-model in a component that updates its model value in the setup function. I followed the suggestion from the official docs:
https://test-utils.vuejs.org/guide/advanced/v-model.html

However, since the update event callback relies on the wrapper object being defined, yet, since setup is run when mounting, the callback doesn't yet have wrapper initialized when it's run.

P.S. I'm not using the default parameter of defineModel in order to avoid the issue described here:
https://vuejs.org/api/sfc-script-setup.html#definemodel

Reproduction

https://stackblitz.com/edit/github-7j6ahrt8?file=src%2Fcomponents%2F__tests__%2FHelloWorld.spec.ts

Expected behavior

Such component behaviour can be tested.

Environment

OS: Linux 6.12 cpe:/o:nixos:nixos:25.05 25.05 (Warbler)
CPU: (8) x64 Intel(R) Core(TM) i5-8250U CPU @ 1.60GHz
Memory: 1.14 GB / 7.51 GB
Container: Yes
Shell: 5.2.37 - /run/current-system/sw/bin/bash

Additional context

No response

[cexbrayat]

Hi @souserge

Yes this docs looks incorrect.

You can probably do something like this:

it('Updates the model with default value if not set', async () => {
    // https://test-utils.vuejs.org/guide/advanced/v-model.html
    const wrapper = mount(HelloWorld, {
      props: {
        msg: 'Hello',
        // Fails here due to model update in the component's setup function
        'onUpdate:modelValue': async (e) => {
          await nextTick();
          await wrapper.setProps({ modelValue: e });
        },
      },
    });

    expect(wrapper.text()).toContain('Hello, World!');
    await nextTick();
    expect(wrapper.props('modelValue')).toStrictEqual('Hello, World!');
  });

If that works, could you open a PR to update the docs? That would be greatly appreciated

[souserge]

Hi @cexbrayat , yeah that worked, thank you! I'll open a PR soon and then close this issue.

[cexbrayat]

This has been fixed by #2695