Added not about sync/batched root API being required
Brian Vaughn committed
Aug 6, 2019 at 08:57 UTC
e015e3d937ca21bf5e441f7af3f8b3d8b777b895
1 file changed
+7
-1
packages/react-devtools-inline/README.md
+7
-1
@@ -38,7 +38,7 @@ activate();
38
### `react-devtools-inline/frontend`
39
40
* **`initialize(contentWindow)`** -
41
-Configures the DevTools interface to listen to the `window` the backend was injected into. This method returns a React component that can be rendered directly.
41
+Configures the DevTools interface to listen to the `window` the backend was injected into. This method returns a React component that can be rendered directly<sup>2</sup>.
42
43
```js
44
import { initialize } from 'react-devtools-inline/frontend';
@@ -52,6 +52,8 @@ const contentWindow = iframe.contentWindow;
52
const DevTools = initialize(contentWindow);
53
```
54
55
+<sup>2</sup> Because the DevTools interface makes use of several new React APIs (e.g. suspense, concurrent mode) it should be rendered using either `ReactDOM.unstable_createRoot` or `ReactDOM.unstable_createSyncRoot`. It should not be rendered with `ReactDOM.render`.
56
+
57
## Examples
58
59
### Configuring a same-origin `iframe`
@@ -82,6 +84,8 @@ initializeBackend(contentWindow);
84
const DevTools = initializeFrontend(contentWindow);
85
86
// <DevTools /> interface can be rendered in the parent window at any time now...
87
+// Be sure to use either ReactDOM.unstable_createRoot()
88
+// or ReactDOM.unstable_createSyncRoot() to render this component.
89
90
// Let the backend know the frontend is ready and listening.
91
activateBackend(contentWindow);
@@ -124,6 +128,8 @@ const { contentWindow } = iframe;
128
129
// Initialize DevTools UI to listen to the iframe.
130
// This returns a React component we can render anywhere in the main window.
131
+// Be sure to use either ReactDOM.unstable_createRoot()
132
+// or ReactDOM.unstable_createSyncRoot() to render this component.
133
const DevTools = initialize(contentWindow);
134
135
// Let the backend know to initialize itself.