ResponsiveMode 在使用 lib-common-js 的 Jest 测试中未定义

Question

我正在尝试为我的 Office Fabric React 编写测试，最初开始使用 react-scripts-ts，现在因为我运行进入这个问题而被弹出，我运行进入使用 withResponsiveMode 库时出现以下错误：

TypeError: Cannot read property 'large' of undefined

  13 | const initialState: IAppState = {
  14 |   isMenuVisible: true,
> 15 |   responsiveMode: ResponsiveMode.large
     |                                  ^
  16 | };
  17 |
  18 | // Actions

我正在使用此处列出的 moduleNameMapper 设置：https://github.com/OfficeDev/office-ui-fabric-react/wiki/Fabric-6-Release-Notes。

我的玩笑配置如下：

module.exports = {
  collectCoverageFrom: ["src/**/*.{js,jsx,ts,tsx}"],
  globals: {
    "ts-jest": {
      tsConfigFile: "C:\repos\provider-portal-ui\tsconfig.test.json"
    }
  },
  moduleFileExtensions: [
    "web.ts",
    "ts",
    "web.tsx",
    "tsx",
    "web.js",
    "js",
    "web.jsx",
    "jsx",
    "json",
    "node",
    "mjs"
  ],
  moduleNameMapper: {
    "^react-native$": "react-native-web",
    "office-ui-fabric-react/lib/": "office-ui-fabric-react/lib-commonjs/"
  },
  setupFiles: ["<rootDir>/config/polyfills.js"],
  testEnvironment: "node",
  testMatch: [
    "<rootDir>/src/**/__tests__/**/*.(j|t)s?(x)",
    "<rootDir>/src/**/?(*.)(spec|test).(j|t)s?(x)"
  ],
  testURL: "http://localhost",
  transform: {
    "^.+\.css$": "jest-css-modules",
    "^.+\.tsx?$": "ts-jest"
  },
  transformIgnorePatterns: [
    "[/\\]node_modules[/\\].+\.(js|jsx|mjs|ts|tsx)$"
  ]
};

tsconfig.json:

{
  "compilerOptions": {
    "baseUrl": ".",
    "outDir": "build/dist",
    "module": "esnext",
    "target": "es5",
    "lib": ["es6", "dom"],
    "sourceMap": true,
    "allowJs": true,
    "jsx": "react",
    "moduleResolution": "node",
    "rootDir": "src",
    "forceConsistentCasingInFileNames": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "suppressImplicitAnyIndexErrors": true,
    "noUnusedLocals": true,
    "experimentalDecorators": true
  },
  "exclude": [
    "node_modules",
    "build",
    "scripts",
    "acceptance-tests",
    "webpack",
    "jest",
    "src/setupTests.ts"
  ]
}

tsconfig.test.json:

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "module": "commonjs"
  }
}

我猜这是某种配置问题，因为这段代码在未经测试时工作正常。

Answer 1

找到了这个问题的答案。这似乎是 Typescript & ts-jest 和枚举的问题。

https://github.com/kulshekhar/ts-jest/issues/281

ResponsiveMode 在使用 lib-common-js 的 Jest 测试中未定义

ResponsiveMode is undefined in Jest test using lib-common-js

office-ui-fabric