当前位置：网站首页>unit test

unit test

2022-08-09 23:13:00 【51CTO】

单元测试是什么

单元测试是一种软件测试,其测试软件的各个单元或组件.The purpose is to verify that each unit of software code executes as expected.单元测试由开发人员在应用程序的开发（编码阶段）中完成.单元测试隔离一段代码并验证其正确性.A unit may be单个功能,方法,过程,模块或对象.

Why do unit tests

在开发阶段,Unit tests can help find and fix earlierBUG,并节省成本
它有助于开发人员了解代码库,and enable them to make changes quickly
Good unit tests are the equivalent of project documentation
单元测试有助于代码重用,Migrate both our code and tests to the new project.调整代码,直到测试再次运行.

单元测试的好处

通过单元测试,Developers can see what functionality is provided,对单元测试API有基本了解
单元测试允许程序员在以后重构代码,并确保模块仍然正常工作（即回归测试）.该过程是针对所有功能和方法编写测试用例,以便每当更改导致故障时,都可以快速识别并修复该故障.
由于单元测试的模块化性质,我们可以测试项目的各个部分,而无需等待其他部分完成.

The downside of unit testing

Unit tests cannot catch every bug in a program.即使在最简单的程序中,It's also not possible to evaluate each unit test execution path.
The essence of unit testing is to focus on the unit of code.因此,It doesn't catch integration-tested errors and broader system-level errors.

推荐：Unit testing is used in conjunction with other testing techniques

VUEUse unit tests in the project

我们使用 Vue-Test-Utils这个Vue.js官方的单元测试实用工具库,来编写VUEUnit tests in the application.

安装

这里,We have passed by defaultVUEThe scaffolding generated the project,then we integrateunit-jest插件就可以了.

       
       vue add @vue/unit-jest
      
1.

Write simple test cases

单元测试的文件：

       
       // 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)
       
  })
       
})
      
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.

Unit test components：

       
       <!--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>
      
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.

此时,Just execute the following command line：