Latest deployment(1.0.0) broken ESM import in Jest/Enzyme

[CodeMedic42]

I have a library which I just converted over to ESM(forced to because of another dependency). It took a LONG time to get it all working(stupid ecosystem change). But since the latest update to cheerio my Jest tests are failing. I am not sure what changed in cheerio as I do not use it directly. I use enzyme which has a dependency on cheerio. All this will make giving a working example VERY difficult. I can give you the error I am getting and I can try and give you the particulars of my set up. If there is anything else I can give you please let me know.

Here is the error

Must use import to load ES Module: /Users/me/source/.../my-project/node_modules/.pnpm/[email protected]/node_modules/cheerio/dist/browser/index.js

Here is roughly my setup

packge.json

{
    ...
    "scripts": {
        "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js",
    },
    "devDependencies": {
        "@jest/globals": "^29.7.0",
        "enzyme": "3.11.0",
        "enzyme-adapter-react-16": "1.15.7",
        "jest": "^29.7.0",
        "jest-environment-jsdom": "29.7.0",
        "ts-jest": "^29.1.5",
        "typescript": "^5.4.5",
    }
}

jest.config.mjs

import path from 'path';
import { fileURLToPath } from 'url';

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

export default {
  passWithNoTests: true,
  preset: 'ts-jest',
  testEnvironment: 'jsdom',
  extensionsToTreatAsEsm: ['.ts', '.tsx'],
  transform: {
    '^.+\\.m?[tj]sx?$': [
      'ts-jest',
      {
        useESM: true,
      },
    ],
  },
  setupFilesAfterEnv: [
    path.join(__dirname, 'setup.mjs')
  ],
  moduleNameMapper: {
    '^uuid$': '<rootDir>/node_modules/uuid/wrapper.mjs'
  }
};

setup.mjs

import { jest } from '@jest/globals';

import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });

const enzymeMountPoint = window.document.createElement('div');
enzymeMountPoint.setAttribute('id', 'enzyme-mount-point');
document.body.appendChild(enzymeMountPoint);

let wrapper = null;

// eslint-disable-next-line no-undef
global.beforeEach(() => {
    console.log = jest.fn();
    console.warn = jest.fn();
});

// eslint-disable-next-line no-undef
global.afterEach(() => {
    if (wrapper === null || wrapper === undefined) {
        return;
    }

    wrapper.detach();

    wrapper = null;
});

function mountTo(component) {
    wrapper = Enzyme.mount(component, { attachTo: enzymeMountPoint })

    return wrapper;
}

global.mountTo = mountTo;

tsconfig.json

{
    "compilerOptions": {
        "target": "es2020",
        "lib": ["ES2020", "DOM", "DOM.Iterable"],
        "module": "ES2020",
        "moduleResolution": "Bundler",
        "jsx": "react-jsx",
        "baseUrl": "./src",
        "noEmit": true,
        "isolatedModules": true,
        "esModuleInterop": true,
        "strict": true,
        "skipLibCheck": true,
        "checkJs": false,
        "allowJs": true
    },
    "include": ["**/*", "*"],
}

[carystanley]

I have been experiencing a similar issue with the latest release of cheerio:

enzymejs/enzyme#2609

Enzyme was first implemented against cheerio @ 1.0.0-rc.3 which was published 5 years ago

But cheerio must have changed how things were exported right before the 1.0.0 release

[Alevale]

Related to what we are all experiencing in my group since the version 1.0.0 was released.

Seems like this has really taken all the depending packages by surprise, breaking things, yet no answer by the library maintainers (have a look at what we're suggesting in #3993 )

[CodeMedic42]

At the moment I have resolved this by forcing our package manager(pnpm) to use a specific version of cheerio.

In the root package.json we have this.

{
    "pnpm": {
        "overrides": {
            "cheerio": "1.0.0-rc.12"
        },
}

My problem went away.

This obviously has a negative side effect for forcing ANYTHING using cheerio to use this version, so use carefully. Also it will always use this version until you remove it. Be sure to reevaluate this issue periodically to see if it has been resolved and you can remove this constraint. All very obvious statements but I like to be through.

[Alevale]

This is a good temporary workaround. I don't think it's a good practice to ask for all the community (those 8 Million downloads) to implement this in their package.json till they can migrate their codebase to whatever cheerio wants with their new version.

If the maintainers of cheerio think it is ok, because they had the RC flag on in their package for 7 years they are missing the bigger picture.

[nagendra-ks]

Hi, is this issue fixed ?? is the below error because of broken import in Jest/Enzyme ??

Currently I'm getting below error when i try to run "npm run test"

Test suite failed to run

ENOENT: no such file or directory, open 'node:stream'

  3 | import "raf/polyfill";
  4 |
> 5 | import Enzyme from 'enzyme';
    | ^

i tried installing the package multiple times but no use. Can anyone reply ?