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

Confusion with "your render function incorrectly returned a React Element (JSX)" #1667

Open
squadette opened this issue Dec 27, 2024 · 0 comments

Comments

@squadette
Copy link
Contributor

A bug is a crash or incorrect behavior. If you have a debugging or troubleshooting question, please open a discussion.

Environment

  1. Ruby version: 3.26
  2. Rails version: 6.1.7.0
  3. Shakapacker/Webpacker version: NONE
  4. React on Rails version: 13.3.5

Expected behavior

No warnings.

Actual behavior

I'm getting the following JS console warning:

"Your registered render-function (ReactOnRails.register) for RiverApp
incorrectly returned a React Element (JSX). Instead, return a React Function Component by
wrapping your JSX in a function. ReactOnRails v13 will throw error on this, as React Hooks do not work if you return JSX. Update by wrapping the result JSX of RiverApp in a fat arrow function.

First, this is already version 13, will it actually be throwing errors in 14.x? (I don't see clear signs in changelog.)

Second, I did like the warning says, but the warning does not go away:

const RiverApp = (props, railsContext) => (
    () => <Provider store={ReactOnRails.getStore('mokumStore')}>
        <River {...props} railsContext={railsContext} />
    </Provider>
);

ReactOnRails.register({ RiverApp });

If I remove () => in the second line, I get the same warning. The application works perfectly no matter what. Could the problem be with the diagnostics?

Small, reproducible repo

Not provided.

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

No branches or pull requests

1 participant