Support partial hydration for Remix clientLoader/clientAction #11033
Conversation
🦋 Changeset detectedLatest commit: 35fa15e The changes in this PR will be included in the next version bump. This PR includes changesets to release 5 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
| @@ -1665,14 +1665,12 @@ function testDomRouter( | |||
| let router = createTestRouter( | |||
| createRoutesFromElements( | |||
| <Route element={<Layout />}> | |||
| <Route index loader={() => "index"} element={<h1>index</h1>} /> | |||
There was a problem hiding this comment.
The unit test changes in this file can be ignored - before I added the future flag (and I started treating partial hydration data as non-initialized), I found a bunch of tests that inadvertently forgot or provide partial loader data so cleaned them up
| state: RouterState; | ||
| }): React.ReactElement | null { | ||
| return useRoutesImpl(routes, undefined, state); | ||
| return useRoutesImpl(routes, undefined, state, future); |
There was a problem hiding this comment.
Plumb down the router.future from RouterProvider so we can use it in renderMatches and only do the fallback stuff when enabled
| <DataRoutes | ||
| routes={router.routes} | ||
| future={router.future} | ||
| state={state} | ||
| /> |
There was a problem hiding this comment.
Plumb down the router.future from RouterProvider so we can use it in renderMatches and only do the fallback stuff when enabled
| errorElement = match.route.errorElement || defaultErrorElement; | ||
|
|
||
| if (renderFallback) { |
There was a problem hiding this comment.
Determine if we should be rendering a fallback element at this location in the tree
| let t = initializeTest({ | ||
| url: "/foo", | ||
| hydrationData: { loaderData: { root: "ROOT", foo: "FOO" } }, | ||
| }); |
There was a problem hiding this comment.
Same as above - these tests can be ignored as they just sure up the hydrationData for existing tests
| @@ -98,119 +98,6 @@ afterEach(() => { | |||
|
|
|||
| describe("a router", () => { | |||
| describe("init", () => { | |||
| it("initial state w/o hydrationData", async () => { | |||
There was a problem hiding this comment.
Moved these tests to the new file above that deals strictly with router initialization/fallback tests
| @@ -1536,6 +1331,7 @@ describe("a router", () => { | |||
| hydrationData: { | |||
| loaderData: { | |||
| root: "ROOT_DATA", | |||
| index: "INDEX_DATA", | |||
There was a problem hiding this comment.
Sure up hydration data
brophdawg11
force-pushed
the
brophdawg11/client-data
branch
from
ec878b4
to
847902d
Compare
brophdawg11
force-pushed
the
brophdawg11/client-data
branch
from
847902d
to
033421d
Compare
|
🤖 Hello there, We just published version Thanks! |
|
🤖 Hello there, We just published version Thanks! |
Adds support for a
future.v7_partialHydrationflag and a newroute.Fallbackproperty so we can provide partialhydrationDataand render the UI up until the deepestFallbackwhile we run the remaining loaders.To do: