Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update withErrorBoundary types for forwards compat #211

Merged
merged 2 commits into from
Dec 21, 2024

Conversation

henryqdineen
Copy link
Contributor

@henryqdineen henryqdineen commented Dec 17, 2024

What:

This PR updates the withErrorBoundary() to work with newer versions of @types/react

Why:

In @types/[email protected] (original PR) there was a change published to the forwardRef type that is incompatible with withErrorBoundary. It results in this error:

Argument of type '(props: Props, ref: ForwardedRef<ComponentType<Props>>) => React.CElement<ErrorBoundaryProps, ErrorBoundary>' is not assignable to parameter of type 'ForwardRefRenderFunction<ComponentType<Props>, PropsWithoutRef<Props>>'.
  Types of parameters 'props' and 'props' are incompatible.
    Type 'PropsWithoutRef<Props>' is not assignable to type 'Props'.
      'PropsWithoutRef<Props>' is assignable to the constraint of type 'Props', but 'Props' could be instantiated with a different subtype of constraint 'object'.
        Type 'object' is not assignable to type 'Props'.
          'object' is assignable to the constraint of type 'Props', but 'Props' could be instantiated with a different subtype of constraint 'object'.ts(2345)

My understanding is that the props argument of the forwardRef callback expects to not have a ref property but the Props extends Object constraint does not guarantee that. I initially tried to just remove the type annotation on the props argument so it will be inferred as React.PropsWithoutRef<Props> but I ran into other errors like Argument of type 'PropsWithoutRef<Props> & { ref: ForwardedRef<ComponentType<Props>>; }' is not assignable to parameter of type '(Attributes & Props) | null | undefined'.

My solution here to was refactor a bit and make the withErrorBoundary HOC be parameterized by the component type instead of props type. I also fixed the implementation to use ComponentRef<> since the ref will not always be a ComponentType<>. I believe this will be a breaking TypeScript change to anybody providing a type argument to withErrorBoundary() and the return type will be different.

How:

Checklist:

  • Documentation
  • Tests
  • Ready to be merged

Copy link
Owner

@bvaughn bvaughn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this change is okay, though it sounds like I'll need to make a new major release since it's backwards breaking. I appreciate the contribution and the explanation.

@bvaughn bvaughn merged commit 4368fc0 into bvaughn:master Dec 21, 2024
3 checks passed
@bvaughn
Copy link
Owner

bvaughn commented Dec 21, 2024

Published in version 5.0.0

@httpete-broadcom
Copy link

httpete-broadcom commented Dec 23, 2024

Really should notify folks to update their @types/react to 18.3.18 or higher.

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.

3 participants