Jest

[xiaotiandada]

• https://jestjs.io/
• https://www.jianshu.com/p/c1b5676c1edd

Next + TypeScript + Jest

    /node_modules/parse-domain/build/main.js:3
    export { parseDomain, ParseResultType, } from "./parse-domain.js";
    ^^^^^^

    SyntaxError: Unexpected token 'export'

      1 | import assert from 'assert'
    > 2 | import { fromUrl, parseDomain, ParseResultType } from 'parse-domain'
        | ^
      3 | import { toUnicode } from 'punycode'
      4 |

忽略转换模式, 不起作用，直接删除 node_modules 反而生效. 但是会变慢...

  transformIgnorePatterns: [
    '!node_modules/',
   // '/node_modules/',
  ],

新的解决方案, 忽略一些报错的包

  transformIgnorePatterns: [
    '/node_modules/(?!parse-domain|is-ip|ip-regex|uuid)', // SyntaxError: Unexpected token 'export'
  ],

  ● Test suite failed to run

    ReferenceError: TextEncoder is not defined

      1 | import assert from 'assert'
    > 2 | import { fromUrl, parseDomain, ParseResultType } from 'parse-domain'
        | ^
      3 | import { toUnicode } from 'punycode'

设置 TextEncoder

• jest jsdom: ReferenceError: TextEncoder is not defined inrupt/solid-client-authn-js#1676 (comment)
• https://stackoverflow.com/questions/57712235/referenceerror-textencoder-is-not-defined-when-running-react-scripts-test/72734315#72734315
• chore(deps-dev): bump jest from 27.5.1 to 28.0.0 microsoft/accessibility-insights-web#5421 (comment)
• microsoft/accessibility-insights-web@9ad4e61#diff-c4f1d9c9d7b982f26536dbd6bf8c0804c1c0011fba8bc6df6e937363acfffa1f
• https://blog.csdn.net/weixin_42429288/article/details/124590185
• https://github.com/vercel/next.js/blob/canary/examples/with-jest/jest.config.js
• https://github.com/vercel/next.js/blob/canary/examples/with-jest-babel/jest.config.js
• https://juejin.cn/post/6844903942023823367#heading-8

// ...
setupFiles: [`<rootDir>/jest-shim.js`],
testEnvironment: 'jest-environment-jsdom',
// ...

import { TextDecoder, TextEncoder } from 'util'

global.TextEncoder = TextEncoder
global.TextDecoder = TextDecoder

decorators-legacy

• https://stackoverflow.com/questions/52262084/syntax-error-support-for-the-experimental-syntax-decorators-legacy-isnt-cur
• https://babeljs.io/docs/en/babel-plugin-proposal-decorators

Support for the experimental syntax 'decorators-legacy' isn't currently enabled (23:3):

Env

• https://blog.shinki.net/posts/nextjs-jest-environment-variable
• https://nextjs.org/docs/basic-features/environment-variables

import { loadEnvConfig } from '@next/env'

const projectDir = process.cwd()
loadEnvConfig(projectDir)

baseUrl paths

• https://stackoverflow.com/questions/50171412/jest-typescript-absolute-paths-baseurl-gives-error-cannot-find-module
• https://jestjs.io/zh-Hans/docs/configuration#moduledirectories-arraystring

  moduleDirectories: ['<rootDir>/node_modules', '<rootDir>'],

jest 测试框架 test it describe 什么意思

在 Jest 测试框架中，test、it 和 describe 都是用来定义测试用例的函数。

test 和 it 函数用来定义一个单独的测试用例，它们的作用相同，都是定义一个测试。两者的区别在于，test 是 it 函数的别名，因此两者的使用方式完全一样。

describe 函数则用来对多个测试用例进行分组，它可以包含多个 test 或 it 函数，形成一个测试套件。描述一个测试套件可以增加代码的可读性，同时也可以在执行测试时对测试用例进行分组，方便对测试结果进行分析和统计。

在 Jest 中，test 和 it 可以直接写在文件中，而 describe 函数通常会嵌套在 test 或 it 函数内部，以形成测试用例的层级结构。例如：

describe('Math operations', () => {
  test('addition', () => {
    // Test code here
  });

  test('subtraction', () => {
    // Test code here
  });

  describe('Multiplication', () => {
    test('basic multiplication', () => {
      // Test code here
    });

    test('multiplication with zero', () => {
      // Test code here
    });
  });
});

在上面的例子中，我们使用了 describe 函数来将多个测试用例分组，形成了一个名为 "Math operations" 的测试套件。其中包含了两个直接的测试用例（addition 和 subtraction），以及一个嵌套的测试套件（Multiplication），该测试套件中包含了两个测试用例。 -- chatGPT