Adjust unit tests with newest API

Author: LauraBeatris

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

@@ -474,7 +474,6 @@ describe('Clerk singleton', () => {
       });
     });
 
-    // TODO -> Refactor tests
     describe('with `pending` session status', () => {
       const mockSession = {
         id: '1',
@@ -521,12 +520,53 @@ describe('Clerk singleton', () => {
 
         const sut = new Clerk(productionPublishableKey);
         await sut.load();
-        await sut.setActive({ session: mockSession as any as ActiveSessionResource });
+        await sut.setActive({ session: mockSession as any as PendingSessionResource });
+        expect(mockSession.touch).toHaveBeenCalled();
+      });
+
+      it('calls `onPendingSession` from clerk options', async () => {
+        mockSession.touch.mockReturnValue(Promise.resolve());
+        mockClientFetch.mockReturnValue(Promise.resolve({ signedInSessions: [mockSession] }));
+        const onPendingSession = jest.fn();
+
+        const sut = new Clerk(productionPublishableKey);
+        await sut.load({
+          onPendingSession,
+        });
+        await sut.setActive({ session: mockSession as any as PendingSessionResource });
+        expect(mockSession.touch).toHaveBeenCalled();
+        expect(onPendingSession).toHaveBeenCalled();
+      });
+
+      it('calls `onPendingSession` as argument', async () => {
+        mockSession.touch.mockReturnValue(Promise.resolve());
+        mockClientFetch.mockReturnValue(Promise.resolve({ signedInSessions: [mockSession] }));
+        const onPendingSession = jest.fn();
+
+        const sut = new Clerk(productionPublishableKey);
+        await sut.load();
+        await sut.setActive({ session: mockSession as any as PendingSessionResource, onPendingSession });
+        expect(mockSession.touch).toHaveBeenCalled();
+        expect(onPendingSession).toHaveBeenCalled();
+      });
+
+      it('if `onPendingSession` is not defined, navigate to `taskUrl` option', async () => {
+        mockSession.touch.mockReturnValue(Promise.resolve());
+        mockClientFetch.mockReturnValue(Promise.resolve({ signedInSessions: [mockSession] }));
+
+        const sut = new Clerk(productionPublishableKey);
+        sut.navigate = jest.fn();
+        await sut.load({
+          taskUrls: {
+            'choose-organization': '/choose-organization',
+          },
+        });
+        await sut.setActive({ session: mockSession as any as PendingSessionResource });
         expect(mockSession.touch).toHaveBeenCalled();
+        expect(sut.navigate).toHaveBeenCalledWith('/choose-organization');
       });
     });
 
-    // TODO -> Refactor tests
     describe('with force organization selection enabled', () => {
       const mockSession = {
         id: '1',
@@ -909,7 +949,7 @@ describe('Clerk singleton', () => {
       mockEnvironmentFetch.mockReset();
     });
 
-    describe('with after-auth flows', () => {
+    describe('with pending session', () => {
       beforeEach(() => {
         mockClientFetch.mockReset();
         mockEnvironmentFetch.mockReturnValue(
@@ -926,7 +966,7 @@ describe('Clerk singleton', () => {
         );
       });
 
-      it('redirects to pending task', async () => {
+      it('navigates to task', async () => {
         const mockSession = {
           id: '1',
           status: 'pending',
@@ -956,7 +996,6 @@ describe('Clerk singleton', () => {
           }),
         );
 
-        const mockSetActive = jest.fn();
         const mockSignUpCreate = jest
           .fn()
           .mockReturnValue(Promise.resolve({ status: 'complete', createdSessionId: '123' }));
@@ -967,60 +1006,13 @@ describe('Clerk singleton', () => {
           fail('we should always have a client');
         }
         sut.client.signUp.create = mockSignUpCreate;
-        sut.setActive = mockSetActive;
 
         await sut.handleRedirectCallback();
 
         await waitFor(() => {
           expect(mockNavigate.mock.calls[0][0]).toBe('/sign-in#/tasks/choose-organization');
         });
       });
-
-      it('redirects to after sign-in URL when task has been resolved', async () => {
-        const mockSession = {
-          id: '1',
-          status: 'active',
-          user: {},
-          lastActiveToken: { getRawString: () => 'mocked-token' },
-        };
-
-        const mockResource = {
-          ...mockSession,
-          remove: jest.fn(),
-          touch: jest.fn(() => Promise.resolve()),
-          getToken: jest.fn(),
-          reload: jest.fn(() => Promise.resolve(mockSession)),
-        };
-
-        mockResource.touch.mockReturnValueOnce(Promise.resolve());
-        mockClientFetch.mockReturnValue(
-          Promise.resolve({
-            signedInSessions: [mockResource],
-            signIn: new SignIn(null),
-            signUp: new SignUp(null),
-            isEligibleForTouch: () => false,
-          }),
-        );
-
-        const mockSetActive = jest.fn();
-        const mockSignUpCreate = jest
-          .fn()
-          .mockReturnValue(Promise.resolve({ status: 'complete', createdSessionId: '123' }));
-
-        const sut = new Clerk(productionPublishableKey);
-        await sut.load(mockedLoadOptions);
-        if (!sut.client) {
-          fail('we should always have a client');
-        }
-        sut.client.signUp.create = mockSignUpCreate;
-        sut.setActive = mockSetActive;
-
-        await sut.handleRedirectCallback();
-
-        await waitFor(() => {
-          expect(mockNavigate.mock.calls[0][0]).toBe('/');
-        });
-      });
     });
 
     it('creates a new user and calls setActive if the user was not found during sso signup', async () => {
@@ -2434,115 +2426,6 @@ describe('Clerk singleton', () => {
     });
   });
 
-  describe('navigateToTask', () => {
-    describe('with `pending` session status', () => {
-      const mockSession = {
-        id: '1',
-        status: 'pending',
-        user: {},
-        tasks: [{ key: 'choose-organization' }],
-        currentTask: { key: 'choose-organization', __internal_getUrl: () => 'https://sut/tasks/choose-organization' },
-        lastActiveToken: { getRawString: () => 'mocked-token' },
-      };
-
-      const mockResource = {
-        ...mockSession,
-        remove: jest.fn(),
-        touch: jest.fn(() => Promise.resolve()),
-        getToken: jest.fn(),
-        reload: jest.fn(() => Promise.resolve(mockSession)),
-      };
-
-      beforeEach(() => {
-        mockResource.touch.mockReturnValueOnce(Promise.resolve());
-        mockClientFetch.mockReturnValue(
-          Promise.resolve({
-            signedInSessions: [mockResource],
-            isEligibleForTouch: () => false,
-          }),
-        );
-      });
-
-      afterEach(() => {
-        mockResource.remove.mockReset();
-        mockResource.touch.mockReset();
-      });
-
-      it('navigates to next task with default internal routing for AIOs', async () => {
-        const sut = new Clerk(productionPublishableKey);
-        await sut.load(mockedLoadOptions);
-
-        await sut.setActive({ session: mockResource as any as PendingSessionResource });
-
-        expect(mockNavigate.mock.calls[0][0]).toBe('/sign-in#/tasks/choose-organization');
-      });
-
-      it('navigates to next task with custom routing from clerk options', async () => {
-        const sut = new Clerk(productionPublishableKey);
-        await sut.load({
-          ...mockedLoadOptions,
-          taskUrls: {
-            'choose-organization': '/onboarding/choose-organization',
-          },
-        });
-
-        await sut.setActive({ session: mockResource as any as PendingSessionResource });
-
-        expect(mockNavigate.mock.calls[0][0]).toBe('/onboarding/choose-organization');
-      });
-    });
-
-    describe('with `active` session status', () => {
-      const mockSession = {
-        id: '1',
-        remove: jest.fn(),
-        status: 'active',
-        user: {},
-        touch: jest.fn(() => Promise.resolve()),
-        getToken: jest.fn(),
-        lastActiveToken: { getRawString: () => 'mocked-token' },
-        reload: jest.fn(() =>
-          Promise.resolve({
-            id: '1',
-            remove: jest.fn(),
-            status: 'active',
-            user: {},
-            touch: jest.fn(() => Promise.resolve()),
-            getToken: jest.fn(),
-            lastActiveToken: { getRawString: () => 'mocked-token' },
-          }),
-        ),
-      };
-
-      afterEach(() => {
-        mockSession.remove.mockReset();
-        mockSession.touch.mockReset();
-        (window as any).__unstable__onBeforeSetActive = null;
-        (window as any).__unstable__onAfterSetActive = null;
-      });
-
-      it('navigates to redirect url on completion', async () => {
-        mockSession.touch.mockReturnValue(Promise.resolve());
-        mockClientFetch.mockReturnValue(
-          Promise.resolve({
-            signedInSessions: [mockSession],
-            isEligibleForTouch: () => false,
-          }),
-        );
-
-        const sut = new Clerk(productionPublishableKey);
-        await sut.load(mockedLoadOptions);
-        await sut.setActive({ session: mockSession as any as ActiveSessionResource });
-
-        const redirectUrlComplete = '/welcome-to-app';
-
-        console.log(mockNavigate.mock.calls);
-
-        expect(mockNavigate.mock.calls[0][0]).toBe('/welcome-to-app');
-      });
-    });
-  });
-
   describe('updateClient', () => {
     afterEach(() => {
       // cleanup global window pollution

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

@@ -28,9 +28,9 @@ import type {
   AuthenticateWithGoogleOneTapParams,
   AuthenticateWithMetamaskParams,
   AuthenticateWithOKXWalletParams,
+  Clerk as ClerkInterface,
   ClerkAPIError,
   ClerkAuthenticateWithWeb3Params,
-  Clerk as ClerkInterface,
   ClerkOptions,
   ClientJSONSnapshot,
   ClientResource,
@@ -429,10 +429,6 @@ export class Clerk implements ClerkInterface {
 
     assertNoLegacyProp(this.#options);
 
-    if (this.__internal_hasAfterAuthFlows) {
-      warnNoTaskOptions(this.#options);
-    }
-
     if (this.#options.sdkMetadata) {
       Clerk.sdkMetadata = this.#options.sdkMetadata;
     }
@@ -1268,6 +1264,10 @@ export class Clerk implements ClerkInterface {
       }
 
       if (newSession?.status === 'pending') {
+        warnNoTaskOptions({
+          ...this.#options,
+          onPendingSession: this.#options['onPendingSession'] ?? onPendingSession,
+        });
         await this.#handlePendingSession(newSession, onPendingSession);
         return;
       }
@@ -1362,7 +1362,7 @@ export class Clerk implements ClerkInterface {
     if (currentSession.status === 'pending') {
       const tracker = createBeforeUnloadTracker(this.#options.standardBrowser);
 
-      const onPendingSessionHook = this.#options['onPendingSession'] ?? onPendingSession;
+      const onPendingSessionHook = onPendingSession ?? this.#options['onPendingSession'];
       const taskUrls = this.#options['taskUrls'];
 
       await tracker.track(async () => {

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

@@ -2,16 +2,16 @@ import type { ClerkOptions, PendingSessionResource, SessionTask } from '@clerk/t
 
 import { buildURL } from '../utils';
 
+/**
+ * @internal
+ */
 export const INTERNAL_SESSION_TASK_ROUTE_BY_KEY: Record<SessionTask['key'], string> = {
   'choose-organization': 'choose-organization',
 } as const;
 
-interface NavigateToTaskOptions {
-  navigate: (to: string) => Promise<unknown>;
-  baseUrl: string;
-  options?: ClerkOptions;
-}
-
+/**
+ * @internal
+ */
 export function buildTaskURL(task: SessionTask, opts: Pick<Parameters<typeof buildURL>[0], 'base'>) {
   return buildURL(
     {
@@ -25,7 +25,18 @@ export function buildTaskURL(task: SessionTask, opts: Pick<Parameters<typeof bui
 /**
  * @internal
  */
-export function navigateToTask(session: PendingSessionResource, { options, navigate, baseUrl }: NavigateToTaskOptions) {
+export function navigateToTask(
+  session: PendingSessionResource,
+  {
+    options,
+    navigate,
+    baseUrl,
+  }: {
+    navigate: (to: string) => Promise<unknown>;
+    baseUrl: string;
+    options?: ClerkOptions;
+  },
+) {
   const currentTaskKey = session.currentTask.key;
 
   return navigate(options?.taskUrls?.[currentTaskKey] ?? buildTaskURL(session.currentTask, { base: baseUrl }));

packages/clerk-js/src/ui/components/SignUp/SignUpSSOCallback.tsx

@@ -1,8 +1,3 @@
-import {
-  SSOCallback,
-  withRedirectToAfterSignUp,
-  withRedirectToSignUpTask,
-  withRedirectToSignUpTask,
-} from '../../common';
+import { SSOCallback, withRedirectToAfterSignUp, withRedirectToSignUpTask } from '../../common';
 
 export const SignUpSSOCallback = withRedirectToSignUpTask(withRedirectToAfterSignUp(SSOCallback));

packages/clerk-js/src/ui/contexts/components/SignIn.ts

@@ -122,10 +122,11 @@ export const useSignInContext = (): SignInContextType => {
 
   const onPendingSession: OnPendingSessionFn = async ({ session }) => {
     const currentTaskKey = session.currentTask.key;
+    const customTaskUrl = clerk.__internal_getOption('taskUrls')?.[currentTaskKey];
 
     switch (currentTaskKey) {
       case 'choose-organization': {
-        await navigate(`../tasks/${currentTaskKey}`);
+        await navigate(customTaskUrl ?? `../tasks/${currentTaskKey}`);
       }
     }
   };
@@ -136,7 +137,7 @@ export const useSignInContext = (): SignInContextType => {
     : null;
 
   return {
-    ...(ctx as SignInCtx),
+    ...ctx,
     transferable: ctx.transferable ?? true,
     oauthFlow: ctx.oauthFlow || 'auto',
     componentName,