即使使用间谍，vuetify jest 按钮触发器也不起作用

Question

开始学习 vuejs 和 jest 的工作原理。看了一些视频，然后自己开始尝试，但触发点击一直失败。

我的组件中有一个登录按钮，这是我在组件中唯一的 v-btn

      <v-card-actions>
        <v-btn
            block
            :disabled="!valid"
            color="info"
            class="mr-4"
            @click.native="on_login"
        >
          Login
        </v-btn>
      </v-card-actions>

在我的 login.spec.js 中

import { mount, shallowMount } from '@vue/test-utils';
import Login from "@/views/Login";
import { createLocalVue } from '@vue/test-utils'
import Vuetify from "vuetify";
const localVue = createLocalVue()
localVue.use(Vuetify);


describe('Login.vue', () => {
    it('contain login', () => {
        const wrapper = mount(Login);
        expect(wrapper.html()).toContain('login');
    });

    it('login event', async () => {
        const wrapper = mount(Login, {
            localVue
        });

        const spy_on_login = jest.spyOn(wrapper.vm, 'on_login');

        const button = wrapper.find('.v-btn');

        expect(button.exists()).toBeTruthy();

        await button.trigger('click');  // also tried click.native
        // I even tried using wrapper.vm.nexttick, vue.nexttick but  none worked
        expect(spy_on_login).toHaveBeenCalled();
    });
});

我没有添加 localVue 和 Vuetify 开始，因为 Vuetify 实际上是在 test/unit/setup.js

作为新手，我不确定从哪里开始调试触发器无法正常工作的原因，因为按钮确实存在

提前感谢您的任何建议，在我阅读了一些stackoverflow并尝试了他们的方法但没有奏效时提供建议:(

Answer 1

来自vue-test-utils 文档：

trigger 仅适用于原生 DOM 事件。要发出自定义事件，请使用 `wrapper.vm.$emit('myCustomEvent')``

来源：wrapper#trigger

因为v-btn是自定义组件，可能不是原生按钮元素，你应该试试button.vm.$emit('click')。