井上  康弘

井上 康弘

1657265760

如何使用 Jest 設置 TypeScript 應用程序測試環境

如何設置您的測試環境

為您的 typeScript 應用程序設置測試環境有五個步驟,它們在下面突出顯示:

  1. 安裝框架和依賴項:使用以下命令安裝Jest ts-jestts-node作為開發依賴項:
npm i --save dev jest ts-jest ts-node
ts-jest is a dependency that allows you to use jest to test applications written in typeScript while ts-node is a typeScript REPL for node js.

2. 安裝類型定義:按照初始 npm 命令的指示成功安裝框架後,使用以下命令為Jest安裝類型定義:

npm i --save dev @types/jest

3. 配置 jest:在項目的根目錄中創建一個帶有 typeScript 擴展名的jest配置文件(如下圖所示)。

jest.config.ts file in the root of a project.> jest.config.tsimport type { Config } from "@jest/types";export default async (): Promise<Config.InitialOptions> => {
  return {
    preset: "ts-jest",
     displayName: {
     name: "placeNameOfYourAppHere",
     color: "greenBright",
   },
   verbose: true,
   setupFiles: ["dotenv/config"],
   testMatch: ["**/**/*.test.ts"],
   testEnvironment: "node",
   detectOpenHandles: true,
   collectCoverage: true,
   transform: { "^.+\\.tsx?$": "ts-jest" },
   globalTeardown: "<rootDir>/src/tests/jest-globals-teardown.ts",
   forceExit: true,
 };
};

您還可以訪問jest 框架文檔以查看可以實現此目的的其他方法。
請注意,在jest.config.ts文件中,有一個globalTeardown屬性指向/src/tests文件夾中的jest-globals-teardown.ts文件。Jes t global teardown 是在測試套件執行後執行的。這僅僅意味著jest應該在執行測試套件/用例後立即退出。

要創建全局拆卸,請導航到/src 並創建一個/tests文件夾,該文件夾將容納jest-globals-teardown.ts文件(如下所示)。或者,您可以創建/helpers、 /integration_tests/unit_tests文件夾。這些文件夾將分別包含輔助函數、集成測試和單元測試。

jest-globals-teardown.ts file in a test folder.> jest-globals-teardown.tsexport default () => {
 process.exit(0);
};

4. 設置測試npm命令:最後一步是在package.json文件中設置npm測試腳本命令這些放置在package.json文件的“腳本”對像中的命令允許您執行jest框架的測試運行程序。

"scripts": {
  "test": "jest --runInBand",
  "test:watch": "jest --runInBand --watchAll",
}

— runInBand:別名:-i。在當前進程中連續運行所有測試,而不是創建運行測試的子進程的工作池。這對於調試很有用。

5. 配置你的節點環境:將你的節點環境設置為測試,如下所示:

> .env NODE_ENV='test'

要立即運行並退出jest測試運行程序,請使用以下命令:

npm run test

要在不退出測試運行器的情況下運行並繼續跟踪測試的更改,請使用以下命令:

npm run test:watch

你的第一個測試用例

到目前為止,我們已經介紹了設置測試環境的步驟。要創建我們的第一個測試,請導航到/src/tests/unit_tests,然後創建一個test.test.ts文件,其中包含一個簡單的測試用例,如下所示:

test("My first test", () => {
  const res = 1;
  expect(res).toBe(1);
});

然後使用 npm 命令執行測試運行器:

npm run test

在所有條件相同的情況下,jest測試運行器將在報告測試用例運行時間、測試套件數量和測試用例時返回通過,如下所示:

測試運行程序報告測試用例通過。

注意:測試文件名稱之後和 .ts擴展名之前的 .test很重要,例如(nameOfFile.test.ts)。它開玩笑說這是一個測試文件,你應該這樣運行它。在不表示這是一個測試文件(帶有 .test)的情況下, jest runner 將返回錯誤;“未找到測試,以代碼 1 退出”。

鏈接:https ://medium.com/faun/how-to-setupyour-typescript-app-test-environmentwith-jest-b41c481a2c

#typescript #jest

What is GEEK

Buddha Community

如何使用 Jest 設置 TypeScript 應用程序測試環境

The Definitive Guide to TypeScript & Possibly The Best TypeScript Book

TypeScript Deep Dive

I've been looking at the issues that turn up commonly when people start using TypeScript. This is based on the lessons from Stack Overflow / DefinitelyTyped and general engagement with the TypeScript community. You can follow for updates and don't forget to ★ on GitHub 🌹

