【just】ユニットテストツールエッセイ

公式文書のアドレス
まず公式文書の住所を添付します.https://jestjs.io/docs/zh-Hans/getting-started.html
 
概要
JestはFacebookのJavascriptユニットのテストを専門に行うツールであり、これらのアプリケーションはもちろんReactアプリケーションも含まれています.その利点の一つは、Reactに対する支持を持つことであり、他のフレームも支持しやすいということです.
 
インストール
npm i just-D(ローカルに装着)npm i just-g(グローバルにインストール)
 
基本配置の解読

package.jsonはpackage.jsonに配置項目「jst」を追加します.

// package.json for example
...
  "jest": {
    "transform": {
      ".(ts|tsx)": "ts-jest"
    },
    "testEnvironment": "node",
    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
    "moduleFileExtensions": [
      "ts",
      "tsx",
      "js"
    ],
    "coveragePathIgnorePatterns": [
      "/node_modules/",
      "/test/"
    ],
    "coverageThreshold": {
      "global": {
        "branches": 90,
        "functions": 95,
        "lines": 95,
        "statements": 95
      }
    },
    "collectCoverageFrom": [
      "src/*.{js,ts}"
    ]
  },
...

次に、これらの構成項目の役割を簡単に説明します.

transform

簡単に言えば、ここに書いたような変換器の構成です.

    "transform": {
      ".(ts|tsx)": "ts-jest"
    },

ts-jstツールで.tsと.tsxファイルの内容をjsに変換します.今はほとんどtsでテストコードを作成していますので、変換器を配置します.

testEnvironment

テスト環境

    "testEnvironment": "node",

これはクラスのブラウザのテスト環境です.ブラウザ環境のいくつかのAPIを使ってもいいです.

testRegex

テストするファイルの正規表現

    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",

testディレクトリの下にあるすべてのファイルを表示します.test.tsと.spec.tsのファイルはテストを走ります.

moduleFileExtensions

モジュールファイルの拡張子は、モジュールを導入して拡張子を指定していない場合、これらの拡張子を順次追加してモジュールファイルを導入しようとします.

    "moduleFileExtensions": [
      "ts",
      "tsx",
      "js"
    ],

優先的に検索することを表す.tsのモジュールで、次は.tsxと.jsです.

coverage Thresold

カバー率の閾値設定をテストします.テストの上書き率が閾値に達しない場合、テストは失敗します.

    "coverageThreshold": {
      "global": {
        "branches": 90,
        "functions": 95,
        "lines": 95,
        "statements": 95
      }
    },

全体を表すコード分岐カバー率は90%以上に達し、方法のカバー率は95%に達し、コードライン数のカバー率は95%に達し、ステートメント文は95%に達する.

collect Coverage From

指定されたファイルのテスト上書き率を収集します.(これらのファイルのためにテストを作成していなくても、その値はglob patternsタイプです.)

    "collectCoverageFrom": [
      "src/*.{js,ts}"
    ]

Srcディレクトリを収集し、すべてのグループディレクトリのjsとtsファイルのテスト上書き率を表します.

setupFileAfterEnd

テストフレームのインストール直後に実行されるコードファイルのリスト

    "setupFileAfterEnv": [
        "/test/boot.ts"
    ]

具体的なテストコードを走るたびに、先にテストコードを実行します.
現在のプロジェクトのルートディレクトリを表します.
その他の設定は公式文書で確認できます.

ject.co nfig.js

jst.co nfig.jsを新規作成し、設定項目module.export={配置項目}を追加します.
 
実行

npx just(ローカルにインストールされた前提で)

just(大域に設置された前提で)「script」の「test」を「just」に変更した後、npm run test

を使用する.
 
基本文法

パケット(Test Group):descripe(記述語、function)

試験用例(Test Case):test(記述語、function)

.expect.toBe(予想結果)

// for example
Pencil.query =(name, url)=> {  //  ，    
    // ?hello=test&wonghan=handsome
    var reg = new RegExp('(?:\\?|&)' + name + '=(.*?)(?:&|$)')
    var ret = reg.exec(url) || []
    return ret[1]
}
test('query',()=>{  // testCase
    //   
    expect(Pencil.query('hello', '?hello=test')).toBe('test')
    expect(Pencil.query('hello', '?hello2=test')).toBe(undefined)  
    //     `ecpect()`
})
test('query2',()=>{
    expect(Pencil.query('hello/test', '?hello/test=test')).toBe('test')
}) 
    //     `test()`
describe('test query',()=>{
    test('query3',()=>{  // testCase
        // assert
        expect(Pencil.query('hello', '?hello=test')).toBe('test')
        expect(Pencil.query('hello', '?hello2=test')).toBe(undefined)
    })
})

 
Jest Match
Matchersは通称ライブラリと言います.例えば上のexpect().toBe()はその中の一つです.その他の一般的な使い方は以下の通りです.
1.等しく断言する
toBe(value):数字、文字列toEqual(value)を比較する:比較対象、配列toBeNull()toBendefined()
2.断言を含む
toHaveProperty(keyPath,value):対応する属性toContantainがありますか?対応する値が含まれていますか?括弧には配列、文字列toMatch(regexpOrString)を書きます.括弧には正則を書きます.
3.論理的に言い切る
toBeTruthy()toBeFalsy()は、JavaScriptの6つのfalsy値:false、0、'、null、undefined、NaNがあります.他は全部Truthyです.
toBeGreaterThan(number):toBeLessThan(number):以下
4.not
逆をとって、用法は次の例を見ます.

// for example
test('matchers',()=>{
    const a = {
        hello: 'jest',
        hi :{
            name: 'jest'
        }
    }
const b = {
    hello: 'jest',
    hi:{
        name: 'jest'
    }
}
//       true
expect(a).toEqual(b)
expect([1,2,3]).toEqual([1,2,3])
expect(null).toBeNull()
expect([1,2,3]).toContain(1)
expect(b).toHaveProperty('hi')
expect('123').toContain('2')
expect('123').toMatch(/^\d+$/)
expect('123').not.toContain('4')
})

 
よく踏んだり穴を踏んだりします
1.Uexpected token import
Jestはデフォルトではあなたの使っているnode.jsバージョンだけがサポートしているJS特性をサポートしています.例えばimport exportはサポートしていません.ですから、あなたのコードはシステムnode.js互換の文法を使って書いてもいいです.
解決策
JestでBabelを使うのは簡単です.babel-jstをインストールして新しいものを作るだけです.Babelrcはあなたの欲しい配置に参加すればいいです.Jestは自動的にbabel-jestを使います.ここではBabel-prester-envを簡単に使って対応します.Babelrcは:

{
  "presets": ["env"]
}

ほとんどの場合、あなたのプロジェクト自体はすでに使われています.バーベルはもう省略されました.
転載先:https://www.cnblogs.com/fe-linjin/p/11519606.html