fix(clerk-js): Re-initialize Client singleton instance on Client destroy (#1913)

.changeset/soft-birds-thank.md

@@ -0,0 +1,5 @@
+---
+'@clerk/clerk-js': patch
+---
+
+Re-initialize the Client to default values when is destroyed

packages/clerk-js/src/core/resources/Client.test.ts

@@ -0,0 +1,74 @@
+import type { ClientJSON } from '@clerk/types';
+
+import { createSession, createSignIn, createSignUp, createUser } from '../test/fixtures';
+import { BaseResource, Client } from './internal';
+
+describe('Client Singleton', () => {
+ it('destroy', async () => {
+ const user = createUser({ first_name: 'John', last_name: 'Doe', id: 'user_1' });
+ const session = createSession({ id: 'session_1' }, user);
+ const clientObjectJSON: ClientJSON = {
+ object: 'client',
+ id: 'test_id',
+ status: 'active',
+ last_active_session_id: 'test_session_id',
+ sign_in: createSignIn({ id: 'test_sign_in_id' }, user),
+ sign_up: createSignUp({ id: 'test_sign_up_id' }), // This is only for testing purposes, this will never happen
+ sessions: [session],
+ created_at: jest.now() - 1000,
+ updated_at: jest.now(),
+ };
+
+ const destroyedSession = createSession(
+ {
+ id: 'test_session_id',
+ abandon_at: jest.now(),
+ status: 'ended',
+ last_active_token: undefined,
+ },
+ user,
+ );
+
+ const clientObjectDeletedJSON = {
+ id: 'test_id_deleted',
+ status: 'ended',
+ last_active_session_id: null,
+ sign_in: null,
+ sign_up: null,
+ sessions: [destroyedSession],
+ created_at: jest.now() - 1000,
+ updated_at: jest.now(),
+ };
+
+ // @ts-expect-error This is a private method that we are mocking
+ BaseResource._fetch = jest.fn().mockReturnValue(
+ Promise.resolve({
+ client: null,
+ response: clientObjectDeletedJSON,
+ }),
+ );
+
+ const client = Client.getInstance().fromJSON(clientObjectJSON);
+ expect(client.sessions.length).toBe(1);
+ expect(client.createdAt).not.toBeNull();
+ expect(client.updatedAt).not.toBeNull();
+ expect(client.lastActiveSessionId).not.toBeNull();
+ expect(client.signUp.id).toBe('test_sign_up_id');
+ expect(client.signIn.id).toBe('test_sign_in_id');
+
+ await client.destroy();
+
+ expect(client.sessions.length).toBe(0);
+ expect(client.createdAt).toBeNull();
+ expect(client.updatedAt).toBeNull();
+ expect(client.lastActiveSessionId).toBeNull();
+ expect(client.signUp.id).toBeUndefined();
+ expect(client.signIn.id).toBeUndefined();
+
+ // @ts-expect-error This is a private method that we are mocking
+ expect(BaseResource._fetch).toHaveBeenCalledWith({
+ method: 'DELETE',
+ path: `/client`,
+ });
+ });
+});

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

@@ -57,6 +57,11 @@ export class Client extends BaseResource implements ClientResource {
  return this._baseDelete({ path: '/client' }).then(() => {
  SessionTokenCache.clear();
  this.sessions = [];
+ this.signUp = new SignUp(null);
+ this.signIn = new SignIn(null);
+ this.lastActiveSessionId = null;
+ this.createdAt = null;
+ this.updatedAt = null;
  });
  }
 

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

@@ -7,6 +7,9 @@ import type {
  OrganizationMembershipJSON,
  OrganizationPermission,
  PhoneNumberJSON,
+ SessionJSON,
+ SignInJSON,
+ SignUpJSON,
  UserJSON,
 } from '@clerk/types';
 
@@ -25,6 +28,8 @@ type WithUserParams = Omit<
  organization_memberships?: Array<string | OrgParams>;
 };
 
