fix: Revalidate auth state for Next.js server

Author: LauraBeatris

.changeset/chatty-llamas-wink.md

@@ -3,8 +3,8 @@
     { "path": "./dist/clerk.js", "maxSize": "612kB" },
     { "path": "./dist/clerk.browser.js", "maxSize": "72.2KB" },
     { "path": "./dist/clerk.legacy.browser.js", "maxSize": "115KB" },
-    { "path": "./dist/clerk.headless*.js", "maxSize": "53.06KB" },
-    { "path": "./dist/ui-common*.js", "maxSize": "108.75KB" },
+    { "path": "./dist/clerk.headless*.js", "maxSize": "55KB" },
+    { "path": "./dist/ui-common*.js", "maxSize": "108.56KB" },
     { "path": "./dist/vendors*.js", "maxSize": "40.2KB" },
     { "path": "./dist/coinbase*.js", "maxSize": "38KB" },
     { "path": "./dist/createorganization*.js", "maxSize": "5KB" },

packages/clerk-js/bundlewatch.config.json

@@ -1283,7 +1283,16 @@ export class Clerk implements ClerkInterface {
   };
 
   public __experimental_navigateToTask = async ({ redirectUrlComplete }: NextTaskParams = {}): Promise<void> => {
-    const session = await this.session?.reload();
+    /**
+     * Invalidate previously cache pages with auth state before navigating
+     */
+    const onBeforeSetActive: SetActiveHook =
+      typeof window !== 'undefined' && typeof window.__unstable__onBeforeSetActive === 'function'
+        ? window.__unstable__onBeforeSetActive
+        : noop;
+    await onBeforeSetActive();
+
+    const session = this.session;
     if (!session || !this.environment) {
       return;
     }
@@ -1311,6 +1320,17 @@ export class Clerk implements ClerkInterface {
 
     this.#setAccessors(session);
     this.#emit();
+
+    /**
+     * Invoke the Next.js middleware to synchronize server and client state after resolving a session task.
+     * This ensures that any server-side logic depending on the session status (like middleware-based
+     * redirects or protected routes) correctly reflects the updated client authentication state.
+     */
+    const onAfterSetActive: SetActiveHook =
+      typeof window !== 'undefined' && typeof window.__unstable__onAfterSetActive === 'function'
+        ? window.__unstable__onAfterSetActive
+        : noop;
+    await onAfterSetActive();
   };
 
   public addListener = (listener: ListenerCallback): UnsubscribeCallback => {

packages/clerk-js/src/core/clerk.ts

@@ -12,7 +12,6 @@ export const createSessionTaskComponentPageObject = (testArgs: { page: EnhancedP
       const createOrganizationButton = page.getByRole('button', { name: /create organization/i });
 
       await expect(createOrganizationButton).toBeVisible();
-      expect(page.url()).toContain('add-organization');
 
       await page.locator('input[name=name]').fill(fakeOrganization.name);
       await page.locator('input[name=slug]').fill(fakeOrganization.slug);