Coder Social home page Coder Social logo

[Bug, Regression]: Dynamic Import of ES Module fails in Playwright v1.44.1 and 1.43.1 (works in v1.42.1 and below) about playwright HOT 7 CLOSED

MindaugasMateika avatar MindaugasMateika commented on September 27, 2024 1
[Bug, Regression]: Dynamic Import of ES Module fails in Playwright v1.44.1 and 1.43.1 (works in v1.42.1 and below)

from playwright.

Comments (7)

superhit0 avatar superhit0 commented on September 27, 2024 1

I am facing this issue too. While debugging, I noticed that after this change the code started breaking - b41b802#diff-0f8a2f313f1572108f59a6e84663858ebb4fc455163410526b56878794001103R243

However, I have unblocked myself by doing a yarn patch and by changing back exts for Pirates back to

{ exts: ['.ts', '.tsx', '.js', '.jsx', '.mjs'] }

Waiting for 1.45

Root Cause:

  • With cjs and other file types being transpiled now, @babel/plugin-syntax-dynamic-import is converting the dynamic imports to require and one cannot require an EJS module from CJS module

from playwright.

askoufis avatar askoufis commented on September 27, 2024

I'm seeing this error too when upgrading playwright. Given the stack trace, my guess is that #29644 might be the cause of the regression.

from playwright.

mxschmitt avatar mxschmitt commented on September 27, 2024

Happy to look into import/require regressions, but looking at the @braze/web-sdk module, it says:

Note: The Braze Web SDK is meant to be used client-side in a web application and may not work as expected in a Node.js server environment.

also it requires a navigator.platform/userAgent to be set. Do you encounter this in combination with component testing?


@askoufis do you depend on the same module?

from playwright.

askoufis avatar askoufis commented on September 27, 2024

Happy to look into import/require regressions, but looking at the @braze/web-sdk module, it says:

Note: The Braze Web SDK is meant to be used client-side in a web application and may not work as expected in a Node.js server environment.

also it requires a navigator.platform/userAgent to be set. Do you encounter this in combination with component testing?

@askoufis do you depend on the same module?

@mxschmitt Nope. In my case, a dynamic import of an ES Module is being converted into a require, resulting in a similar error to what the OP is experiencing. I can try make a minimal reproduction when I get a chance.

from playwright.

askoufis avatar askoufis commented on September 27, 2024

@mxschmitt I've made a reproduction of my specific situation. https://github.com/askoufis/playwright-31140-reproduction

Notably, the test file imports from a .cjs file, which itself dynamically imports from a .mjs file.

This used to work on @playwright/[email protected], but has broken as of @playwright/[email protected]. Setting type: "module" in the test module's package.json fixes the issue in 1.43.0, though that may not be a viable solution for all situations.

from playwright.

MindaugasMateika avatar MindaugasMateika commented on September 27, 2024

Happy to look into import/require regressions, but looking at the @braze/web-sdk module, it says:

Note: The Braze Web SDK is meant to be used client-side in a web application and may not work as expected in a Node.js server environment.

also it requires a navigator.platform/userAgent to be set. Do you encounter this in combination with component testing?

@askoufis do you depend on the same module?

It is client side lib but we are using it in node, user agent and platform are mocked by setting those values on global. It's working well up until 1.43 version. I suppose what's used does not really matter, it's just that dynamic imports are converted to require based on error message. @askoufis repro makes more sense.

from playwright.

mxschmitt avatar mxschmitt commented on September 27, 2024

Thank you @askoufis as well!

Looking at this smaller repro, changing the test file to a normal Node.js script file:

const { getFoo } = require("./module1.cjs");

(async () => {
  const foo = await getFoo();
  console.log({ foo })
})();

shows that its working without Playwright. Playwright should behave always identical to Node.js, in this case it works in Node.js while it doesn't with Playwright.

We'll look into it.

from playwright.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.