hello
@@ -154,13 +155,13 @@ describe('ReactFlightDOM', () => {
}
// View
- function Message({result}) {
- return
;
+ function Message({response}) {
+ return
{response.readRoot().html};
}
- function App({result}) {
+ function App({response}) {
return (
Loading...}>
-
+
);
}
@@ -171,12 +172,12 @@ describe('ReactFlightDOM', () => {
writable,
webpackMap,
);
- let result = ReactFlightDOMClient.readFromReadableStream(readable);
+ let response = ReactFlightDOMClient.createFromReadableStream(readable);
let container = document.createElement('div');
let root = ReactDOM.createRoot(container);
await act(async () => {
- root.render(
);
+ root.render(
);
});
expect(container.innerHTML).toBe(
'
',
@@ -192,13 +193,13 @@ describe('ReactFlightDOM', () => {
}
// View
- function Message({result}) {
- return
{result.model.text}
;
+ function Message({response}) {
+ return
{response.readRoot().text}
;
}
- function App({result}) {
+ function App({response}) {
return (
Loading...}>
-
+
);
}
@@ -209,12 +210,12 @@ describe('ReactFlightDOM', () => {
writable,
webpackMap,
);
- let result = ReactFlightDOMClient.readFromReadableStream(readable);
+ let response = ReactFlightDOMClient.createFromReadableStream(readable);
let container = document.createElement('div');
let root = ReactDOM.createRoot(container);
await act(async () => {
- root.render(
);
+ root.render(
);
});
expect(container.innerHTML).toBe('
$1
');
});
@@ -228,13 +229,13 @@ describe('ReactFlightDOM', () => {
}
// View
- function Message({result}) {
- return
{result.model.text}
;
+ function Message({response}) {
+ return
{response.readRoot().text}
;
}
- function App({result}) {
+ function App({response}) {
return (
Loading...}>
-
+
);
}
@@ -245,12 +246,12 @@ describe('ReactFlightDOM', () => {
writable,
webpackMap,
);
- let result = ReactFlightDOMClient.readFromReadableStream(readable);
+ let response = ReactFlightDOMClient.createFromReadableStream(readable);
let container = document.createElement('div');
let root = ReactDOM.createRoot(container);
await act(async () => {
- root.render(
);
+ root.render(
);
});
expect(container.innerHTML).toBe('
@div
');
});
@@ -327,42 +328,44 @@ describe('ReactFlightDOM', () => {
};
// View
- function ProfileDetails({result}) {
+ function ProfileDetails({response}) {
+ let model = response.readRoot();
return (
- {result.model.name}
- {result.model.more.avatar}
+ {model.name}
+ {model.more.avatar}
);
}
- function ProfileSidebar({result}) {
+ function ProfileSidebar({response}) {
+ let model = response.readRoot();
return (
- {result.model.photos}
- {result.model.more.friends}
+ {model.photos}
+ {model.more.friends}
);
}
- function ProfilePosts({result}) {
- return
{result.model.more.posts}
;
+ function ProfilePosts({response}) {
+ return
{response.readRoot().more.posts}
;
}
- function ProfileGames({result}) {
- return
{result.model.more.games}
;
+ function ProfileGames({response}) {
+ return
{response.readRoot().more.games}
;
}
- function ProfilePage({result}) {
+ function ProfilePage({response}) {
return (
<>
(loading)}>
-
+
(loading sidebar)}>
-
+
(loading posts)}>
-
+
{e.message}
}>
(loading games)}>
-
+
@@ -372,12 +375,12 @@ describe('ReactFlightDOM', () => {
let {writable, readable} = getTestStream();
ReactFlightDOMServer.pipeToNodeWritable(profileModel, writable, webpackMap);
- let result = ReactFlightDOMClient.readFromReadableStream(readable);
+ let response = ReactFlightDOMClient.createFromReadableStream(readable);
let container = document.createElement('div');
let root = ReactDOM.createRoot(container);
await act(async () => {
- root.render(
);
+ root.render(
);
});
expect(container.innerHTML).toBe('
(loading)
');
diff --git a/packages/react-flight-dom-webpack/src/__tests__/ReactFlightDOMBrowser-test.js b/packages/react-flight-dom-webpack/src/__tests__/ReactFlightDOMBrowser-test.js
index dd99f31cdb..d33f965253 100644
--- a/packages/react-flight-dom-webpack/src/__tests__/ReactFlightDOMBrowser-test.js
+++ b/packages/react-flight-dom-webpack/src/__tests__/ReactFlightDOMBrowser-test.js
@@ -62,9 +62,10 @@ describe('ReactFlightDOMBrowser', () => {
}
let stream = ReactFlightDOMServer.renderToReadableStream(
);
- let result = ReactFlightDOMClient.readFromReadableStream(stream);
+ let response = ReactFlightDOMClient.createFromReadableStream(stream);
await waitForSuspense(() => {
- expect(result.model).toEqual({
+ let model = response.readRoot();
+ expect(model).toEqual({
html: (
hello
diff --git a/packages/react-noop-renderer/src/ReactNoopFlightClient.js b/packages/react-noop-renderer/src/ReactNoopFlightClient.js
index e2f9ad0df2..f92f24577f 100644
--- a/packages/react-noop-renderer/src/ReactNoopFlightClient.js
+++ b/packages/react-noop-renderer/src/ReactNoopFlightClient.js
@@ -14,20 +14,13 @@
* environment.
*/
-import type {ReactModelRoot} from 'react-client/flight';
-
import {readModule} from 'react-noop-renderer/flight-modules';
import ReactFlightClient from 'react-client/flight';
type Source = Array;
-const {
- createResponse,
- getModelRoot,
- processStringChunk,
- close,
-} = ReactFlightClient({
+const {createResponse, processStringChunk, close} = ReactFlightClient({
supportsBinaryStreams: false,
resolveModuleReference(idx: string) {
return idx;
@@ -38,13 +31,13 @@ const {
},
});
-function read(source: Source): ReactModelRoot {
+function read(source: Source): T {
let response = createResponse(source);
for (let i = 0; i < source.length; i++) {
processStringChunk(response, source[i], 0);
}
close(response);
- return getModelRoot(response);
+ return response.readRoot();
}
export {read};