Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Dec 17, 2025

React 19 requires explicit initial values for useRef. Previously valid patterns like useRef<HTMLElement>() now fail type checking.

Changes

React upgrade

  • Upgraded react and react-dom to ^19.2.3
  • Upgraded @types/react and @types/react-dom to ^19.2.3 (matching versions with runtime packages, using caret prefix per project convention)

Type fixes

  • Added explicit undefined initial values to useRef<HTMLElement>() calls in ModelAlertsResults.tsx and MethodRow.tsx
  • Updated useScrollIntoView signature to accept RefObject<E | null> instead of RefObject<HTMLElement>
  • Updated ref prop types in AlertTableResultRow, AlertTablePathRow, and AlertTablePathNodeRow to include | null
  • Updated test mocks to match new ref types

Configuration

  • Fixed ESLint config: ensured reactHooks.configs.flat['recommended-latest'] is used for flat config compatibility (the non-flat config uses old eslintrc format which is incompatible with ESLint flat config)

Example

Before:

const ref = useRef<HTMLElement>();  // Type error in React 19

After:

const ref = useRef<HTMLElement | undefined>(undefined);  // OK

Remember to update the changelog if there have been user-facing changes!

Original prompt

Update the codebase in /extensions/ql-vscode and any affected parts to address all type errors caused by the React v19.2 upgrade, as visible in the CI checks. Specifically, address issues involving useRef now requiring a default value (so types like useRef() are no longer allowed; instead, useRef<T | undefined>(undefined)). Update downstream code to handle T | undefined as necessary, including code expecting T or directly accessing ref.current. Make sure to reference Robert's comments in #4131 for more guidance and code locations. Ensure all CI tests are passing and the extension works as expected after the fixes.

This pull request was created from Copilot chat.


💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

Copilot AI and others added 5 commits December 17, 2025 10:07
Co-authored-by: d10c <9970661+d10c@users.noreply.github.com>
Co-authored-by: d10c <9970661+d10c@users.noreply.github.com>
Co-authored-by: d10c <9970661+d10c@users.noreply.github.com>
…ependabot merge)

Co-authored-by: d10c <9970661+d10c@users.noreply.github.com>
…erability

Co-authored-by: d10c <9970661+d10c@users.noreply.github.com>
Copilot AI changed the title [WIP] Update codebase for React v19.2 type errors Fix React 19 type errors for useRef hooks Dec 17, 2025
Copilot AI requested a review from d10c December 17, 2025 10:37
- Upgrade react and react-dom from 18.3.1 to 19.2.3
- Upgrade @types/react and @types/react-dom to 19.2.3 (matching versions)
- Fix useRef hooks to include explicit initial values (React 19 requirement)
- Update ref prop types to handle React 19's stricter null handling
- Fix eslint config for reactHooks.configs compatibility

Co-authored-by: d10c <9970661+d10c@users.noreply.github.com>
Copilot AI requested a review from d10c December 17, 2025 11:05
The previous change removed the .flat accessor which caused ESLint to use
the old eslintrc format config (with plugins as array of strings) instead
of the flat config format (with plugins as object). This led to CI failures.

Co-authored-by: d10c <9970661+d10c@users.noreply.github.com>
Copilot AI requested a review from d10c December 17, 2025 12:35
Updated react, react-dom, @types/react, and @types/react-dom to use
"^19.2.3" instead of "19.2.3" to match the convention used by other
dependencies in the project.

Co-authored-by: d10c <9970661+d10c@users.noreply.github.com>
Copilot AI requested a review from d10c December 17, 2025 13:50
@d10c d10c changed the title Fix React 19 type errors for useRef hooks Upgrade React to v19.2.3 (and fix type errors in useRef hooks) Dec 17, 2025
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.

2 participants