Reviews

  • Thanks for the wonderful book. Learned a lot from it. (link)
  • Its probably the Best TypeScript book out there. Good Job (link)
  • Love how precise and clear the examples and explanations are! (link)
  • For the low, low price of free, you get pages of pure awesomeness. Chock full of source code examples and clear, concise explanations, TypeScript Deep Dive will help you learn TypeScript development. (link)
  • Just a big thank you! Best TypeScript 2 detailed explanation! (link)
  • This gitbook got my project going pronto. Fluent easy read 5 stars. (link)
  • I recommend the online #typescript book by @basarat you'll love it.(link)
  • I've always found this by @basarat really helpful. (link)
  • We must highlight TypeScript Deep Dive, an open source book.(link)
  • Great online resource for learning. (link)
  • Thank you for putting this book together, and for all your hard work within the TypeScript community. (link)
  • TypeScript Deep Dive is one of the best technical texts I've read in a while. (link)
  • Thanks @basarat for the TypeScript Deep Dive Book. Help me a lot with my first TypeScript project. (link)
  • Thanks to @basarat for this great #typescript learning resource. (link)
  • Guyz excellent book on Typescript(@typescriptlang) by @basarat (link)
  • Leaning on the legendary @basarat's "TypeScript Deep Dive" book heavily at the moment (link)
  • numTimesPointedPeopleToBasaratsTypeScriptBook++; (link)
  • A book not only for typescript, a good one for deeper JavaScript knowledge as well. link
  • In my new job, we're using @typescriptlang, which I am new to. This is insanely helpful huge thanks, @basarat! link
  • Thank you for writing TypeScript Deep Dive. I have learned so much. link
  • Loving @basarat's @typescriptlang online book basarat.gitbooks.io/typescript/# loaded with great recipes! link
  • Microsoft doc is great already, but if want to "dig deeper" into TypeScript I find this book of great value link
  • Thanks, this is a great book 🤓🤓 link
  • Deep dive to typescript is awesome in so many levels. i find it very insightful. Thanks link
  • @basarat's intro to @typescriptlang is still one of the best going (if not THE best) link
  •  
  • This is sweet! So many #typescript goodies! link

Get Started

If you are here to read the book online get started.

Translations

Book is completely free so you can copy paste whatever you want without requiring permission. If you have a translation you want me to link here. Send a PR.

Other Options

You can also download one of the Epub, Mobi, or PDF formats from the actions tab by clicking on the latest build run. You will find the files in the artifacts section.

Special Thanks

All the amazing contributors 🌹

Share

Share URL: https://basarat.gitbook.io/typescript/

Author: Basarat
Source Code: https://github.com/basarat/typescript-book/ 
License: View license

#typescript #opensource 

井上  康弘

井上 康弘

1657265760

如何使用 Jest 設置 TypeScript 應用程序測試環境

如何設置您的測試環境

為您的 typeScript 應用程序設置測試環境有五個步驟,它們在下面突出顯示:

  1. 安裝框架和依賴項:使用以下命令安裝Jest ts-jestts-node作為開發依賴項:
npm i --save dev jest ts-jest ts-node
ts-jest is a dependency that allows you to use jest to test applications written in typeScript while ts-node is a typeScript REPL for node js.

2. 安裝類型定義:按照初始 npm 命令的指示成功安裝框架後,使用以下命令為Jest安裝類型定義:

npm i --save dev @types/jest

3. 配置 jest:在項目的根目錄中創建一個帶有 typeScript 擴展名的jest配置文件(如下圖所示)。

jest.config.ts file in the root of a project.> jest.config.tsimport type { Config } from "@jest/types";export default async (): Promise<Config.InitialOptions> => {
  return {
    preset: "ts-jest",
     displayName: {
     name: "placeNameOfYourAppHere",
     color: "greenBright",
   },
   verbose: true,
   setupFiles: ["dotenv/config"],
   testMatch: ["**/**/*.test.ts"],
   testEnvironment: "node",
   detectOpenHandles: true,
   collectCoverage: true,
   transform: { "^.+\\.tsx?$": "ts-jest" },
   globalTeardown: "<rootDir>/src/tests/jest-globals-teardown.ts",
   forceExit: true,
 };
};

您還可以訪問jest 框架文檔以查看可以實現此目的的其他方法。
請注意,在jest.config.ts文件中,有一個globalTeardown屬性指向/src/tests文件夾中的jest-globals-teardown.ts文件。Jes t global teardown 是在測試套件執行後執行的。這僅僅意味著jest應該在執行測試套件/用例後立即退出。

要創建全局拆卸,請導航到/src 並創建一個/tests文件夾,該文件夾將容納jest-globals-teardown.ts文件(如下所示)。或者,您可以創建/helpers、 /integration_tests/unit_tests文件夾。這些文件夾將分別包含輔助函數、集成測試和單元測試。

