[Bug]: Error: Requiring @playwright/test second time

[LiamLamb]

Version

1.48.1

Steps to reproduce

Important The problem is with Playwright's extension rather than the Playwright package. I looked at creating an issue in playwright-vscode, but it doesn't look like I can submit issues there.

Here is a link to a repository I have created to demonstrate this issue: https://github.com/LiamLamb/playwright-shared

Please see the main ReadMe in the repository for instructions on setting things up.

I have two branches:

• main to demonstrate a working configuration
• shared-fixture to demonstrate the issue.

Expected behavior

On the main branch:

• The tests pass from the terminal
• The tests pass from the testing window

On shared-fixture:

• The tests pass from the terminal
• The tests pass from the testing window

Actual behavior

On the main branch:

• The tests pass from the terminal
• The tests pass from the testing window

On shared-fixture:

• The tests pass from the terminal
• The tests failed from the testing window with the following output:

Error: Requiring @playwright/test second time, 
First:
Error: 
    at Object.<anonymous> (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\index.js:69:33)
    at Module._compile (node:internal/modules/cjs/loader:1469:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1548:10)
    at Object.i.<computed>.ut._extensions.<computed> [as .js] (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\utilsBundleImpl.js:16:1010)
    at Module.load (node:internal/modules/cjs/loader:1288:32)
    at Function.Module._load (node:internal/modules/cjs/loader:1104:12)
    at Module.require (node:internal/modules/cjs/loader:1311:19)
    at require (node:internal/modules/helpers:179:18)
    at Object.<anonymous> (c:\Projects\Github\playwright-shared\node_modules\playwright\test.js:17:13)
    at Module._compile (node:internal/modules/cjs/loader:1469:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1548:10)
    at Object.i.<computed>.ut._extensions.<computed> [as .js] (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\utilsBundleImpl.js:16:1010)
    at Module.load (node:internal/modules/cjs/loader:1288:32)
    at Function.Module._load (node:internal/modules/cjs/loader:1104:12)
    at Module.require (node:internal/modules/cjs/loader:1311:19)
    at require (node:internal/modules/helpers:179:18)
    at Object.<anonymous> (c:\Projects\Github\playwright-shared\node_modules@playwright\test\index.js:17:18)
    at Module._compile (node:internal/modules/cjs/loader:1469:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1548:10)
    at Object.i.<computed>.ut._extensions.<computed> [as .js] (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\utilsBundleImpl.js:16:1010)
    at Module.load (node:internal/modules/cjs/loader:1288:32)
    at Function.Module._load (node:internal/modules/cjs/loader:1104:12)
    at Module.require (node:internal/modules/cjs/loader:1311:19)
    at require (node:internal/modules/helpers:179:18)
    at Object.<anonymous> (c:\Projects\Github\playwright-shared\packages\app-1\playwright.config.ts:1:1)
    at Module._compile (node:internal/modules/cjs/loader:1469:14)
    at Module.f._compile (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\utilsBundleImpl.js:16:994)
    at Module._extensions..js (node:internal/modules/cjs/loader:1548:10)
    at Object.i.<computed>.ut._extensions.<computed> [as .ts] (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\utilsBundleImpl.js:16:1010)
    at Module.load (node:internal/modules/cjs/loader:1288:32)
    at Function.Module._load (node:internal/modules/cjs/loader:1104:12)
    at Module.require (node:internal/modules/cjs/loader:1311:19)
    at require (node:internal/modules/helpers:179:18)
    at requireOrImport (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\transform\transform.js:231:18)
    at loadUserConfig (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\common\configLoader.js:94:83)
    at loadConfig (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\common\configLoader.js:105:28)
    at deserializeConfig (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\common\configLoader.js:91:10)
    at LoaderMain.loadTestFile (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\loader\loaderMain.js:43:20)
    at process.<anonymous> (c:\Projects\Github\playwright-shared\node_modules\playwright\lib\common\process.js:95:22)


Second: 
    at Object.<anonymous> (c:\Projects\Github\playwright-shared\node_modules\@playwright\test\index.js:17:18)
    at Object.<anonymous> (c:\Projects\Github\playwright-shared\packages\app-1\playwright.config.ts:1:1)
    at Object.<anonymous> (C:\Projects\Github\playwright-shared\node_modules\playwright\lib\index.js:64:11)
    at Object.<anonymous> (C:\Projects\Github\playwright-shared\node_modules\playwright\test.js:17:13)
    at Object.<anonymous> (C:\Projects\Github\playwright-shared\node_modules\@playwright\test\index.js:17:18)
    at Object.<anonymous> (C:\Projects\Github\playwright-shared\packages\shared\dist\src\sum.js:1:1)
    at Object.<anonymous> (C:\Projects\Github\playwright-shared\packages\shared\dist\src\index.js:1:1)
    at Object.<anonymous> (c:\Projects\Github\playwright-shared\packages\app-1\tests\example.test.ts:3:1)

