用Jest測試ES6類會拋出“非構造函數”錯誤

Question

我在這里發現了類似的問題，但似乎沒有答案。

我正在嘗試使用Jest測試ES6類，如下所示：

// src/myclass.js
export default class MyClass {
    constructor(options) {
        // currently this is empty while I debug this problem
    }
}

和測試：

// test/myclass.test.js
import { MyClass } from '../src/myclass.js';

describe("Test Constructor", () => {

    test("doesn't throw error when constructed", async () => {
        expect(() => {
            const testMyClass = new MyClass();
        }).not.toThrowError();
    }

});

當我運行測試時，Jest拋出一個錯誤，說：

TypeError：_myClass.MyClass不是構造函數

我最好的猜測是，這是babel配置的問題，但我似乎無法弄清楚。 如果我將MyClass更改為函數而不是類，然后刪除導出/導入（即，做事的前置方法），則它將按預期工作。

這是我在package.json中的配置：

"devDependencies": {
    "@babel/core": "^7.1.2",
    "@babel/preset-env": "^7.1.0",
    "babel-core": "^7.0.0-bridge.0",
    "gulp": "^3.9.1",
    "gulp-babel": "^8.0.0",
    "gulp-jest": "^4.0.2",
    "gulp-rename": "^1.4.0",
    "gulp-uglify": "^3.0.1",
    "jest": "^23.6.0",
    "jest-cli": "^23.6.0",
    "pump": "^3.0.0",
    "regenerator-runtime": "^0.12.1"
  },
  "babel": {
    "presets": [
      "@babel/preset-env"
    ]
  },
  "jest": {
    "testPathIgnorePatterns": [
      "<rootDir>/node_modules/",
      "<rootDir>/test/._*.test.js"
    ],
    "testEnvironment": "jsdom",
    "setupFiles": [
      "<rootDir>/src/myclass.es6.js"
    ]
  }

Answer 1

您的導入和導出語法不匹配。 您需要更改一個或另一個才能起作用。 如果要使用默認導出，例如：

export default class MyClass { ... }

然后相應的導入為：

import MyClass from '../src/myclass.js'

---

或者，如果您想繼續使用相同的導入語法，請在導出時刪除“默認”：

export class MyClass { ... }

然后：

import { MyClass } from '../src/myclass.js'

Answer 2

您的班級已默認導出...

// try this
import MyClass from '../src/myclass.js';
// instead of this
import { MyClass } from '../src/myclass.js';