如何给Vue3组件库加单元测试

Vue DevUI的单元测试环境是基于Jest和Vue Test Utils的,所以它的步骤如下:

  • 首先,安装jest
# 使用yarn安装
yarn add --dev jest
# 或使用 npm
npm install --save-dev jest
  • 然后, package.json中增加脚本命令
{
  "scripts": {
    "test": "jest"
  }
}
  • 编写单元测试,步骤:测试套单元测试测试断言
// Step 1: 定义一个测试套 Test Suite
describe('tree', () => {
  // Step 2: 定义一个单元测试 Test
  it('tree should render correctly', () => {
    // Step 3: 期望(expect)tree组件的class里面包含(toContain)'devui-tree'
    expect(wrapper.classes()).toContain('devui-tree')
    // 同时期望(expect)tree组件的子元素数量为(toBe)6
    expect(wrapper.element.childElementCount).toBe(6)
  })
})
  • 执行 test 命令
yarn test
or
npm run test

注意:以上步骤可能还会有问题,需要对应安装所缺插件

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容