首页  >  问答  >  正文

文本字段更新在 Vue 测试实用程序中不起作用(开玩笑)

嗨,我是玩笑和单元测试的新手。我想问如何使用 vue test utils 设置值文本输入。

很快我就有了用于文本输入的自定义组件,这是我的代码

<input
    v-model="local_value"
    @keyup.enter="submitToParent"
    :class="input_class"
    :id="id"
    :disabled="is_disabled"
    :maxlength="max_length"
    :placeholder="placeholder"
    :autocomplete="(is_autocomplete) ? 'on' : 'off'"
    :name="id"
    :ref="id"
  />

这是我的测试

it("type something on field", async () => {
        const wrapper = shallowMount(TextInput, {
            propsData: {
                id: "my_input",
            }
        })

        // find component (its work properly) and I want to try inserting some text
        const input = wrapper.findComponent({ref: "my_input"})
        input.element.value = "sample text"
        input.setValue("sample text")

        // the value still empty string (""), idk what happens with my code
        console.log(wrapper.vm.local_value)
        expect(wrapper.vm.local_value).toBe("sample text")

请告诉我您是否知道此问题的解决方案,谢谢您的宝贵时间

P粉604669414P粉604669414178 天前313

全部回复(1)我来回复

  • P粉476883986

    P粉4768839862024-03-27 00:39:21

    据我所知, setValue 是异步的,所以你可能需要设置它 await input.setValue('示例文本')

    回复
    0
  • 取消回复