gpt4 book ai didi

vue.js - 如何用 jest 在单元测试中测试 bootstrap vue 组件的存在?

转载 作者:行者123 更新时间:2023-12-03 06:44:13 28 4
gpt4 key购买 nike

所以我有一些代码有一个 b-form-input 组件,我正在测试该组件是否呈现。我正在使用 wrapper.find({name: "b-form-input"}).exists() 来确定该 Bootstrap vue 组件是否存在。但是,当我知道组件正在渲染时,此函数会不断返回 false。我可以就如何正确执行此操作提供一些帮助吗?

最佳答案

查看 bootstrap-vue 源代码,看起来元素的名称是 BFormInput 而不是 b-form-input (它是使用 kebab-case 注册的):

https://github.com/bootstrap-vue/bootstrap-vue/blob/2fb5ce823a577fcc2414d78bd43ed9e5351cb1c0/src/components/form-input/form-input.js#L33

...
export const BFormInput = /*#__PURE__*/ Vue.extend({
name: 'BFormInput',
...

您有两种选择来定位组件;使用名称或组件构造函数。例如:

import BootstrapVue, { BFormInput } from 'bootstrap-vue';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import HelloWorld from '@/components/HelloWorld.vue';

const localVue = createLocalVue();
localVue.use(BootstrapVue);

describe('HelloWorld.vue', () => {
it('BFormInput exists', () => {
const wrapper = shallowMount(HelloWorld, { localVue })
expect(wrapper.find({ name: 'BFormInput' }).exists()).toBe(true);
expect(wrapper.find(BFormInput).exists()).toBe(true);
});
});

关于vue.js - 如何用 jest 在单元测试中测试 bootstrap vue 组件的存在?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56998626/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com