redirect in child action doesn't refresh parent loader

[TheBuilderJR]

Reproduction

I have an action in some leaf route

app/routes/team.$team.$workspace.$query.$index.tsx

export const action = async ({ request, context }: any) => {
  // ...
  return redirect(`/team/${teamSlug}/${workspaceSlug}/${querySlug}`);
}

And the action is being submitted via a useFetcher

    fetcher.submit(
      {
        sql,
        team,
        workspace,
        query,
        index,
      },
      { method: "post" }
    );

And the child route correctly reloads all data, but the parent route's loader in app/routes/team.$team.tsx doesn't.

Is this expected? It feels like all loaders should be reloaded on mutation events.

System Info

System:
    OS: macOS 14.3.1
    CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 119.60 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.17.0 - ~/.nvm/versions/node/v18.17.0/bin/node
    Yarn: 1.22.17 - /usr/local/bin/yarn
    npm: 9.6.7 - ~/.nvm/versions/node/v18.17.0/bin/npm
    pnpm: 8.15.1 - ~/Library/pnpm/pnpm
  Browsers:
    Brave Browser: 113.1.51.110
    Chrome: 121.0.6167.184
    Safari: 17.3.1
  npmPackages:
    @remix-run/cloudflare: ^2.5.1 => 2.6.0 
    @remix-run/cloudflare-pages: ^2.5.1 => 2.6.0 
    @remix-run/css-bundle: ^2.5.1 => 2.6.0 
    @remix-run/dev: ^2.5.1 => 2.6.0 
    @remix-run/react: ^2.5.1 => 2.6.0

Used Package Manager

npm

Expected Behavior

All loaders to refresh

Actual Behavior

only child loaders are refreshed

[kiliman]

What does the Network tab look like?

[TheBuilderJR]

Here's a video. Notice how only after a manual refresh does the left bar reload the data.

Area.mp4

[TheBuilderJR]

This actually seems to be a problem with react arborist. Closing this issue since it's not remix related.

[dusty]

Just thought I'd add a comment on here in case anyone searches. I was having a similar problem where it seemed my action wasn't reloading the parent loader.

Turns out my page had a cancel button (which was a link) on it with a prefetch set to intent. I also set some cache headers on prefetch.

import { isPrefetch } from 'remix-utils/is-prefetch'
...
const isGet = request.method.toLowerCase() === 'get'
if (isGet && isPrefetch(request) && !headers.has('cache-control')) {
  headers.set('cache-control', 'private, max-age=5, stale-while-revalidate=10')
}

So, I happened to be hovering the cancel button before I got to the submit button. This was sending a prefetch that was cached by the time I hit the submit button and redirected.

I was able to figure that out by looking at the network tab and seeing that the parent loader was actually being served by a prefetch cache. Removing the intent fixed the problem.

footgun

:)