monounity / karma-typescript

Simplifying running unit tests with coverage for Typescript projects.
313 stars 109 forks source link

Unexpected token: mocha/lib/esm-utils.js #375

Open Booteille opened 4 years ago

Booteille commented 4 years ago

Hi.

I am asking for help here since I can't find out how to setup my test environment with karma-typescript.

Using mocha, tests are running fine but as soon as I try to run tests with Karma, I get the following output:

⋊> ~/project karma start                                                                    14:47:07
25 04 2020 14:47:23.952:INFO [compiler.karma-typescript]: Compiling project using Typescript 3.8.3
25 04 2020 14:47:27.356:INFO [compiler.karma-typescript]: Compiled 20 files in 3384 ms.
25 04 2020 14:47:27.981:ERROR [source-reader.karma-typescript]: Error parsing code: Unexpected token (8:11)
in /home/user/project/node_modules/.pnpm/registry.npmjs.org/mocha/7.1.1/node_modules/mocha/lib/esm-utils.js
at line 8, column 11:

... import(url.pathToFileURL(file));
  }

./karma.conf.js

// Karma configuration
// Generated on Fri Apr 24 2020 16:40:19 GMT+0200 (GMT+02:00)

module.exports = (config) => {
  config.set({
    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ["mocha", "chai", "karma-typescript"],

    // list of files / patterns to load in the browser
    files: ["src/**/*.ts", "tests/**/*.ts"],

    // list of files / patterns to exclude
    exclude: [],

    plugins: [
      "karma-firefox-launcher",
      "karma-mocha",
      "karma-chai",
      "karma-typescript",
    ],

    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
      "src/**/*.ts": ["karma-typescript"],
      "tests/**/*.ts": ["karma-typescript"],
    },

    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ["progress", "karma-typescript"],

    // web server port
    port: 9876,

    // enable / disable colors in the output (reporters and logs)
    colors: true,

    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,

    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ["Firefox"],

    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: true,

    // Concurrency level
    // how many browser should be started simultaneous
    concurrency: Infinity,

    karmaTypescriptConfig: {
      bundlerOptions: {
        acornOptions: {
          ecmaVersion: 8,
        },
        transforms: [require("karma-typescript-es6-transform")()],
      },
      compilerOptions: {
        baseUrl: "./",
        esModuleInterop: true,
        types: ["node"],
      },
    },
  });
};

./tsconfig.json

{
  "include": ["src", "types"],
  "compilerOptions": {
    "module": "commonjs",
    "target": "es6",
    "lib": ["dom", "es2015", "es2016", "es2017"],
    "sourceMap": true,
    "strict": true,
    "strictNullChecks": true,
    "removeComments": true,
    "baseUrl": "./",
    "outDir": "./dist",
    "paths": {
      "src/*": ["src/*"]
    },
    "esModuleInterop": true
  },
  "exclude": [
    "dist",
    "node"
  ]
}

Does anyone have a clue about how to fix it? I tried a lot of different things found on the internet, nothing worked.

elizabethsjudd commented 4 years ago

@Booteille I'm running in to the exact same issue. By any chance have you solved this?

Booteille commented 4 years ago

Nop. I never found a solution for that.

thw0rted commented 3 years ago

I haven't tried this myself, but it looks like the error is because Mocha is using dynamic import() , which is an ES6 feature and thus unsupported. The front page of the repo links to an ES6-downleveling transform which I think just shoves things through Babel. You may need to further configure the transform to provide a Babel plugin for handling dynamic import() -- as I say, I haven't actually gotten this working myself.