+type WithSessionParams = Partial<SessionJSON>;
+
 export const getOrganizationId = (orgParams: OrgParams) => orgParams?.id || orgParams?.name || 'test_id';
 
 export const createOrganizationMembership = (params: OrgParams): OrganizationMembershipJSON => {
@@ -158,11 +163,89 @@ export const createUser = (params: WithUserParams): UserJSON => {
  organization_memberships: (params.organization_memberships || []).map(o =>
  typeof o === 'string' ? createOrganizationMembership({ name: o }) : createOrganizationMembership(o),
  ),
- } as any as UserJSON;
+ } as UserJSON;
  res.primary_email_address_id = res.email_addresses[0]?.id;
  return res;
 };
 
+export const createSession = (sessionParams: WithSessionParams = {}, user: Partial<UserJSON> = {}) => {
+ return {
+ object: 'session',
+ id: sessionParams.id,
+ status: sessionParams.status,
+ expire_at: sessionParams.expire_at || jest.now() + 5000,
+ abandon_at: sessionParams.abandon_at,
+ last_active_at: sessionParams.last_active_at || jest.now(),
+ last_active_organization_id: sessionParams.last_active_organization_id,
+ actor: sessionParams.actor,
+ user: createUser({}),
+ public_user_data: {
+ first_name: user.first_name,
+ last_name: user.last_name,
+ image_url: user.image_url,
+ has_image: user.has_image,
+ identifier: user.email_addresses?.find(e => e.id === user.primary_email_address_id)?.email_address || '',
+ profile_image_url: user.profile_image_url,
+ },
+ created_at: sessionParams.created_at || jest.now() - 1000,
+ updated_at: sessionParams.updated_at || jest.now(),
+ last_active_token: {
+ object: 'token',
+ jwt: mockJwt,
+ },
+ } as SessionJSON;
+};
+
+export const createSignIn = (signInParams: Partial<SignInJSON> = {}, user: Partial<UserJSON> = {}) => {
+ return {
+ id: signInParams.id,
+ created_session_id: signInParams.created_session_id,
+ status: signInParams.status,
+ first_factor_verification: signInParams.first_factor_verification,
+ identifier: signInParams.identifier,
+ object: 'sign_in',
+ second_factor_verification: signInParams.second_factor_verification,
+ supported_external_accounts: signInParams.supported_external_accounts,
+ supported_first_factors: signInParams.supported_first_factors,
+ supported_identifiers: signInParams.supported_identifiers,
+ supported_second_factors: signInParams.supported_second_factors,
+ user_data: {
+ first_name: user.first_name,
+ last_name: user.last_name,
+ image_url: user.image_url,
+ has_image: user.has_image,
+ profile_image_url: user.profile_image_url,
+ },
+ } as SignInJSON;
+};
+
+export const createSignUp = (signUpParams: Partial<SignUpJSON> = {}) => {
+ return {
+ id: signUpParams.id,
+ created_session_id: signUpParams.created_session_id,
+ status: signUpParams.status,
+ abandon_at: signUpParams.abandon_at,
+ created_user_id: signUpParams.created_user_id,
+ email_address: signUpParams.email_address,
+ external_account: signUpParams.external_account,
+ external_account_strategy: signUpParams.external_account_strategy,
+ first_name: signUpParams.first_name,
+ has_password: signUpParams.has_password,
+ last_name: signUpParams.last_name,
+ missing_fields: signUpParams.missing_fields,
+ object: 'sign_up',
+ optional_fields: signUpParams.optional_fields,
+ phone_number: signUpParams.phone_number,
+ required_fields: signUpParams.required_fields,
+ supported_external_accounts: signUpParams.supported_external_accounts,
+ unsafe_metadata: signUpParams.unsafe_metadata,
+ unverified_fields: signUpParams.unverified_fields,
+ username: signUpParams.username,
+ verifications: signUpParams.verifications,
+ web3_wallet: signUpParams.web3_wallet,
+ } as SignUpJSON;
+};
+
 export const clerkMock = () => {
  return {
  getFapiClient: jest.fn().mockReturnValue({