Vue jest算法测试

Question

我有一个看起来像这样的组件。我该如何编写一个vue-jest测试来满足这些条件？

<template>
<div align="center">
<button @click="Tests()">Tests</button>
<button @click="Benchmark()">Benchmark</button>
</div>
</template>
<script>
export default {
name: "HelloWorld",
data() {
return {
result: null,
};
},
props: {
msg: String,
},
};
</script>

Answer 1

使用@vue/test-utils，您可以shallowMount组件以获得包装器，然后通过包装器的vm属性访问smallestInt()和result：

// MyComponent.spec.js
import MyComponent from '@/components/MyComponent.vue'
import { shallowMount } from '@vue/test-utils'
describe('MyComponent.smallestInt()', () => {
it('case 1', () => {
const wrapper = shallowMount(MyComponent)
const A = [1, 3, 6, 4, 1, 2]
wrapper.vm.smallestInt(A)
expect(wrapper.vm.result).toBe(5)
})
it('case 2', () => {
const wrapper = shallowMount(MyComponent)
const A = [-1, -3]
wrapper.vm.smallestInt(A)
expect(wrapper.vm.result).toBe(1)
})
})