diff --git a/.changeset/remove-beforeunload-safelock.md b/.changeset/remove-beforeunload-safelock.md new file mode 100644 index 00000000000..591a4eb3e19 --- /dev/null +++ b/.changeset/remove-beforeunload-safelock.md @@ -0,0 +1,5 @@ +--- +'@clerk/clerk-js': patch +--- + +Removed redundant `beforeunload` event listener from SafeLock that was disabling the browser's back-forward cache (bfcache), degrading navigation performance. diff --git a/integration/tests/next-quickstart-keyless.test.ts b/integration/tests/next-quickstart-keyless.test.ts index d143b60385e..082367c1a7a 100644 --- a/integration/tests/next-quickstart-keyless.test.ts +++ b/integration/tests/next-quickstart-keyless.test.ts @@ -89,20 +89,24 @@ test.describe('Keyless mode @quickstart', () => { await newPage.waitForLoadState(); await newPage.waitForURL(url => { - const urlToReturnTo = `${dashboardUrl}apps/claim?token=`; - + const signInForceRedirectUrl = url.searchParams.get('sign_in_force_redirect_url'); const signUpForceRedirectUrl = url.searchParams.get('sign_up_force_redirect_url'); - const signUpForceRedirectUrlCheck = - signUpForceRedirectUrl?.startsWith(urlToReturnTo) || - (signUpForceRedirectUrl?.startsWith(`${dashboardUrl}prepare-account`) && - signUpForceRedirectUrl?.includes(encodeURIComponent('apps/claim?token='))); + // Backend adds framework=nextjs query param before token, so use .includes() instead of .startsWith() + const signInHasRequiredParams = + signInForceRedirectUrl?.includes(`${dashboardUrl}apps/claim`) && signInForceRedirectUrl?.includes('token='); + + const signUpRegularCase = + signUpForceRedirectUrl?.includes(`${dashboardUrl}apps/claim`) && signUpForceRedirectUrl?.includes('token='); + + const signUpPrepareAccountCase = + signUpForceRedirectUrl?.startsWith(`${dashboardUrl}prepare-account`) && + signUpForceRedirectUrl?.includes(encodeURIComponent('apps/claim')) && + signUpForceRedirectUrl?.includes(encodeURIComponent('token=')); + + const signUpHasRequiredParams = signUpRegularCase || signUpPrepareAccountCase; - return ( - url.pathname === '/apps/claim/sign-in' && - url.searchParams.get('sign_in_force_redirect_url')?.startsWith(urlToReturnTo) && - signUpForceRedirectUrlCheck - ); + return url.pathname === '/apps/claim/sign-in' && signInHasRequiredParams && signUpHasRequiredParams; }); }); diff --git a/packages/clerk-js/src/core/auth/safeLock.ts b/packages/clerk-js/src/core/auth/safeLock.ts index 405190a73ff..5fb08ea5a06 100644 --- a/packages/clerk-js/src/core/auth/safeLock.ts +++ b/packages/clerk-js/src/core/auth/safeLock.ts @@ -3,12 +3,6 @@ import Lock from 'browser-tabs-lock'; export function SafeLock(key: string) { const lock = new Lock(); - // TODO: Figure out how to fix this linting error - // eslint-disable-next-line @typescript-eslint/no-misused-promises - window.addEventListener('beforeunload', async () => { - await lock.releaseLock(key); - }); - const acquireLockAndRun = async (cb: () => Promise) => { if ('locks' in navigator && isSecureContext) { const controller = new AbortController();