React应用如何测试普通JS文件 运行测试仅显示App.test.js结果

用Create React App搭建的项目内置了Jest测试环境，默认对测试文件有严格的命名、路径匹配规则，不符合规则的文件不会被识别为测试用例，自然不会执行、也不会出现在测试结果里。

• 首先检查测试文件命名：Jest默认只会识别三类测试文件，你当前的测试文件如果没按规则命名就会被跳过：
  • 放在任意层级__tests__文件夹内的.js/.jsx文件
  • 任意路径下带.test.js/.test.jsx后缀的文件
  • 任意路径下带.spec.js/.spec.jsx后缀的文件
    从你贴的导入路径import { IsValidBinary } from "./validityFunctions";来看，测试文件和工具函数文件在同一级目录，你需要把测试文件重命名为validityFunctions.test.js，这是最常见的出错点。
    正确的目录结构参考：

  src/
    utils/ # 存放复用辅助函数的目录
      validityFunctions.js # 纯JS工具函数本体
      validityFunctions.test.js # 对应测试文件，必须带.test.js后缀
    App.js
    App.test.js
  

• 如果命名正确仍然无法识别，检查package.json里的自定义Jest配置：如果你手动加了testMatch配置覆盖了CRA默认规则，且规则只匹配了根目录的App.test.js一类文件，就会漏扫子目录里的测试。没有特殊定制需求的话直接删掉自定义的testMatch配置，用默认规则即可；如果需要自定义，要确保规则覆盖src下所有符合命名规范的文件，参考配置：

  {
    "jest": {
      "testMatch": [
        "<rootDir>/src/**/__tests__/**/*.{js,jsx}",
        "<rootDir>/src/**/*.{test,spec}.{js,jsx}"
      ]
    }
  }
  

• 调整完成后重新执行测试命令npm test（或yarn test），选择运行全部测试的选项，就能看到你写的工具函数测试结果了。

你贴的测试用例本身语法没有问题，只要文件能被Jest识别到就可以正常执行。

内容的提问来源于stack exchange，提问作者Brandon