TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" - ESM & TS

Prerequisites

• Checked that your issue hasn’t already been filed by cross-referencing issues with the faq label
• Checked next-gen ES issues and syntax problems by using the same environment and/or transpiler configuration without Mocha to ensure it isn’t just a feature that actually isn’t supported in the environment in question or a bug in your code.
• ‘Smoke tested’ the code to be tested by running it outside the real test suite to get a better sense of whether the problem is in the code under test, your usage of Mocha, or Mocha itself
• Ensured that there is no discrepancy between the locally and globally installed versions of Mocha. You can find them with: node node_modules/.bin/mocha --version(Local) and mocha --version(Global). We recommend that you not install Mocha globally.

Description

Related to #4724

I’m trying to migrate to ESM, and Mocha gives me this error:

 > mocha

 TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for /home/maxim/google-api-typings-generator/tests/config.spec.ts
     at new NodeError (node:internal/errors:371:5)
     at Loader.defaultGetFormat [as _getFormat] (node:internal/modules/esm/get_format:71:15)
     at Loader.getFormat (node:internal/modules/esm/loader:105:42)
     at Loader.getModuleJob (node:internal/modules/esm/loader:243:31)
     at async Loader.import (node:internal/modules/esm/loader:177:17)
     at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
     at async formattedImport (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/esm-utils.js:7:14)
     at async Object.exports.requireOrImport (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/esm-utils.js:48:32)
     at async Object.exports.loadFilesAsync (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/esm-utils.js:88:20)
     at async singleRun (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/cli/run-helpers.js:125:3)
     at async Object.exports.handler (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/cli/run.js:374:5)

As can be seen from https://github.com/Maxim-Mazurok/google-api-typings-generator/commit/cfa158a6b659e2b23b393ebd90a701c07aec000a, I’ve added "require": ["ts-node/esm"] to .mocharc.json, using "module": "ES2020" in tsconfig.json and "type": "module" in package.json.

I’ve also tried node --loader ts-node/esm ./node_modules/mocha/bin/mocha --extension ts, which produces another error:

TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension "" for /home/maxim/google-api-typings-generator/node_modules/mocha/bin/mocha
    at new NodeError (node:internal/errors:371:5)
    at defaultGetFormat (node:internal/modules/esm/get_format:71:15)
    at defer (/home/maxim/google-api-typings-generator/node_modules/ts-node/src/esm.ts:82:7)
    at /home/maxim/google-api-typings-generator/node_modules/ts-node/src/esm.ts:104:24
    at Generator.next (<anonymous>)
    at /home/maxim/google-api-typings-generator/node_modules/ts-node/dist/esm.js:8:71
    at new Promise (<anonymous>)
    at __awaiter (/home/maxim/google-api-typings-generator/node_modules/ts-node/dist/esm.js:4:12)
    at getFormat (/home/maxim/google-api-typings-generator/node_modules/ts-node/dist/esm.js:55:16)
    at Loader.getFormat (node:internal/modules/esm/loader:105:42) {
  code: 'ERR_UNKNOWN_FILE_EXTENSION'
}

Not sure how to solve this, and if Mocha + TS + ESM is even supposed to work. If it’s supposed to work - would really appreciate any guidance, ideally reference to the working project.

Steps to Reproduce

See Readme of esm branch of the project for repro: https://github.com/Maxim-Mazurok/google-api-typings-generator/tree/esm (npm cit and observe)

Expected behavior: TS + ESM + Mocha works

Actual behavior: TS + ESM + Mocha results in an error

 > mocha

 TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for /home/maxim/google-api-typings-generator/tests/config.spec.ts
     at new NodeError (node:internal/errors:371:5)
     at Loader.defaultGetFormat [as _getFormat] (node:internal/modules/esm/get_format:71:15)
     at Loader.getFormat (node:internal/modules/esm/loader:105:42)
     at Loader.getModuleJob (node:internal/modules/esm/loader:243:31)
     at async Loader.import (node:internal/modules/esm/loader:177:17)
     at async importModuleDynamicallyWrapper (node:internal/vm/module:437:15)
     at async formattedImport (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/esm-utils.js:7:14)
     at async Object.exports.requireOrImport (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/esm-utils.js:48:32)
     at async Object.exports.loadFilesAsync (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/esm-utils.js:88:20)
     at async singleRun (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/cli/run-helpers.js:125:3)
     at async Object.exports.handler (/home/maxim/google-api-typings-generator/node_modules/mocha/lib/cli/run.js:374:5)

Reproduces how often: 100%

Versions

• The output of mocha --version and node node_modules/.bin/mocha --version: 9.1.0, 9.1.0
• The output of node --version: v16.7.0
• Your operating system
  • name and version: Ubuntu 20 in WSL on Windows 10
  • architecture (32 or 64-bit): 64
• Your shell (e.g., bash, zsh, PowerShell, cmd): bash
• Your browser and version (if running browser tests): N/A
• Any third-party Mocha-related modules (and their versions): N/A
• Any code transpiler (e.g., TypeScript, CoffeeScript, Babel) being used (and its version): TypeScript 4.3.5

Additional Information

[Maxim-Mazurok]

Edit: it’s not “require”: [“ts-node/esm”], but “loader”: “ts-node/esm”

This is what I was missing, setting "loader": "ts-node/esm" in .mocharc.json instead of "require" now works like a charm.

I’ve updated my esm branch in case if someone will need an example/reference: https://github.com/Maxim-Mazurok/google-api-typings-generator/tree/esm?rgh-link-date=2021-08-21T15%3A39%3A00Z (Update: it https://github.com/Maxim-Mazurok/google-api-typings-generator/pull/539 was merged)

Thank you!

[juergba]

@josh-hemphill We have an example repo with an open issue on this topic. There you can also find links to the ts-node repo with detailed information/discussions.

Just in case you are planning to contribute a typescript example to our example repo …