[Bug]: ReactJS 18 compatibility "ReactDOM.render is no longer supported in React 18" #367
Labels
Comments
|
Should just be a case of updating inject to use the new |
kimo-k
added a commit
that referenced
this issue
Jul 3, 2023
React 18 gives a deprecation warning if you use the old rdom/render api. The reagent.dom.client namespace wraps this new API. It also enables experimental React 18 features in reagent. It's acceptable (and possibly more stable) to keep using the old API, but this deprecation warning can be confusing to the user, who shouldn't need to be aware of our inlined-deps situation. It looks as if their reagent code is suspect, when actually ours is. Updated to the new API. We don't use any other React 18 features yet. #367
kimo-k
added a commit
that referenced
this issue
Jul 3, 2023
React 18 gives a deprecation warning if you use the old rdom/render api. The reagent.dom.client namespace wraps this new API. It also enables experimental React 18 features in reagent. It's acceptable (and possibly more stable) to keep using the old API, but this deprecation warning can be confusing to the user, who shouldn't need to be aware of our inlined-deps situation. It looks as if their reagent code is suspect, when actually ours is. Updated to the new API. We don't use any other React 18 features yet. #367
kimo-k
added a commit
that referenced
this issue
Jul 3, 2023
React 18 gives a deprecation warning if you use the old rdom/render api. The reagent.dom.client namespace wraps this new API. It also enables experimental React 18 features in reagent. It's acceptable (and possibly more stable) to keep using the old API, but this deprecation warning can be confusing to the user, who shouldn't need to be aware of our inlined-deps situation. It looks as if their reagent code is suspect, when actually ours is. Updated to the new API. We don't use any other React 18 features yet. #367
kimo-k
added a commit
that referenced
this issue
Oct 12, 2023
React 18 introduces a new render API: https://react.dev/blog/2022/03/29/react-v18#react-dom-client The reagent.dom.client namespace wraps this new API. reagent.dom still wraps the old one. React throws a deprecation warning if you use the old API with React 18. If a user uses the new API in their project, they will still get the warning because of re-frame-10x using the old API. This is confusing. It looks as if their code is suspect, when actually ours is. re-frame-10x depends on the user's react version. That means we can't predict whether the user will use React 17 or React 18, or which API they will invoke. We can't just load reagent.dom.client, because it only works with React 18. We can't load it conditionally based on the react version, since it's a general limitation of cljs that we can't require a namespace at runtime. Added a second preload namespace. Since only the user can know which API to use, we let them declare it themselves. The original preload remains unchanged: {:preloads [day8.re-frame-10x.preload]} It calls the old API, which works in all cases. It throws the deprecation warning if the user has React 18. The new preload only works with React 18, using the new API properly: {:preloads [day8.re-frame-10x.preload.react-18]} Fixes #367
kimo-k
added a commit
that referenced
this issue
Oct 23, 2023
React 18 introduces a new render API: https://react.dev/blog/2022/03/29/react-v18#react-dom-client The reagent.dom.client namespace wraps this new API. reagent.dom still wraps the old one. React throws a deprecation warning if you use the old API with React 18. If a user uses the new API in their project, they will still get the warning because of re-frame-10x using the old API. This is confusing. It looks as if their code is suspect, when actually ours is. re-frame-10x depends on the user's react version. That means we can't predict whether the user will use React 17 or React 18, or which API they will invoke. We can't just load reagent.dom.client, because it only works with React 18. We can't load it conditionally based on the react version, since it's a general limitation of cljs that we can't require a namespace at runtime. Added a second preload namespace. Since only the user can know which API to use, we let them declare it themselves. The original preload remains unchanged: {:preloads [day8.re-frame-10x.preload]} It calls the old API, which works in all cases. It throws the deprecation warning if the user has React 18. The new preload only works with React 18, using the new API properly: {:preloads [day8.re-frame-10x.preload.react-18]} Fixes #367
kimo-k
added a commit
that referenced
this issue
Oct 23, 2023
React 18 introduces a new render API: https://react.dev/blog/2022/03/29/react-v18#react-dom-client The reagent.dom.client namespace wraps this new API. reagent.dom still wraps the old one. React throws a deprecation warning if you use the old API with React 18. If a user uses the new API in their project, they will still get the warning because of re-frame-10x using the old API. This is confusing. It looks as if their code is suspect, when actually ours is. re-frame-10x depends on the user's react version. That means we can't predict whether the user will use React 17 or React 18, or which API they will invoke. We can't just load reagent.dom.client, because it only works with React 18. We can't load it conditionally based on the react version, since it's a general limitation of cljs that we can't require a namespace at runtime. Added a second preload namespace. Since only the user can know which API to use, we let them declare it themselves. The original preload remains unchanged: {:preloads [day8.re-frame-10x.preload]} It calls the old API, which works in all cases. It throws the deprecation warning if the user has React 18. The new preload only works with React 18, using the new API properly: {:preloads [day8.re-frame-10x.preload.react-18]} Fixes #367
|
I still get warning:
Comming from day8.re-frame-10x.inlined-deps.reagent.v1v2v0.reagent.dom LN 17
I'm using {:mvn/version "1.9.3"}:
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
What happened?
10x uses the old react API, which is not working in ReactJS 18. The following error message appears:
To do this, we need to use the new functions for this. I built a project supporting the new react version and dropped 10x for this project: https://github.com/schnaq/cljs-re-frame-full-stack/blob/main/src/main/app/interface/core.cljs#L63-L67
10x Version
1.3.0
Reagent Version
1.1.1
React Version
18.1.0
re-frame Version
1.2.0
What browsers are you seeing the problem on?
Chrome
Relevant console output
`Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: https://reactjs.org/link/switch-to-createroot`.The text was updated successfully, but these errors were encountered: