使用Jest进行测试时，classnames_1.default不是一个函数

Question

我正面临着在使用classnames（https://www.npmjs.com/package/classnames）库时在Jest上运行测试用例的问题：

它抛出错误：classnames_1.default不是一个函数

它正在网站上使用webpack ..所以我不想改变导入。

我可以选择模拟类名以进行测试以提供类似的行为。有没有其他方法可以解决这个问题？

有人遇到过这个问题吗？

这是我在package.json中的jest配置：

"jest": {
    "globals": {
      "API_HOST": "",
      "DEV": false
    },
    "transform": {
      ".(ts|tsx)": "<rootDir>/node_modules/XXX-framework/jestTypeScriptPreProcessor.js"
    },
    "testRegex": "(/tests/.*|\.(test|spec))\.(js|jsx|ts|tsx)$",
    "transformIgnorePatterns": [],
    "moduleFileExtensions": [
      "ts",
      "tsx",
      "js",
      "json"
    ],
    "automock": false,
    "clearMocks": true,
    "resetMocks": true,
    "coverageThreshold": {
      "global": {
        "branches": 50,
        "functions": 50,
        "lines": 50,
        "statements": 50
      }
    },
    "modulePaths": [
      "<rootDir>/src",
      "<rootDir>/node_modules/XXX-framework/src"
    ],
    "unmockedModulePathPatterns": [
      "<rootDir>/node_modules/react/",
      "<rootDir>/node_modules/react-dom/",
      "<rootDir>/node_modules/react-addons-test-utils/",
      "<rootDir>/node_modules/enzyme/",
      "<rootDir>/node_modules/XXX-framework/"
    ]
  }

谢谢

Answer 1

您可能正在使用css-loader，因此它适用于Webpack。问题是Jest没有用css-loader加载你的CSS文件，你有责任告诉Jest如何加载CSS文件。一种方法是使用identity-obj-proxy。

做npm i -D identity-obj-proxy（如果你愿意，可以使用纱线安装）

并将此配置添加到您的Jest配置文件

"moduleNameMapper": {
  "^.+\\.css$": "identity-obj-proxy"
}

你可以在this document找到更多细节。