Support loading of ESM files

[novemberborn]

It's unclear to me how we would load compiled ESM files.

Our current approach is to install a hook on require.extensions but this is ignored for ESM files: https://github.com/avajs/babel/blob/c9de6fc63f9bc61abcdfbc99ebf734c1ad5a9210/index.js#L366:L369

Assuming that paths in the Babel output are relative, we could simply import() any given file and assume that everything else will follow. However this means code runs from a different directory leading to subtle failures.

Once we resolve this, we could add a default mjs extension, though this would be a breaking change.

[fregante]

Possibly related. I'm using Babel to support JSX files. I get:

  Uncaught exception in tests/index.jsx

  ./tests/index.jsx:13
  const _require = (0, _module.createRequire)(import.meta.url);
                                                     ^^^^

  SyntaxError: Cannot use 'import.meta' outside a module

Then I disable the ES Modules compilation with:

        "presets": [
          ["module:@ava/babel/stage-4", false]
        ]

and I get:

  Uncaught exception in tests/index.jsx

  ./tests/index.jsx:1
  import { createRequire } from 'module';
  ^^^^^^

  SyntaxError: Cannot use import statement outside a module

I think this is due to:

However this means code runs from a different directory leading to subtle failures

In my case, I have type:module in my package.json, so it should also be copied to the temporary directory.

[fregante]

Is AVA using @babel/register? Because I think this is not possible at the moment, according to the docs:

Note: @babel/register does not support compiling native Node.js ES modules on the fly, since currently there is no stable API for intercepting ES modules loading.

[novemberborn]

Is AVA using @babel/register?

No, we install a hook to rewrite require() calls.

[novemberborn]

I think this is due to:

However this means code runs from a different directory leading to subtle failures

In my case, I have type:module in my package.json, so it should also be copied to the temporary directory.

Yes but with our Babel support we still require() rather than import(). That's what this issue is about.

[richardeschloss]

Hi I'm interested in the progress of this issue but thought I'd chime in. I'm actually able to get tests to successfully run on ava when the package type is "module". However, I'm struggling to gain coverage with nyc.

As a very simple example, suppose I have src file:
./src/hello.js:

export function hello() {
  return 'world';
}

And my test:
./test/hello.js:

import test from 'ava'
import { hello } from '../src/hello.js''

test('see me', (t) => {
  t.is(hello(), 'world')
})

package type is set to "module". node version 14.16.0.

The result: passing tests.

now, when I try to gather code coverage, running nyc ava on it's own fails to cover the files.

.nycrc:

{
  "all": false,
  "reporter": ["html", "text"],
  "exclude": ["node_modules"],
  "include": ["src/hello.js"],
  "extension": [".js"]
}

I tried using Istanbul's "esm-loader":

cross-env 'NODE_OPTIONS=--experimental-loader @istanbuljs/esm-loader-hook' nyc ava

I appreciate your help with this issue!

[richardeschloss]

For what it's worth, I was able to get coverage with the existing .nycrc using c8.

c8 ava ## worked with the same .nycrc as before.

[vjpr]

Just use --experimental-loader. Good docs here: https://nodejs.org/api/esm.html#esm_loaders

Is there a workaround at the moment?