單元測(cè)試是什么
單元測(cè)試是一種軟件測(cè)試抑进，其測(cè)試軟件的各個(gè)單元或組件茬末。目的是驗(yàn)證軟件代碼每個(gè)單元是否按照預(yù)期執(zhí)行候址。單元測(cè)試由開(kāi)發(fā)人員在應(yīng)用程序的開(kāi)發(fā)（編碼階段）中完成变姨。單元測(cè)試隔離一段代碼并驗(yàn)證其正確性族扰。一個(gè)單元可能是單個(gè)功能，方法定欧，過(guò)程渔呵，模塊或?qū)ο?/strong>。
為什么做單元測(cè)試
在開(kāi)發(fā)階段砍鸠，單元測(cè)試可以幫助更早發(fā)現(xiàn)并修復(fù)BUG扩氢，并節(jié)省成本
它有助于開(kāi)發(fā)人員了解代碼庫(kù)，并使他們能夠快速做出修改
好的單元測(cè)試相當(dāng)于項(xiàng)目文檔
單元測(cè)試有助于代碼重用爷辱，將我們的代碼和測(cè)試都遷移到新項(xiàng)目录豺。調(diào)整代碼，直到測(cè)試再次運(yùn)行饭弓。
單元測(cè)試的好處
- 通過(guò)單元測(cè)試双饥，開(kāi)發(fā)者可以了解到提供了什么功能，對(duì)單元測(cè)試
API有基本了解 - 單元測(cè)試允許程序員在以后重構(gòu)代碼弟断，并確保模塊仍然正常工作（即回歸測(cè)試）咏花。該過(guò)程是針對(duì)所有功能和方法編寫(xiě)測(cè)試用例，以便每當(dāng)更改導(dǎo)致故障時(shí)阀趴，都可以快速識(shí)別并修復(fù)該故障昏翰。
- 由于單元測(cè)試的模塊化性質(zhì)，我們可以測(cè)試項(xiàng)目的各個(gè)部分舍咖，而無(wú)需等待其他部分完成矩父。
單元測(cè)試的壞處
- 單元測(cè)試不能夠捕獲程序中每個(gè)錯(cuò)誤锉桑。即使在最簡(jiǎn)單的程序中排霉，也不可能評(píng)估每種單元測(cè)試執(zhí)行的路徑。
- 單元測(cè)試的本質(zhì)是將重點(diǎn)放在代碼的單元上民轴。因此攻柠，它不能捕獲集成測(cè)試的錯(cuò)誤和更廣泛的系統(tǒng)層面的錯(cuò)誤。
推薦：?jiǎn)卧獪y(cè)試和其他測(cè)試手段一起使用
VUE項(xiàng)目中使用單元測(cè)試
我們使用Vue-Test-Utils這個(gè)Vue.js官方的單元測(cè)試實(shí)用工具庫(kù)后裸，來(lái)編寫(xiě)VUE應(yīng)用中的單元測(cè)試瑰钮。
安裝
這里，我們默認(rèn)已經(jīng)通過(guò)VUE的腳手架生成了項(xiàng)目微驶，那么我們集成unit-jest插件就可以了浪谴。
vue add @vue/unit-jest
編寫(xiě)簡(jiǎn)單測(cè)試用例
單元測(cè)試的文件：
// tests/unit/example.spec.js
import { shallowMount } from '@vue/test-utils'
import HelloWorld from '@/components/HelloWorld.vue'
describe('HelloWorld.vue', () => {
it('renders props.msg when passed', () => {
const msg = 'new message'
const wrapper = shallowMount(HelloWorld, {
propsData: { msg }
})
expect(wrapper.text()).toMatch(msg)
})
})
單元測(cè)試的組件：
<!--scr/components/HellowWorld.vue-->
<template>
<div class="hello-world">msg is :{{msg}}</div>
</template>
<script>
export default {
name: 'hello-world',
data() {
return {}
},
props: {
msg: {
type: String,
default: 'this is props msg'
}
}
}
</script>
此時(shí)开睡，執(zhí)行下面的命令行即可：
yarn run test:unit
或者
npm run test:unit
這個(gè)時(shí)候，你就可以在控制臺(tái)上看到測(cè)試用例正在跑~
