Vue-cli 仅使用mocha进行单元测试

vue-cli+mocha单元测试

什么是mocha

我的理解就是，mocha是一个测试框架，它提供给你很多断言接口，你可以使用它的接口写一些测试文件，来看看输出是否符合预期。

mocha有一些很有用的辅助函数库

比如util.js，vue/test.js这些网上教程很多了，我也不是很懂，就不多说了

写测试文件需要操作DOM

在.vue单文件的测试中，比较多的是以下几种情况（根据我自身的经验，我经验很少）

1. 是否正确渲染，vue实例，例如下面的vue组件的msg是否成功被渲染到html

<template>
    <div id = "footer">
        <span>{
  {msg}}</span>
    </div>
</template>
<script>
export default {
    
	data() {
    
		return {
    
			msg:"Hello,world"
		}
	}
}
</script>

mocha库提供了接口，expect().xxxxxx.equal()
，这里，xxxxx是类似自然语言，为了提高程序可读性的，常见的有，have，to，be等等，具体可以去mocha官网文档查看
这种情况很简单，可以向下面的代码这样来写

describe('render message test', () => {
   
  it('should render correct msg', () => {
   
    let Constructor = Vue.extend(HelloWorld)
    const vm = new Constructor()
    //创建vue实例后,msg 应该为HEllo,world
    expect(vm.msg)