Skip to content

LOOM-2442 Pt 2 React 19 migration#4461

Draft
Simon Ward (Sybsw) wants to merge 1 commit into
LOOM-2442from
LOOM-2442_B
Draft

LOOM-2442 Pt 2 React 19 migration#4461
Simon Ward (Sybsw) wants to merge 1 commit into
LOOM-2442from
LOOM-2442_B

Conversation

@Sybsw
Copy link
Copy Markdown
Contributor

LOOM-2442

Finishes making the React 19 jest matrix green so it can be flipped to required.

  • react-transition-group nodeRef migration — R19 removed findDOMNode, which / fall back to without nodeRef. Added refs in 4 components:
    • BpkFloatingNotification — useRef on the wrapping
    • BpkDrawerContent — local nodeRef plus a setRefs callback that also forwards to the existing dialogRef prop
    • AnimateAndFade (banner-alert + info-banner) — class-field nodeRef injected onto the single-element child via cloneElement
  • withInfiniteScroll test stabilisation — wrapped updateData(...) and intersect() calls in act(async () => …) so state flushes deterministically across both React versions. Regenerated 3 snapshots that were
    latently stale on R18 (they were captured before the data refresh actually applied — the test name said "should refresh data" but the snapshot showed pre-refresh DOM).

All tests passing, snapshots working

npm run lint and npm run typecheck clean on both versions.

Follow-ups (not in this PR)

  • Flip the React19 CI job from continue-on-error: true to required after this lands and stays green on main for a run or two.
  • Remaining deferred items from LOOM-2442 Pt 1 React 19 Migration #4455 (class-component defaultProps, Flow prop-types removal, @types/react@19 bump) are independent threads.

Remember to include the following changes:

  • Ensure the PR title includes the name of the component you are changing so it's clear in the release notes for consumers of the changes in the version e.g [Clover-123][BpkButton] Updating the colour
  • README.md (If you have created a new component)
  • Component README.md
  • Tests
  • Accessibility tests
    • The following checks were performed:
      • Ability to navigate using a keyboard only
      • Zoom functionality (Deque University explanation):
        • The page SHOULD be functional AND readable when only the text is magnified to 200% of its initial size
        • Pages must reflow as zoom increases up to 400% so that content continues to be presented in only one column i.e. Content MUST NOT require scrolling in two directions (both vertically and horizontally)
      • Ability to navigate using a screen reader only
  • Storybook examples created/updated
  • For breaking changes or deprecating components/properties, migration guides added to the description of the PR. If the guide has large changes, consider creating a new Markdown page inside the component's docs folder and link it here

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant