开玩笑反应示例

Question

我正在尝试从 Jest React tutorial 运行 React 示例，但收到错误消息

λ npm test                                          

> ...                           
> jest                                              

Found 1 matching tests...                           
 FAIL  __tests__\CheckboxWithLabel-test.js (0.551s) 
npm ERR! Test failed.  See above for more details.  
npm ERR! not ok code 0   

我几乎直接从示例中复制了代码。 package.json 如下：

{
  "dependencies": {
    "react": "*",
    "react-tools": "*"
  },
  "scripts":{
    "test": "jest"
  },
  "jest": {
    "scriptPreprocessor": "<rootDir>/preprocessor.js",
    "unmockedModulePathPatterns": [
      "<rootDir>/node_modules/react"
    ]
  },
  "devDependencies": {
    "jest-cli": "~0.1.17"
  }
}

有什么想法可以解决这些错误并成功运行示例测试吗？我很可能错过了一个重要的细节（或细节），但不完全确定是什么。哦，对于它的价值，如果这会影响这一点，我会在 Windows 上运行它。我真的很想对我的反应组件进行一些测试（那里也遇到了一些问题，所以从基本示例开始）——任何帮助将不胜感激:)

Answer 1

我在他们的 github 页面上创建了一个issue。正在等待找出它是否实际上是与 Windows 相关的问题

与此同时，最终通过指定模块的名称而不是相对路径来使其工作

"unmockedModulePathPatterns": ["react"]

Answer 2

对于任何最终在这里进行搜索的人，@ron 的 github 问题最终得到了解决，结论是 unmockedModulePathPatterns 期望匹配文件路径的正则表达式数组，而不一定是文件路径本身。这就是使用“相对”路径有效的原因。来自 Jest API 文档：

与所有匹配的正则表达式模式字符串数组 模块加载器之前的模块将自动返回一个模拟 他们。如果一个模块的路径匹配此列表中的任何模式，它 不会被模块加载器自动模拟。

这对于一些常用的“实用程序”模块很有用 几乎一直用作实现细节（比如 下划线/低破折号等）。保持这一点通常是最佳做法 列表尽可能小，并始终使用显式 jest.mock()/jest.dontMock() 在个别测试中调用。显式 每个测试设置对于测试的其他读者来说更容易推理 关于测试将运行的环境。

可以通过以下方式在单个测试中覆盖此设置 在测试文件的顶部显式调用 jest.mock()。

(https://facebook.github.io/jest/docs/api.html#config-unmockedmodulepathpatterns-array-string)

从问题本身来看：

Jest 在内部使用 unmockedModulePathPatterns 创建一个 RegExp 将根据其测试所有必需的模块。因此，你 需要提供有效的正则表达式模式。例如，这很好用 对我来说：

> unmockedModulePathPatterns: [
>       "node_modules\\" + path.sep + "react",
>       "node_modules\\" + path.sep + "reflux",
>       "node_modules\\" + path.sep + "react-router"
>     ],

• "mlarcher", (https://github.com/facebook/jest/issues/100)

Answer 3

<rootDir> 应替换为实际路径。看起来您没有要开始的子目录，而在某些情况下，您可能只想在 src/ 路径中运行测试，因此您的 package.json 看起来更像这样：

{
  ...
  "jest": {
    "rootDir": "src",
    "scriptPreprocessor": "../jest/preprocessor.js" // Note: relative to src
  }
  ...
}