require() of ES Module not supported
borisyordanov opened this issue · 9 comments
I tried to use this package in a turborepo monorepo, but it breaks playwright.
I set up an MRE here - https://github.com/borisyordanov/playwright-firebase-mre
To reproduce:
- Clone the repo
- run
npm i - run
npx playwright test
You should see this error
Error: require() of ES Module /home/dev/pw-test/my-turborepo/node_modules/@nearform/playwright-firebase/dist/index.js from /home/dev/pw-test/my-turborepo/auth.setup.ts not supported.
Instead change the require of index.js in /home/dev/pw-test/my-turborepo/auth.setup.ts to a dynamic import() which is available in all CommonJS modules.
Same issue
Same issue. @borisyordanov where you ever able to resolve?
@borisyordanov the MRE doesn't have any Playwright tests. Can you please update it with tests which can help us reproduce the issue?
@borisyordanov Haven't tested this, but I can see in your package.json you don't have "type"="module". Can you try this?
Apologies for the late reply and the sloppy MRE(I forgot to push my tests before submitting this issue 🤦🏼).
The tests have been added and you can now follow the reproduction steps @vikasbhandari2
@Ademsk1 Setting "type"="module" changes the error to
I opened a PR where I made the tests work simply by removing nearform/playwright-firebase https://github.com/borisyordanov/playwright-firebase-mre/pull/1/files
What are your thoughts on adding it to the README that the package is ESM only?
Also, if we aren't targeting ESM only setups then we might want to export hybrid assets since the current issue is just the typescript compiler trying to require an ESM
If we wish to move the ESM direction: #229
I wouldn't have a problem with that, although I'm not 100% sure that this is the issue, because being this a playwright plugin I suspect that the way playwright loads plugins may be part of the issue. If there isn't a simple solution, I am in favor of making this ESM-only, in which case we also need to find a good way to communicate that so that people aren't misled into thinking that it would work with CJS.
Note though that since we're using TS, maybe it wouldn't be too complicated to support both ESM and CJS but having TS build two different versions of the sources.
The TS server warns about the issue and the repro doesn't have a "type":"module", adding the type raises the extension missing issue that #229 fixes
Playwright respects the package.json and tsconfig.json configuration, which will transform the module based on that. (Uses babel plugins for that)
Which means the final resolution still ends up being a commonjs require instead of an import call.
Resources:
https://github.com/microsoft/playwright/blob/289127d523d7f49ca460f73fa65283f14d06b4de/packages/playwright/src/transform/transform.ts#L187
https://github.com/microsoft/playwright/blob/289127d523d7f49ca460f73fa65283f14d06b4de/packages/playwright/bundles/babel/src/babelBundleImpl.ts#L102
Note though that since we're using TS, maybe it wouldn't be too complicated to support both ESM and CJS but having TS build two different versions of the sources.
We can, I would also like to understand if there's a preference to the distribution package. If not, I'll just go ahead with the one I know works decently across most setups.