Support Jest 29

[molily]

This updates all dependencies, drops support for Jest 26 and adds support for Jest 29.

Jest 26 support is dropped because jest-watch-typeahead has a peer dependency on Jest 27+.

I'm using a shared Babel config and need to transform preact and preact-render-to-string, which are pure ESM modules.

Let me know if this makes sense.

[molily]

@rschristian @marvinhagemeister Could you probably have a look at these changes? Thanks.

[rschristian]

I'd say I'm a bit apprehensive about this.

Jest 28 brought with it the ability resolve package exports., Notably, it will consume exports.browser in jsdom environments while applying (incorrectly) Node import semantics (pkg type and cjs/mjs). This causes import errors in many packages, including preact.

Edit: To clarify, not apprehensive about your work here, but in moving to Jest 28 at this time.

[josephwynn-sc]

Is this preset likely to support Jest 29 in the near future? I'm currently having to wire things up manually, but I'd prefer to use an official preset.

[rschristian]

Sorry for the long delay here.

I'm using a shared Babel config and need to transform preact and preact-render-to-string, which are pure ESM modules.

I'm not quite sure what you mean; neither are pure ES modules. Both ship CJS and ESM.

Re: Jest 28 + jsdom, I'm told the following can help (though haven't tested myself)

{
  "testEnvironmentOptions": {
    "customExportConditions": [
      "node",
      "node-addons"
    ]
  }
}

[rschristian]

This isn't to load the CJS output, no. As mentioned, Jest (w/ jsdom) will consume Preact's browser build while (incorrectly) applying Node extension semantics -- i.e., .js in a non-"type": "module" project will be treated as CJS.

What we need to do is ensure Jest doesn't consume the browser build, despite this being a mistake on their end. Users can still get ESM, just through the "import" condition instead.

preactjs/preact#3634

[molily]

Sorry for the long delay here.

I'm using a shared Babel config and need to transform preact and preact-render-to-string, which are pure ESM modules.

I'm not quite sure what you mean; neither are pure ES modules. Both ship CJS and ESM.

Re: Jest 28 + jsdom, I'm told the following can help (though haven't tested myself)

{
  "testEnvironmentOptions": {
    "customExportConditions": [
      "node",
      "node-addons"
    ]
  }
}

This seems to work, thanks a lot! I could rewind most of my changes, what's left is this snippet and some eslint config changes necessary because of the dependency update.

[rschristian]

Oh good!

But never mind, don't bother reverting. Need to bump those things at some point.

[rschristian]

I think we also need to move jest-environment-jsdom to a dependency (as opposed to the devDependency that it is right now)? I went to try this out and ran into the following error:

● Validation Error:

  Test environment jest-environment-jsdom cannot be found. Make sure the testEnvironment configuration option points to an existing node module.

  Configuration Documentation:
  https://jestjs.io/docs/configuration


As of Jest 28 "jest-environment-jsdom" is no longer shipped by default, make sure to install it separately.

[rschristian]

Thanks!

[molily]

Thank you too! 🥳

[molily]

I've been running our tests with 58b961c and suddenly unrelated tests fail. To be specific, we have Preact and Svelte front-end component tests in one project. The update of jest-preset-preact makes some Svelte tests fail because the onMount hook in Svelte components is not called any longer. I guess the reason is:

{
  "testEnvironmentOptions": {
    "customExportConditions": [
      "node",
      "node-addons"
    ]
  }
}

This also seems to affect the loading of the Svelte library. Since the "node" export is loaded instead of the "browser" export, the server-side renderer gets active instead of the client-side renderer. But in the Jest/jsdom environment, my tests expect the client-side renderer.

Minimal demo is here:
https://github.com/molily/jest-preset-preact-test (onMount not called)
https://github.com/molily/jest-preset-preact-test/tree/original-pr (onMount is called – my original PR)

Do you have any ideas how to solve this? Thanks!

[rschristian]

Makes sense, and maybe this change wasn't optimal to land. While Preact doesn't have any differences in its browser and ESM builds, others could. However, so long as Jest w/ jsdom continues to apply Node semantics to non-Node exports, there's gonna be an issue.

I don't use Jest, but any chance there's a way to set export conditions for a particular module? So we can ensure Preact's Node ESM build gets loaded instead of the browser?

Edit: Took a look around, ended up opening jestjs/jest#13820