Additional context

No response

Environment

Playwright extension version used: v1.1.7

See doctor output: ❯ npm doctor Connecting to the registry Ok

Checking npm version Ok current: v10.9.0, latest: v10.9.0

Checking node version Ok current: v20.18.0, recommended: v20.18.0

Checking configured npm registry Ok using default registry (https://registry.npmjs.org/)

Checking for git executable in PATH Ok C:\Program Files\Git\cmd\git.EXE

Checking for global bin folder in PATH Ok C:\Program Files\nodejs

[LiamLamb]

Referencing possible duplicate/related here: https://github.com/microsoft/playwright/issues/24564 https://github.com/microsoft/playwright/issues/24300 https://github.com/microsoft/playwright/issues/15819

[dgozman]

This looks very similar to #32959. @Skn0tt could you please verify whether this is already fixed on ToT?

[Skn0tt]

Agree, this looks very similar. I'll check.

[LiamLamb]

@Skn0tt I read through the related issue mentioned by @dgozman and noticed your comments about file paths and casing, particularly on Windows.

I just tried running through the reproduction repo I posted above on WSL. When opening vscode in WSL, everything works as expected (both from the CLI and the extension).

[LiamLamb]

Just for your information, in the meantime, I have a workaround that has unblocked me 🙂. For anyone else who lands on this, you can still create your shared package if you configure your projects like so:

• Install @playwright/test as a peer dependency in your shared project
• Install @playwright/test as a dev dependency for your projects at the workspace level

About creating shareable fixtures. I had previously been creating them as follows:

// In the shared project:
import { test } from "@playwright/test";

export type Fixture = {
  date: Date;
};

const fixture = test.extend<Fixture>({
  date: async ({}, use) => {
    await use(new Date());
  },
});

export { fixture };

// In the app-1 project:
import { fixture } from 'shared'

fixture.describe(...)

Taking this approach leads to the above error in the vscode testing window only (they work fine from the CLI).

However, what does work is exporting fixture factories, like so:

// In the shared project
import {
  TestType,
  PlaywrightTestArgs,
  PlaywrightTestOptions,
  PlaywrightWorkerArgs,
  PlaywrightWorkerOptions,
} from "@playwright/test";

interface Fixture {
  date: Date;
}

export const createDefaultFixture = (
  test: TestType<
    PlaywrightTestArgs & PlaywrightTestOptions,
    PlaywrightWorkerArgs & PlaywrightWorkerOptions
  >
) =>
  test.extend<Fixture >({
    date: async ({}, use) => {
      await use(new Date());
    },
  });


// In the app-1 project
import { test } from '@playwright/test';
import { createDefaultFixture } from 'shared';

const fixture = createDefaultFixture(test);

fixture.describe(...)

Injecting these parts into the factories like this seems to prevent Playwright from being imported multiple times. I haven't yet tried adding another app, say app-2 to see how it would behave having multiple apps using the shared library, but I don't think that would cause any issues.

That said, I am curious as to the impact this might have on global fixtures.

[Skn0tt]

I verified that https://github.com/microsoft/playwright-vscode/pull/538 fixes this. Closing as a duplicate of https://github.com/microsoft/playwright/issues/32959.

Thanks for the great repro, Liam! Also hat tip on the wonderful test name. I love this cover of the song: https://www.youtube.com/watch?v=fbyO9H7LSkQ

[LiamLamb]

Nice! Thanks for the quick turnaround on this, it's much appreciated.

What release should I keep an eye out for to get this fix?

And thanks for the link, that's a nice cover 🙂

[Skn0tt]

Keep an eye out on https://github.com/microsoft/playwright-vscode/releases. We're not yet sure when we'll release because there's some stuff to clean up before. You should be getting the auto-update into your VS Code right away once we release.

[Skn0tt]

There you go, release was just cut: https://github.com/microsoft/playwright-vscode/releases/tag/v1.1.11

[LiamLamb]

Nice! Legends 💪