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

Deprecate ReactDOM.render and ReactDOM.hydrate #21652

Merged
merged 2 commits into from
Jun 9, 2021

Conversation

acdlite
Copy link
Collaborator

@acdlite acdlite commented Jun 9, 2021

These are no longer supported in React 18. They are replaced by the createRoot API.

The warning includes a link to documentation of the new API. Currently it redirects to the corresponding working group post:

https://reactjs.org/link/switch-to-createroot

Many of our tests still use ReactDOM.render. We will need to gradually migrate them over to createRoot.

In the meantime, I added the warnings to our internal warning filter.

We have a warning filter for our internal tests to ignore warnings
that are too noisy or that we haven't removed from our test suite yet:
shouldIgnoreConsoleError.

Many of our server rendering tests don't use this filter, though,
because it has its own special of asserting warnings.

So I added the warning filter to the server tests, too.
These are no longer supported in React 18. They are replaced by the
`createRoot` API.

The warning includes a link to documentation of the new API. Currently
it redirects to the corresponding working group post. Here's the PR to
set up the redirect: reactjs/react.dev#3730

Many of our tests still use ReactDOM.render. We will need to gradually
migrate them over to createRoot.

In the meantime, I added the warnings to our internal warning filter.
@facebook-github-bot facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels Jun 9, 2021
@@ -10,6 +10,7 @@
'use strict';

const stream = require('stream');
const shouldIgnoreConsoleError = require('../../../../../scripts/jest/shouldIgnoreConsoleError');
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

Gross but oh well

@acdlite acdlite force-pushed the deprecate-legacy-root-api branch 2 times, most recently from 6d8823d to b5d54fa Compare June 9, 2021 20:20
@sizebot
Copy link

sizebot commented Jun 9, 2021

Comparing: 1a3f1af...0cc374a

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.min.js = 127.29 kB 127.29 kB = 40.81 kB 40.81 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js = 130.11 kB 130.11 kB = 41.75 kB 41.75 kB
facebook-www/ReactDOM-prod.classic.js = 404.72 kB 404.72 kB = 74.90 kB 74.90 kB
facebook-www/ReactDOM-prod.modern.js = 393.27 kB 393.27 kB = 73.09 kB 73.09 kB
facebook-www/ReactDOMForked-prod.classic.js = 404.72 kB 404.72 kB = 74.90 kB 74.90 kB

Significant size changes

Includes any change greater than 0.2%:

(No significant changes)

Generated by 🚫 dangerJS against 0cc374a

@acdlite acdlite force-pushed the deprecate-legacy-root-api branch from b5d54fa to 0cc374a Compare June 9, 2021 20:36
@acdlite acdlite merged commit aecb3b6 into facebook:master Jun 9, 2021
@@ -250,6 +259,15 @@ export function render(
container: Container,
callback: ?Function,
) {
if (__DEV__) {
console.error(
'ReactDOM.render is no longer supported in React 18. Use createRoot ' +
Copy link
Collaborator

Choose a reason for hiding this comment

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

Maybe use "ReactDOM.render is deprecated in React 18" instead for consistent messaging? "not supported" sounds like it's no longer working. Unless the other deprecation warnings also use "not supported" instead of "deprecated".

koto pushed a commit to koto/react that referenced this pull request Jun 15, 2021
* Use existing test warning filter for server tests

We have a warning filter for our internal tests to ignore warnings
that are too noisy or that we haven't removed from our test suite yet:
shouldIgnoreConsoleError.

Many of our server rendering tests don't use this filter, though,
because it has its own special of asserting warnings.

So I added the warning filter to the server tests, too.

* Deprecate ReactDOM.render and ReactDOM.hydrate

These are no longer supported in React 18. They are replaced by the
`createRoot` API.

The warning includes a link to documentation of the new API. Currently
it redirects to the corresponding working group post. Here's the PR to
set up the redirect: reactjs/react.dev#3730

Many of our tests still use ReactDOM.render. We will need to gradually
migrate them over to createRoot.

In the meantime, I added the warnings to our internal warning filter.
@@ -219,6 +219,15 @@ export function hydrate(
container: Container,
callback: ?Function,
) {
if (__DEV__) {
console.error(
'ReactDOM.hydrate is no longer supported in React 18. Use createRoot ' +
Copy link
Member

Choose a reason for hiding this comment

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

Is it weird that we say "no longer supported in React 18" as if it was ever supported in React 18?

Copy link
Member

Choose a reason for hiding this comment

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

ReactDOM.hydrate is deprecated in React 18.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants