如何将 jest 与 coffeescript 和 ES6/ES2015 一起使用（例如通过 Babel）？

Posted 2023-03-03

【中文标题】如何将 jest 与 coffeescript 和 ES6/ES2015 一起使用（例如通过 Babel）？

【英文标题】：How do I use jest with coffeescript and ES6/ES2015 (e.g. via Babel)?

【发布时间】：2016-05-21 12:15:49

【问题描述】：

我的团队在我们的项目中一直在使用 coffeescript 和 ES6/ES2015（通过 Babel）。由于 Babel 文件最终是兼容的，因此它运行良好。但我不知道我们如何编写一个允许两者兼得的玩笑测试。

我找到了如何将 jest 与咖啡或 ES6 功能一起使用的示例，但不能同时使用这两种功能：

Example with coffeescript Another example with coffeescript Example with Babel 有人建议将预处理器设置为babel-jest，如果我只将它与 ES6 一起使用，这对我来说很好。

这些都有效。但同样，我不知道如何组合它们

我尝试过的

我尝试了自己的解决方案：

在package.json 我有：

"jest": 
  "scriptPreprocessor": "<rootDir>/jest-script-preprocessor",
  "unmockedModulePathPatterns": [
    "<rootDir>/node_modules/react",
    "<rootDir>/node_modules/react-dom",
    "<rootDir>/node_modules/react-addons-test-utils",
    "<rootDir>/node_modules/fbjs"
  ],
  "testFileExtensions": ["coffee", "cjsx", "js", "jsx"],
  "moduleFileExtensions": ["coffee", "cjsx", "js", "jsx"]

在jest-script-preprocessor.js，我有：

var coffee = require('coffee-react');
var transform = require('coffee-react-transform');
var babelJest = require("babel-jest");

module.exports = 
    process: function(src, path) 
        if (coffee.helpers.isCoffee(path)) 
            console.log(path);
            return coffee.compile(transform(src), 
                'bare': true
            );
         else 
            console.log(path);
            return babelJest.process(src, 
                filename: path,
                stage: 0
            );
        
    
;

如果我运行npm test __tests__/sometest.jsx 之类的测试，它会很好地加载 ES6 测试文件。该测试文件将导入被测模块，这也是 ES6，这就是它爆炸的地方。它只是说Unexpected reserved word，只要它遇到仅限ES6的语法，比如import、export等。有no additional line information，但我知道是ES6导致了问题，因为如果我在下面更改模块测试为 ONLY export default 'mystring'，它会爆炸，如果我将其更改为非 ES6 语法，如 var q = 5 + 5; module.exports = q;，它会很好地导入模块。 （当然，这不是一个真正的可测试模块，但它不需要用于这个概念验证。）

注意其中的console.log() 行。我从来没有见过他们。所以这很难追踪的一个原因是我无法放入任何我自己的调试逻辑。我确信这些行会运行，因为如果我在这些行上添加一些随机语法，它会窒息。但没有控制台输出。

我试过jest-webpack-alias，也就是officially recommended by jest，理论上听起来很棒：你将jest 与webpack 一起使用，这样你就可以使用你已经设置的任何预处理器。它给了我与Unexpected reserved word 相同的错误。我写了an issue on their github repo。

注意事项

我找到了jestpack，但我不想使用它，因为它需要 Node >= 5，我想使用 Node 4.2.3。它也不适用于 Jest >= 0.8，我想使用 Jest 0.8，因为它目前是最新的，我认为最有可能与实时文档和反应版本 (0.14.6) 同步。

【参考方案1】：

这就是我正在做的对我有用的事情。

npm install --save-dev babel-jest
npm install --save-dev coffee-react

在package.json:

"jest": 
    "scriptPreprocessor": "<rootDir>/jest-script-preprocessor",
    "unmockedModulePathPatterns": [
        "<rootDir>/node_modules/."
    ],
    "testFileExtensions": ["coffee", "cjsx", "js", "jsx"],
    "moduleFileExtensions": ["coffee", "cjsx", "js", "jsx"]

记下 unmockedModulePathPatterns。我将其设置为匹配node_modules 中的所有内容。您可能不希望这样，但如果您开始收到像 Error: Failed to get mock metadata:... 这样的错误，请将其视为 recommended here。

在jest-script-preprocessor.js:

var babelJest = require('babel-jest');
var coffee = require('coffee-react');

module.exports = 
    process: function(src, filename) 
        if (filename.indexOf('node_modules') === -1) 
            if (filename.match(/\.coffee|\.cjsx/)) 
                src = coffee.compile(src, bare: true);
             else 
                src = babelJest.process(src, filename);
            
        
        return src;
    
;

【讨论】：

它对我不起作用，运行 jsx 文件测试时出现“SyntaxError: Unexpected token import”。