Error: playwright.config.ts: Cannot import a typescript file from an esmodule

See original GitHub issue

Decided to create a new issue after seeing the one referenced below

having "type": "module" in package.json causes this error. And it seems it’s still supposed to work even with that in there.

The ‘fix’ below does indeed work.


I am now receiving this error after upgrading from 1.17.2 to 1.19.2

If I alter file node_modules/@playwright/test/lib/loader.js

  isModule = false;    // <---  force this to false
  if (isModule) {
    return await esmImport(); 
  }

then it starts working again.

Also using the generated playwright.config.ts file does not resolve this issue.

_Originally posted by @asdf23 in https://github.com/microsoft/playwright/issues/11755#issuecomment-1048380805_

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:14
  • Comments:15 (4 by maintainers)

github_iconTop GitHub Comments

8reactions
Robert-Nickelcommented, Mar 16, 2022

Same issue. The manual “fix” you proposed “worked”. I just started out experimenting with playwright in my existing SvelteKit project - with this issue causing a not so great experience tbh.

EDIT: For my GitHub Action I used run: sed -i 's/if (isModule)/if (false)/g' node_modules/@playwright/test/lib/loader.js to replace that variable (as @jordevorstenbosch proposed) after installing dependencies.

3reactions
dragonworxcommented, Aug 3, 2022

I was trying Playwright with Vite and TypeScript. I used the vanilla-ts project sample and followed the intro docs for Playwright but when I tried to run the example test with:

npx playwright test

I received this error:

TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for /Users/alichamas/Github/playwright-test/playwright.config.ts
    at new NodeError (internal/errors.js:322:7)
    at Loader.defaultGetFormat [as _getFormat] (internal/modules/esm/get_format.js:71:15)
    at Loader.getFormat (internal/modules/esm/loader.js:105:42)
    at Loader.getModuleJob (internal/modules/esm/loader.js:243:31)
    at Loader.import (internal/modules/esm/loader.js:177:17)
    at Loader._requireOrImport (/Users/alichamas/Github/playwright-test/node_modules/@playwright/test/lib/loader.js:287:28)
    at Loader._requireOrImportDefaultObject (/Users/alichamas/Github/playwright-test/node_modules/@playwright/test/lib/loader.js:302:18)
    at Loader.loadConfigFile (/Users/alichamas/Github/playwright-test/node_modules/@playwright/test/lib/loader.js:79:20)
    at Runner.loadConfigFromResolvedFile (/Users/alichamas/Github/playwright-test/node_modules/@playwright/test/lib/runner.js:96:12)
    at runTests (/Users/alichamas/Github/playwright-test/node_modules/@playwright/test/lib/cli.js:153:27)
    at Gr.<anonymous> (/Users/alichamas/Github/playwright-test/node_modules/@playwright/test/lib/cli.js:70:7) {
  code: 'ERR_UNKNOWN_FILE_EXTENSION'
}

Turns out having "type": "module" in my package.json was causing the issue. This was part of the default Vite setup but it seems you can swap this with "type": "commonjs" and then Playwright will run, as well as Vite building and hot-reloading fine.

Read more comments on GitHub >

github_iconTop Results From Across the Web

TypeScript + Playwright Error: Cannot find module
@playwright/test does not consider your tsconfig.json when transpiling your TS files (thats why your custom path mapping is not working).
Read more >
Error: playwright.config.ts: Cannot import a ... - Issues Antenna
Decided to create a new issue after seeing the one referenced below. having "type": "module" in package.json causes this error.
Read more >
Configuring Jest
The configuration file should simply export an object: JavaScript; TypeScript. /** @type {import('jest').Config} */
Read more >
TypeScript errors and how to fix them
error TS1208: 'index.ts' cannot be compiled under '–isolatedModules' because it is considered a global script file. Add an import, export, or an empty...
Read more >
Error [ERR_MODULE_NOT_FOUND]: Cannot find module in JS
json file, but omit the file extension when importing. To solve the error, specify the extension when importing local files. error module not...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found