ts react jest单元测试问题

Jest同时支持ts和react jsx

• TypeScript + Jest + React-Testing-Library：https://www.jianshu.com/p/1bef70cfe712

jest配置文件

// jest.config.js

module.exports = {
  // preset: 'ts-jest',
  // testEnvironment: 'node',
  // roots: ['<rootDir>/src'],
  transform: {
      '^.+\\.tsx?$': 'ts-jest',
  },
  testRegex: '^.+\\.test\\.(ts|tsx)$',
  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
  moduleNameMapper: {
    "\\.(css|less)$": "identity-obj-proxy",
  },
};

• @testing-library/react的query api：https://testing-library.com/docs/dom-testing-library/api-queries

  • ByLabelText
  • ByPlaceholderText
  • ByText
  • 。。。

• @testing-library/react在jest中的断言库：https://github.com/testing-library/jest-dom

  • 断言：
    • toBeDisabled
    • toBeEnabled
    • toBeEmpty
    • toBeEmptyDOMElement
    • 。。。

Jest 解析css文件异常

• Jest 解析css文件异常：https://www.jianshu.com/p/34d88e920367
• jest-unexpected-token-when-importing-css -- https://stackoverflow.com/questions/54627028/jest-unexpected-token-when-importing-css

react hooks 的单元测试

• 如何对 react hooks 进行单元测试：https://segmentfault.com/a/1190000020058166
• React Hooks测试完全指南：https://zhuanlan.zhihu.com/p/220278150
• 使用@testing-library/react-hooks：https://github.com/testing-library/react-hooks-testing-library

来源：oschina

链接：https://my.oschina.net/u/4691589/blog/4740227