From 160dba81b640b3c9006cc186b9d04c09e45c6b75 Mon Sep 17 00:00:00 2001 From: Wyatt Johnson Date: Fri, 28 Oct 2022 11:07:11 -0700 Subject: [PATCH] fix: adjust prefetching on hover + touchStart --- packages/next/client/link.tsx | 26 +++++++++++++++++++++----- 1 file changed, 21 insertions(+), 5 deletions(-) diff --git a/packages/next/client/link.tsx b/packages/next/client/link.tsx index a004ef005d77..cc818285bcdc 100644 --- a/packages/next/client/link.tsx +++ b/packages/next/client/link.tsx @@ -5,7 +5,7 @@ import { UrlObject } from 'url' import { isLocalURL, NextRouter, - PrefetchOptions, + PrefetchOptions as RouterPrefetchOptions, resolveHref, } from '../shared/lib/router/router' import { formatUrl } from '../shared/lib/router/utils/format-url' @@ -108,11 +108,19 @@ type LinkPropsOptional = OptionalKeys const prefetched = new Set() +type PrefetchOptions = Omit & { + /** + * bypassPrefetchedCheck will bypass the check to see if the `href` has + * already been fetched. + */ + bypassPrefetchedCheck?: boolean +} + function prefetch( router: NextRouter | AppRouterInstance, href: string, as: string, - options?: Omit + options?: PrefetchOptions ): void { if (typeof window === 'undefined') { return @@ -124,7 +132,7 @@ function prefetch( // We should only dedupe requests when experimental.optimisticClientCache is // disabled. - if (!process.env.__NEXT_OPTIMISTIC_CLIENT_CACHE) { + if (!options?.bypassPrefetchedCheck) { const locale = 'locale' in router ? router.locale : undefined const key = href + '%' + as + (locale ? '%' + locale : '') @@ -575,7 +583,11 @@ const Link = React.forwardRef( return } - prefetch(router, href, as, { priority: true }) + prefetch(router, href, as, { + priority: true, + // @see {https://github.com/vercel/next.js/discussions/40268?sort=top#discussioncomment-3572642} + bypassPrefetchedCheck: true, + }) }, onTouchStart: (e: React.TouchEvent) => { if (!legacyBehavior && typeof onTouchStartProp === 'function') { @@ -598,7 +610,11 @@ const Link = React.forwardRef( return } - prefetch(router, href, as, { priority: true }) + prefetch(router, href, as, { + priority: true, + // @see {https://github.com/vercel/next.js/discussions/40268?sort=top#discussioncomment-3572642} + bypassPrefetchedCheck: true, + }) }, }