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

fix: Decouple AbortController for revalidating fetchers #10271

Merged
merged 3 commits into from
Mar 29, 2023

Conversation

brophdawg11
Copy link
Contributor

@brophdawg11 brophdawg11 commented Mar 27, 2023

Fixes a bug where revalidating fetchers share an AbortController with the navigation that caused them to revalidate. This introduces a two-way binding when we only want one-way. If the navigation is aborted, then we want the revalidating fetcher to abort. However, if the fetcher is aborted (via unmounting and deleting), it should not impact the navigation.

Closes remix-run/remix#5719

@changeset-bot
Copy link

changeset-bot bot commented Mar 27, 2023

🦋 Changeset detected

Latest commit: df3ae95

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 5 packages
Name Type
@remix-run/router Patch
react-router Patch
react-router-dom Patch
react-router-dom-v5-compat Patch
react-router-native Patch

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

"abort",
abortPendingFetchRevalidations
);
}
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Decouple abort controllers for navigations

abortController.signal.addEventListener(
"abort",
abortPendingFetchRevalidations
);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Decouple abort controllers for fetcher.submit revalidations

matches: fetcherMatches,
match: fetcherMatch,
...f,
controller: new AbortController(),
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Every revalidating fetcher now gets it's own AbortController

revalidatingFetchers.push({ key, ...f, matches: null, match: null });
revalidatingFetchers.push({
key,
routeId: f.routeId,
Copy link
Member

Choose a reason for hiding this comment

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

Is this just to be more explicit about what ends up on the revalidating fetcher obj? Did we spread too much info before?

Copy link
Contributor Author

@brophdawg11 brophdawg11 Mar 29, 2023

Choose a reason for hiding this comment

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

Correct - no functional change just being more explicit - f is a FetchLoadMatch:

interface FetchLoadMatch {
  routeId: string;
  path: string;
}

interface RevalidatingFetcher extends FetchLoadMatch {
  key: string;
  match: AgnosticDataRouteMatch | null;
  matches: AgnosticDataRouteMatch[] | null;
  controller: AbortController | null;
}

@brophdawg11 brophdawg11 merged commit 6f17a30 into dev Mar 29, 2023
@brophdawg11 brophdawg11 deleted the brophdawg11/revalidating-fetcher-controller branch March 29, 2023 20:27
@github-actions
Copy link
Contributor

🤖 Hello there,

We just published version 6.11.0-pre.0 which includes this pull request. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

@github-actions
Copy link
Contributor

🤖 Hello there,

We just published version 6.11.0 which includes this pull request. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants