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

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_

About this issue

Original URL
State: closed
Created 2 years ago
Reactions: 16
Comments: 15 (4 by maintainers)

Most upvoted comments

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.

Robert-Nickel on Mar 16, 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.

dragonworx on Aug 3, 2022

@wvhulle are you using PW_EXPERIMENTAL_TS_ESM=1? That’s working fine for me in the latest playwright with up-to-date node version without changing my node_modules.

Sorry that still doesn’t work with version 1.25, I will make a reproduction.

wvhulle on Aug 28, 2022

@IanVS you probably figured it out:

import { test, expect, type Page } from '@playwright/test';

pavelfeldman on Apr 5, 2022

I can’t seem to import custom .ts file with "type": "module" and the env PW_EXPERIMENTAL_TS_ESM=1

Importing this in the playwright starter example.spec.ts results in Cannot find module error, (while it works otherwise)

import { text } from './coucou';

bleucitron on Mar 24, 2022

I’m just trying out playwright for the first time, and ran through the npm init playwright@latest flow. I hit the error referenced in this issue (I use vite, and type="module"), and so used PW_EXPERIMENTAL_TS_ESM=1 npx playwright test, but now I see:

import { test, expect, Page } from '@playwright/test';
                       ^^^^
SyntaxError: The requested module '@playwright/test' does not provide an export named 'Page'

I’m using node v16.13.1 and playwright 1.20.1.

Oh I see, it’s a type. I changed it to import { test, expect, type Page } from '@playwright/test'; and I’m back in business.

Maybe it would be best to break that out to its own line, to work with typescript configs like mine which set "importsNotUsedAsValues": "error",

IanVS on Mar 25, 2022

@jordevorstenbosch PW_EXPERIMENTAL_TS_ESM=1 npm run test ran for me without errors.

Note that starting with 1.21 you won’t need that environment variable

pavelfeldman on Mar 19, 2022

Could someone share a repro with me?

I’ve made one for you here:

https://github.com/jordevorstenbosch/sk-pw-issue

sk-pw-issue@0.0.1 test playwright test

Error: playwright.config.ts: Cannot import a typescript file from an esmodule.
    at errorWithFile (/Users/jorde/projects/private/sk-pw-issue/node_modules/@playwright/test/lib/util.js:194:10)
    at Loader._requireOrImport (/Users/jorde/projects/private/sk-pw-issue/node_modules/@playwright/test/lib/loader.js:253:119)
    at Loader.loadConfigFile (/Users/jorde/projects/private/sk-pw-issue/node_modules/@playwright/test/lib/loader.js:75:18)
    at runTests (/Users/jorde/projects/private/sk-pw-issue/node_modules/@playwright/test/lib/cli.js:174:39)
    at Command.<anonymous> (/Users/jorde/projects/private/sk-pw-issue/node_modules/@playwright/test/lib/cli.js:79:7)

jordevorstenbosch on Mar 17, 2022