[BUG] The requested module '@playwright/test' does not provide an export named 'createElement'

[AlessioGr]

System info

• Playwright Version: 1.37.1 (patched with custom loader to support esm, see https://github.com/microsoft/playwright/issues/26822. I don't think the loader is causing this particular issue, as it only handles svg/png/scss files.)
• Operating System: macOS 14.0
• Browser: any
• Other info:

Source code

• [X] I provided exact source code that allows reproducing the issue locally.

Link to the GitHub repository with the repro

https://github.com/payloadcms/payload/tree/2.0-esm/packages/payload/test/refresh-permissions

Steps

1. Clone the payload repository (2.0-esm branch)
2. Run pnpm install
3. Run pnpm test:e2e refresh-permissions

Expected

The test passes

Actual

The test fails with the following error:

The issue is triggered by returning the DefaultGlobalView component in the GlobalViewWithRefresh.tsx component included in the test. If I return anything else, e.g. a paragraph, the issue does not happen.

My hypothesis is that playwright, for some reason, compiles the component down into nonsense where somehow createElement is imported from @playwright/test instead of from React. Running the test directory directly (pnpm dev refresh-permissions) which doesn't use playwright works fine.

This has been happening ever since we migrated payload from cjs+yarn to esm+pnpm+monorepo.

[jmikrut]

Hey all, just a bump on this one. We have to maintain a patched copy of Playwright for Payload in order to get around this.

https://github.com/payloadcms/payload/blob/alpha/patches/playwright%401.42.1.patch

Any ideas for how we can work around this so we don't need to patch this?