jest-globals-teardown.ts file in a test folder.> jest-globals-teardown.tsexport default () => {
 process.exit(0);
};

4. 設置測試npm命令:最後一步是在package.json文件中設置npm測試腳本命令這些放置在package.json文件的“腳本”對像中的命令允許您執行jest框架的測試運行程序。

"scripts": {
  "test": "jest --runInBand",
  "test:watch": "jest --runInBand --watchAll",
}

— runInBand:別名:-i。在當前進程中連續運行所有測試,而不是創建運行測試的子進程的工作池。這對於調試很有用。

5. 配置你的節點環境:將你的節點環境設置為測試,如下所示:

> .env NODE_ENV='test'

要立即運行並退出jest測試運行程序,請使用以下命令:

npm run test

要在不退出測試運行器的情況下運行並繼續跟踪測試的更改,請使用以下命令:

npm run test:watch

你的第一個測試用例

到目前為止,我們已經介紹了設置測試環境的步驟。要創建我們的第一個測試,請導航到/src/tests/unit_tests,然後創建一個test.test.ts文件,其中包含一個簡單的測試用例,如下所示:

test("My first test", () => {
  const res = 1;
  expect(res).toBe(1);
});

然後使用 npm 命令執行測試運行器:

npm run test

在所有條件相同的情況下,jest測試運行器將在報告測試用例運行時間、測試套件數量和測試用例時返回通過,如下所示:

測試運行程序報告測試用例通過。

注意:測試文件名稱之後和 .ts擴展名之前的 .test很重要,例如(nameOfFile.test.ts)。它開玩笑說這是一個測試文件,你應該這樣運行它。在不表示這是一個測試文件(帶有 .test)的情況下, jest runner 將返回錯誤;“未找到測試,以代碼 1 退出”。

鏈接:https ://medium.com/faun/how-to-setupyour-typescript-app-test-environmentwith-jest-b41c481a2c

#typescript #jest

Jest-runner-tsc: A Jest Runner for The TypeScript Compiler

jest-runner-tsc

A Jest runner for the TypeScript compiler

install

npm install --save-dev jest-runner-tsc

usage

Jest configuration:

jest.tsc.config.js:

module.exports = {
  runner: 'jest-runner-tsc',
  displayName: 'tsc',
  moduleFileExtensions: ['js','ts', 'tsx'],
  testMatch: ['<rootDir>/**/*.ts'],
};

options

This project uses cosmiconfig, so you can provide config via:

  • a jest-runner-tsc property in your package.json
  • a jest-runner-tsc.config.js JS file
  • a .jest-runner-tscrc JSON file

Example in package.json

{
  "jest-runner-tsc": {
    "tsconfigPath": "./tsconfig.types.json"
  }
}

tsconfigPath

Default: ./tsconfig.json

A relative path to your tsconfig.json file.

run

jest -c jest.tsc.config.js

Author: Azz
Source Code: https://github.com/azz/jest-runner-tsc 
License: MIT license

#javascript #jest #typescript 

Jest With Typescript

If you are a developer with a bit of experience with Typescript and unit test, this post is for you.

The test-driven programming approach has become many successful developers’ essential building block to deliver high-quality code. Mocha and Chai are a prevalent testing tool in the Javascript/ Node.js domain in the last few years. Being a big fan of it, I have delivered numerous successful projects with it.

I was happy with Mocha and Chai until I started to use Typescript. In Typescripts’ setup with different ECMAScript or Babel versions, you may need various hacks to get it to work. Tooling is vital as other developers wouldn’t have frustration and obstacle because of the fragile and hacky solution that might be broken somewhere at a point in the future when tools and libraries are updated.

Jest is a better solution as it can test both Typescript and Javascript in a straightforward config. Let’s see how it works.

We’re gonna create the simplest setup of Typescript and Jest. In a blank new project, initiate with

$ yarn init -y

Then install typescriptjest@types/jestts-jest as development dependencies.

$ yarn add -D typescript jest @types/jest ts-jest

Cool. Let’s have the bare minimal config.

First, generate typescript config with tsc.

$ tsc --init 

Second, generate Jest config with ts-jest.

$ yarn ts-jest config:init

There you go! You’re ready to write the test. Straightforward enough?

#typescript #unittest #jest #chai #mocha

Testing with JEST in TypeScript

In this article, I will explain the step by step process of creating a project in TypeScript and setting up a test environment with jest .

This example requires basic knowledge of Node.js , npm and Visual Studio Code .

#testing #jest #nodejs #typescript #javascript