Closed Janpot closed 3 months ago
had a very similar issue, had to hardcode "@playwright/test": "1.22.2",
in my package.json
@Janpot This indeed does not work. The workaround is to either not use dynamic imports, or set "type": "module"
in your package.json
. Perhaps in the future we'll make it work out of the box.
I also suffer from this, many npm packages are moving to ESM only and using type: module
makes it very hard in my case, since I have some imports to my code and requires me to turn everything to ESM.
It would be very much appreciated if this worked out of the box, or there was a workaround to avoid transpilation (I'm assuming there must be), as I like Playwright a lot and have been using it happily for a long time.
I have a pretty robust workaround, which might be helpful to others as well. The workaround uses esbuild, but could work with other tools.
// deps.ts
import findCacheDir from "find-cache-dir";
import getPort from "get-port";
export { findCacheDir, getPort };
2. Install esbuild and add a pretest script.
```json
"pretest": "esbuild --platform=node deps.ts --bundle --outfile=deps.bundle.js",
deps.bundle
in tests.
import { findCacheDir, getPort } from "./deps.bundle";
If the dependencies get too large, you may get a warning like this and lose some Playwright features.
[BABEL] Note: The code generator has deoptimised the styling of /path/to/deps.bundle.js as it exceeds the max of 500KB.
This is the best I could do given the circumstances, let me know if you have a better solution.
@frontsideair curious what features are lost when that error appears? From what I understand, it's largely just a complaint from Babel that can be ignored.
It's been a while, but IIRC you lose the nice error messages when a test fails, that shows the test code that failed as a snippet.
Bump. I would like to connect TRPC to the project.
import { createTRPCProxyClient, httpBatchLink } from '@trpc/client';
import type { AppRouter } from '@agent-b2b/trpc/src/server/routers';
export default async function setupTrpcClient() {
const { default: superjson } = await import('superjson');
return createTRPCProxyClient<AppRouter>({
transformer: superjson,
links: [
httpBatchLink({
url: `http://localhost:2022`,
}),
],
});
}
I have the same issue
Playwright doesn't support ES moduels?? 🤔
So what, does https://github.com/microsoft/playwright/pull/31285 fixes it in v1.45.0?
I just tried using Component Testing with v1.46.1 and got this error right away:
> playwright test -c playwright-ct.config.ts
Error: require() of ES Module [...]\node_modules\.pnpm\@mdx-js+react@2.3.0_react@18.2.0\node_modules\@mdx-js\react\index.js from [...]\node_modules\.pnpm\@theme-ui+mdx@0.14.7_@emotion+react@11.11.4_@types+react@18.0.28_react@18.2.0__@mdx-js+react@_mbpdk4bezv7srjm4c3ytb2koyi\node_modules\@theme-ui\mdx\dist\theme-ui-mdx.cjs.dev.js not supported.
Instead change the require of index.js in [...]\node_modules\.pnpm\@theme-ui+mdx@0.14.7_@emotion+react@11.11.4_@types+react@18.0.28_react@18.2.0__@mdx-js+react@_mbpdk4bezv7srjm4c3ytb2koyi\node_modules\@theme-ui\mdx\dist\theme-ui-mdx.cjs.dev.js to a dynamic import() which is available in all CommonJS modules.
Context:
Code Snippet
Describe the bug
From the node.js docs
Yet, trying to load an ESM only package like
get-port
with a dynamic import statement fails with the error:It's complaining I'm trying to use
require
to load an ESM only module, but as can be seen in the snippet, it's animport()
.