如何使用Mocha测试ES6模块（带有导入功能）？

Question

这是我第一次测试JS前端，为此我选择了mocha。我有一个让我们说Market的课程，它使用了我制作的其他课程。我在最后使用import ... from ...子句和export default Market。

所以Market类看起来像这样：

import { math, AnotherClass, MyOtherClass } from '../index.js'
class Market {
  constructor () {
    // code here
  }
  methodToTest(input) {
    // some code here ...
    return output
  }
}
export default Market

然后是我的test.js

var assert = require('assert')
// import { Market } from '../public/mm/ai/Market.js'
var Market = require('../public/mm/ai/Market')

describe('Market', function() {
    describe('#methodToTest()', function() {
        it('should return 0 input is greater than mean + 4 * sigma', function() {
           var market = new Market()
           assert.equal(market.methodToTest(45), 0)
        })
    })
})

运行测试后，我得到了错误：

import { math, AnotherClass, MyOtherClass } from '../index.js'
^^^^^^

SyntaxError: Cannot use import statement outside a module

和错误堆栈。

问题是：如何通过这些导入使Mocha测试我的模块？如您所见，我还尝试直接在test.js中使用import，它也失败了。但是我不想重写我的整个项目以使用require，因为它现在在浏览器中可以正常运行。

Answer 1

所以我自己找到了解决方案。

1. Babel＆mocha-最好，没有中间文件

首先是。mocharc.js文件，将摩卡配置为使用babel和chai：

module.exports = {
    require: ['chai', '@babel/register'],
    ui: 'bdd',
    // ui: 'tdd',
    reporter: 'spec',
    growl: false,
};

我选择了ui：'bdd'，因为我在test.js中使用了[[describe：describe('Market class:', function() {

第二我在

package.json中添加了babel配置：

"babel": {
    "env": {
      "test-console": {
        "presets": ["@babel/preset-env"],
        "plugins": ["@babel/plugin-proposal-class-properties"]
      }
    ,
      "test": {
        "presets": ["@babel/preset-env"],
        "plugins": ["@babel/plugin-proposal-class-properties", "transform-remove-console"]
      }
    }
  },

两个用于控制台输出和不使用它的环境。它导致
package.json

脚本部分执行其中之一：

 "scripts": {
    "test": "BABEL_ENV=test mocha || TRUE",
    "test-console-log": "BABEL_ENV=test-console mocha || TRUE"
  },

现在我已经准备好执行我的[[test.js并且可以在模块中进行导入了。这是
test.js的头：
var assert = require('chai').assert
import Market from '../public/mm/ai/Market.js'
...

我在考虑自己的模块时切换为导入。

Webpack，Babel和Mocha

webpack配置中的所有内容：

var path = require('path');
const TerserPlugin = require('terser-webpack-plugin')

module.exports = {
  mode: 'none',
  entry: './test/test.js',
  output: {
      path: path.resolve(__dirname, 'test/'),
      filename: 'exec_test.js'
  },
  module: {
    rules: [
        {
            test: /\.js$/,
            exclude: /node_modules/,
            use: {
                loader: 'babel-loader',
                options: {
                    presets: ['@babel/preset-env'],
                    plugins: ['@babel/plugin-proposal-class-properties']
                }
            }
        }
    ]
  },
  optimization: {
      minimize: true,
      minimizer: [new TerserPlugin({
          terserOptions: {
              compress: 
              {
                  drop_console: true
                }
            }
        })]
    }
};

然后您可以通过以下方式构建和运行它：

"scripts": {
   "build-tests-webpack": "webpack --config webpack.config.test.js",
   "exec test": "mocha --ui bdd test/exec_test.js"
}

在

package.json

中>