FAQ: migrate to jest 27/testing-library >=11

[Hotell]

Main purpose of this issue is to track issues related to jest/typescript/testing tools used.

Take this as main go to document, for person/team which is gonna tackle migration to jest26/latest testing library/typescript 4

---

Current state (August 2021):

Versions used within our monorepo:

• Jest 24
• TS 4.1
• testing-library/react: 10.4.9.

I wanna bump testing-library/react to v11

Now unblocked since we're using typescript 4.1 (>= 3.8), but not scheduled

Previous details:

@testing-library/react v11 has as direct dependency on @testing-library/dom version >=7.22.4:

• @testing-library/dom , starting version 7.22.4, has direct dependency on pretty-format 26.x
  • pretty-format 26.x:
    • uses TS 3.8 type syntax (thus making TSC explode as it parses unknown language syntax)
    • has direct dependency on @jest/types 26.x
    • @jest/types 26.x
      • uses TS 3.8 lang features as well (import type {} ...)

💡 NOTE:
As a consequence of @testing-library/react using dangerous ^ for its dom dependency, we need to explicitly anchor it by ourselves via yarn resolution field to version -> @testing-library/dom": "7.22.3"

✅ done! I wanna bump typescript to 3.9.x/4.1.x

this is done, expand for old notes

Upgrades to 3.8 and 3.9 were blocked by major bugs, which are fixed as of 4.0.

More details of what will be involved in the typescript 4 upgrade are in #16101. Unfinished draft PR at #16449.

Why:

• TS 3.8: would have to dig up details of what the blocking bug was
• TS 3.9: issues with TS and webpack caused major bundle size increases for consumers in this version
  • Consider emitting export {} in all ambiguous module output TypeScript#38696 - fixed in 4.0
  • Empty Module Exports Dramatically Affect Bundle Output webpack/webpack#10889
  • Message Elizabeth for link to internal upgrade attempt PR with more details

I wanna bump jest to 27

Now unblocked since we're using typescript 4.1 (>= 3.8), but not scheduled.

Tracked by #18442

Why:

Jest 26 uses export type which requires TS 3.8+.

On initial investigation, Jest 25 doesn't have these typing issues (at least with skipLibCheck). Though when upgrading related dependencies you have to be careful to avoid installing anything that pulls in Jest 26-series packages.

Jest 25+ (more specifically its version of jsdom) appears to be required for running tests against React 17.

Related release notes:

• Jest 25 release notes
• Jest 26 release notes
• Jest 27 release notes
• Full Jest changelog
• ts-jest changelog

[ecraig12345]

(EDIT: now added to main description)

We can't use TS 3.9 because (short version) it will cause massive bundle size increases for consumers. The issue is fixed in 4.0. (Message me if you want an internal link with more details.)
microsoft/TypeScript#38696
webpack/webpack#10889

There was also some bug blocking 3.8, though unfortunately I don't remember what that was.

On initial investigation, bumping jest to 25 is likely to be doable apart from a TS upgrade, and desirable because I think it will unblock testing with react 17. Not sure how much that helps with testing-library (and definitely the goal is to get to jest 26 soon!).

[ecraig12345]

@Hotell Should we close this now or repurpose to help track jest updates?

[Hotell]

let's keep it open, thx.

[ecraig12345]

Updated the description and title with current status--basically it's all unblocked now (at least from a typescript perspective) but nobody has had time to do it 😞