mobx-react-lite observer(Component, {forwardRef: true}) doesn't seem to work

[bradleygore]

Intended outcome:

Expected to be able to render a component that is exported as observer(Component, {forwardRef: true})

Actual outcome:

Get error:

How to reproduce the issue:

Make a component that uses React.forwardRef, then export that component as export default observer(Component, {forwardRef: true});.

There is an issue that seems to be related, and I went by this comment in that thread to try the {forwardRef: true} option:
#2527 (comment)

However, that doesn't seem to work b/c the ref-forwarding component is an object and not a function:

Am I using this incorrectly, or should I just use mobx-react? I had been using mobx-react but we only use functional components so figured I'd switch to mobx-react-lite to get the smaller bundle.

Versions

• mobx-react-lite@3.2.3
• react@17.0.2

Thanks in advance 😄

[urugator]

Make a component that uses React.forwardRef, then export that component as export default observer(Component, {forwardRef: true});.

You shouldn't wrap the component with React.forwardRef prior passing it to lite's observer, the forwardRef: true wraps the component for you. This is different from mobx-react, that detects the component is already wrapped and rewraps the component. I will investigate if we can somehow improve this or at least throw a sensible error.

[bradleygore]

@urugator - oh, interesting. I did not realize this. Is this in the docs somewhere - my apologies if I overlooked that. Thank you for the explanation!