Jest simple unit test unit built from scratch test

js, ts phase unit cells tested by using jest

Many tutorials, but I might this be more user-friendly, close-up, do not spray.

Installation depends

cnpm install ts-jest jest  @types/jest --save-dev

Configuration

1: Modify package.jsoin, in "scipts" Add "test": "jest", as follows

"scripts": {
    "start": "webpack-dev-server",
    "build": "webpack --mode production",
    "test": "jest"
},

2: Add a jest.config.jsfile

Fill the following

module.exports = {
    "moduleFileExtensions": [
        "js",
        "ts",
        "tsx"
    ],
    "transform": {
        "^.+\\.tsx?$": "ts-jest",
    },
    "testMatch": [
        "<rootDir>/tests/**/*.ts?(x)"
    ]
}

We can see by testMatch content under testing project / tests / file

It is generally recommended to write files in the following test, but I prefer to write on the outside.

Then add a test file

Adding test files

This is my directory, you can refer to

Writing tests

Refer to the QAQ specifically to see the official documentation https://jestjs.io/docs/zh-Hans/getting-started

import { getSTyleStr, id } from '../../src/utils/utils'

test('id', () => {
    expect(id(1)).toBe(1)
    expect(id(null)).toBe(null)
    expect(id(void 0)).toBe(void 0)
})
describe('css class utils getSTyleStr', () => {
    it('带大写的属性', () => {
        expect(getSTyleStr({backgroundColor: "rgba(216,52,52,1)"}))
        .toBe('background-color: rgba(216,52,52,1);')
    })
    it('单个属性', () => {
        expect(getSTyleStr({width: "30px", height: "30px"}))
        .toBe('width: 30px;height: 30px;')
    })
})

run

npm run test

Perfect through

That is if we are wrong, as follows

View Source: https://github.com/0123cf/layout-ui

Related Links:

https://jestjs.io/docs/zh-Hans/getting-started
https://github.com/0123cf/layout-ui

--END--

Reproduced in: https: //www.jianshu.com/p/a2cfb462f583