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

时间:2018-08-15 16:54:04

标签: office-ui-fabric

我正在尝试为Office Fabric React编写测试,最初是从react-scripts-ts开始的,由于遇到此问题而退出,并且在使用withResponsiveMode库时遇到以下错误:< / p>

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"
  }
}

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

1 个答案:

答案 0 :(得分:1)

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

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