51Testing软件测试论坛

标题: jest 如何从0-1搭建单元测试? [打印本页]
作者: lsekfe    时间: 2022-9-29 14:09
标题: jest 如何从0-1搭建单元测试?
安装依赖
  1. <font size="3">cnpm install ts-jest jest  @types/jest --save-dev</font>
复制代码
配置
　　1、修改package.jsoin，在"scipts"添加"test": "jest", 如下：

  1. <font size="3">"scripts": {

  3. 　　    "start": "webpack-dev-server",

  5. 　　    "build": "webpack --mode production",

  7. 　　    "test": "jest"

  9. 　　}</font>
复制代码
2、添加一个jest.config.js文件
　　填入如下内容：

  1. <font size="3">module.exports = {

  3. 　　    "moduleFileExtensions": [

  5. 　　        "js",

  7. 　　        "ts",

  9. 　　        "tsx"

  11. 　　    ],

  13. 　　    "transform": {

  15. 　　        "^.+\\.tsx?[        DISCUZ_CODE_2        ]quot;: "ts-jest",

  17. 　　    },

  19. 　　    "testMatch": [

  21. 　　        "<rootDir>/tests/**/*.ts?(x)"

  23. 　　    ]

  25. 　　}</font>
复制代码
通过testMatch可以看到我们是检测 工程/tests/ 文件下的内容。一般是推荐在文件下面写测试文件，但是我比较喜欢在外面写。然后添加一个测试文件。
　　添加测试文件

[attach]143471[/attach]
这是我的目录，可以参考。
　　编写测试
　　参考下QAQ  具体看官方文档 jestjs.io/docs/zh-Han…

  1. <font size="3">import { getSTyleStr, id } from '../../src/utils/utils'

  3. 　　test('id', () => {

  5. 　　    expect(id(1)).toBe(1)

  7. 　　    expect(id(null)).toBe(null)

  9. 　　    expect(id(void 0)).toBe(void 0)

  11. 　　})

  13. 　　describe('css class utils getSTyleStr', () => {

  15. 　　    it('带大写的属性', () => {

  17. 　　        expect(getSTyleStr({backgroundColor: "rgba(216,52,52,1)"}))

  19. 　　        .toBe('background-color: rgba(216,52,52,1);')

  21. 　　    })

  23. 　　    it('单个属性', () => {

  25. 　　        expect(getSTyleStr({width: "30px", height: "30px"}))

  27. 　　        .toBe('width: 30px;height: 30px;')

  29. 　　    })

  31. 　　})</font>
复制代码
查看效果
  1. <font size="3">npm run test</font>
复制代码
[attach]143473[/attach]
如果我们写错了，这时候：
[attach]143474[/attach]





欢迎光临 51Testing软件测试论坛 (http://bbs.51testing.com/) Powered by Discuz! X3.2