Skip to content

Commit

Permalink
refactor(clerk-js,nextjs,clerk-react,shared,types): Remove hashing and
Browse files Browse the repository at this point in the history 
third-party cookie based session syncing for development instances.
  • Loading branch information
@tmilewski
tmilewski committed Dec 15, 2023
1 parent b94aa40 commit eeb2b4a
Show file tree
Hide file tree
Showing 14 changed files with 161 additions and 272 deletions.
7 changes: 7 additions & 0 deletions .changeset/famous-penguins-bow.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
'@clerk/types': major
---

- Remove `BuildUrlWithAuthParams` type
- `AuthConfigResource` no longer has a `urlBasedSessionSyncing` property
- `buildUrlWithAuth` no longer accepts an `options` argument of `BuildUrlWithAuthParams`.
10 changes: 10 additions & 0 deletions .changeset/modern-buses-sort.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
---
'@clerk/chrome-extension': major
'@clerk/clerk-js': major
'@clerk/nextjs': major
'@clerk/shared': major
'@clerk/clerk-react': major
'@clerk/types': major
---

Remove hashing and third-party cookie functionality related to development instance session syncing in favor of URL-based session syncing with query parameters.
6 changes: 6 additions & 0 deletions .changeset/modern-mayflies-sort.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
---
'@clerk/clerk-js': major
'@clerk/clerk-react': major
---

- `buildUrlWithAuth` no longer accepts an `options` argument.
135 changes: 55 additions & 80 deletions packages/clerk-js/src/core/clerk.redirects.test.ts
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
import { Clerk } from './clerk';
import type { AuthConfig, DisplayConfig } from './resources/internal';
import type { DevBrowser } from './devBrowser';
import type { DisplayConfig } from './resources/internal';
import { Client, Environment } from './resources/internal';

const mockClientFetch = jest.fn();
const mockEnvironmentFetch = jest.fn();
const mockUsesUrlBasedSessionSync = jest.fn();

jest.mock('./resources/Client');
jest.mock('./resources/Environment');

// Because Jest, don't ask me why...
jest.mock('./devBrowser', () => ({
createDevBrowser: () => ({
createDevBrowser: (): DevBrowser => ({
clear: jest.fn(),
setup: jest.fn(),
getDevBrowserJWT: jest.fn(() => 'deadbeef'),
Expand Down Expand Up @@ -57,7 +57,9 @@ const developmentPublishableKey = 'pk_test_Y2xlcmsuYWJjZWYuMTIzNDUuZGV2LmxjbGNsZ
const productionPublishableKey = 'pk_live_Y2xlcmsuYWJjZWYuMTIzNDUucHJvZC5sY2xjbGVyay5jb20k';

describe('Clerk singleton - Redirects', () => {
let mockNavigate = jest.fn();
const mockNavigate = jest.fn((to: string) => Promise.resolve(to));
const mockedLoadOptions = { routerPush: mockNavigate, routerReplace: mockNavigate };

let mockWindowLocation;
let mockHref: jest.Mock;

Expand Down Expand Up @@ -90,10 +92,10 @@ describe('Clerk singleton - Redirects', () => {
activeSessions: [],
}),
);

mockNavigate = jest.fn((to: string) => Promise.resolve(to));
});

afterEach(() => mockNavigate.mockReset());

describe('.redirectTo(SignUp|SignIn|UserProfile|AfterSignIn|AfterSignUp|CreateOrganization|OrganizationProfile)', () => {
let clerkForProductionInstance: Clerk;
let clerkForDevelopmentInstance: Clerk;
Expand All @@ -102,25 +104,18 @@ describe('Clerk singleton - Redirects', () => {
beforeEach(async () => {
mockEnvironmentFetch.mockReturnValue(
Promise.resolve({
authConfig: { urlBasedSessionSyncing: true } as AuthConfig,
userSettings: mockUserSettings,
displayConfig: mockDisplayConfigWithSameOrigin,
isProduction: () => false,
isDevelopmentOrStaging: () => true,
}),
);

mockUsesUrlBasedSessionSync.mockReturnValue(true);

clerkForProductionInstance = new Clerk(productionPublishableKey);
await clerkForProductionInstance.load({
routerPush: mockNavigate,
});

clerkForDevelopmentInstance = new Clerk(developmentPublishableKey);
await clerkForDevelopmentInstance.load({
routerPush: mockNavigate,
});

await clerkForProductionInstance.load(mockedLoadOptions);
await clerkForDevelopmentInstance.load(mockedLoadOptions);
});

afterEach(() => {
Expand All @@ -129,57 +124,57 @@ describe('Clerk singleton - Redirects', () => {

it('redirects to signInUrl', async () => {
await clerkForProductionInstance.redirectToSignIn({ redirectUrl: 'https://www.example.com/' });
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/sign-in#/?redirect_url=https%3A%2F%2Fwww.example.com%2F');

await clerkForDevelopmentInstance.redirectToSignIn({ redirectUrl: 'https://www.example.com/' });

expect(mockNavigate).toHaveBeenNthCalledWith(1, '/sign-in#/?redirect_url=https%3A%2F%2Fwww.example.com%2F');
expect(mockNavigate).toHaveBeenNthCalledWith(2, '/sign-in#/?redirect_url=https%3A%2F%2Fwww.example.com%2F');
});

it('redirects to signUpUrl', async () => {
await clerkForProductionInstance.redirectToSignUp({ redirectUrl: 'https://www.example.com/' });
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/sign-up#/?redirect_url=https%3A%2F%2Fwww.example.com%2F');

await clerkForDevelopmentInstance.redirectToSignUp({ redirectUrl: 'https://www.example.com/' });

expect(mockNavigate).toHaveBeenNthCalledWith(1, '/sign-up#/?redirect_url=https%3A%2F%2Fwww.example.com%2F');
expect(mockNavigate).toHaveBeenNthCalledWith(2, '/sign-up#/?redirect_url=https%3A%2F%2Fwww.example.com%2F');
});

it('redirects to userProfileUrl', async () => {
await clerkForProductionInstance.redirectToUserProfile();
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/user-profile');

await clerkForDevelopmentInstance.redirectToUserProfile();

expect(mockNavigate).toHaveBeenNthCalledWith(1, '/user-profile');
expect(mockNavigate).toHaveBeenNthCalledWith(2, '/user-profile');
});

it('redirects to afterSignUp', async () => {
await clerkForProductionInstance.redirectToAfterSignUp();
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/');

await clerkForDevelopmentInstance.redirectToAfterSignUp();

expect(mockNavigate).toHaveBeenNthCalledWith(1, '/');
expect(mockNavigate).toHaveBeenNthCalledWith(2, '/');
});

it('redirects to afterSignIn', async () => {
await clerkForProductionInstance.redirectToAfterSignIn();
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/');

await clerkForDevelopmentInstance.redirectToAfterSignIn();

expect(mockNavigate).toHaveBeenNthCalledWith(1, '/');
expect(mockNavigate).toHaveBeenNthCalledWith(2, '/');
});

it('redirects to create organization', async () => {
await clerkForProductionInstance.redirectToCreateOrganization();
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/create-organization');

await clerkForDevelopmentInstance.redirectToCreateOrganization();

expect(mockNavigate).toHaveBeenNthCalledWith(1, '/create-organization');
expect(mockNavigate).toHaveBeenNthCalledWith(2, '/create-organization');
});

it('redirects to organization profile', async () => {
await clerkForProductionInstance.redirectToOrganizationProfile();
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/organization-profile');

await clerkForDevelopmentInstance.redirectToOrganizationProfile();

expect(mockNavigate).toHaveBeenNthCalledWith(1, '/organization-profile');
expect(mockNavigate).toHaveBeenNthCalledWith(2, '/organization-profile');
});
});
Expand All @@ -188,87 +183,71 @@ describe('Clerk singleton - Redirects', () => {
beforeEach(async () => {
mockEnvironmentFetch.mockReturnValue(
Promise.resolve({
authConfig: { urlBasedSessionSyncing: true } as AuthConfig,
userSettings: mockUserSettings,
displayConfig: mockDisplayConfigWithDifferentOrigin,
isProduction: () => false,
isDevelopmentOrStaging: () => true,
}),
);

mockUsesUrlBasedSessionSync.mockReturnValue(true);

clerkForProductionInstance = new Clerk(productionPublishableKey);
await clerkForProductionInstance.load({
routerPush: mockNavigate,
});

clerkForDevelopmentInstance = new Clerk(developmentPublishableKey);
await clerkForDevelopmentInstance.load({
routerPush: mockNavigate,
});

await clerkForProductionInstance.load(mockedLoadOptions);
await clerkForDevelopmentInstance.load(mockedLoadOptions);
});

afterEach(() => {
mockEnvironmentFetch.mockRestore();
});

const host = 'http://another-test.host';

it('redirects to signInUrl', async () => {
await clerkForProductionInstance.redirectToSignIn({ redirectUrl: 'https://www.example.com/' });
expect(mockHref).toHaveBeenNthCalledWith(
1,
'http://another-test.host/sign-in#/?redirect_url=https%3A%2F%2Fwww.example.com%2F',
);

await clerkForDevelopmentInstance.redirectToSignIn({ redirectUrl: 'https://www.example.com/' });

expect(mockHref).toHaveBeenNthCalledWith(1, `${host}/sign-in#/?redirect_url=https%3A%2F%2Fwww.example.com%2F`);

expect(mockHref).toHaveBeenNthCalledWith(
2,
'http://another-test.host/sign-in#/?redirect_url=https%3A%2F%2Fwww.example.com%2F__clerk_db_jwt[deadbeef]',
`${host}/sign-in?__clerk_db_jwt=deadbeef#/?redirect_url=https%3A%2F%2Fwww.example.com%2F`,
);
});

it('redirects to signUpUrl', async () => {
await clerkForProductionInstance.redirectToSignUp({ redirectUrl: 'https://www.example.com/' });
expect(mockHref).toHaveBeenNthCalledWith(
1,
'http://another-test.host/sign-up#/?redirect_url=https%3A%2F%2Fwww.example.com%2F',
);

await clerkForDevelopmentInstance.redirectToSignUp({ redirectUrl: 'https://www.example.com/' });

expect(mockHref).toHaveBeenNthCalledWith(1, `${host}/sign-up#/?redirect_url=https%3A%2F%2Fwww.example.com%2F`);
expect(mockHref).toHaveBeenNthCalledWith(
2,
'http://another-test.host/sign-up#/?redirect_url=https%3A%2F%2Fwww.example.com%2F__clerk_db_jwt[deadbeef]',
`${host}/sign-up?__clerk_db_jwt=deadbeef#/?redirect_url=https%3A%2F%2Fwww.example.com%2F`,
);
});

it('redirects to userProfileUrl', async () => {
await clerkForProductionInstance.redirectToUserProfile();
expect(mockHref).toHaveBeenNthCalledWith(1, 'http://another-test.host/user-profile');

await clerkForDevelopmentInstance.redirectToUserProfile();
expect(mockHref).toHaveBeenNthCalledWith(2, 'http://another-test.host/user-profile#__clerk_db_jwt[deadbeef]');

expect(mockHref).toHaveBeenNthCalledWith(1, `${host}/user-profile`);
expect(mockHref).toHaveBeenNthCalledWith(2, `${host}/user-profile?__clerk_db_jwt=deadbeef`);
});

it('redirects to create organization', async () => {
await clerkForProductionInstance.redirectToCreateOrganization();
expect(mockHref).toHaveBeenNthCalledWith(1, 'http://another-test.host/create-organization');

await clerkForDevelopmentInstance.redirectToCreateOrganization();
expect(mockHref).toHaveBeenNthCalledWith(
2,
'http://another-test.host/create-organization#__clerk_db_jwt[deadbeef]',
);

expect(mockHref).toHaveBeenNthCalledWith(1, `${host}/create-organization`);
expect(mockHref).toHaveBeenNthCalledWith(2, `${host}/create-organization?__clerk_db_jwt=deadbeef`);
});

it('redirects to organization profile', async () => {
await clerkForProductionInstance.redirectToOrganizationProfile();
expect(mockHref).toHaveBeenNthCalledWith(1, 'http://another-test.host/organization-profile');

await clerkForDevelopmentInstance.redirectToOrganizationProfile();
expect(mockHref).toHaveBeenNthCalledWith(
2,
'http://another-test.host/organization-profile#__clerk_db_jwt[deadbeef]',
);

expect(mockHref).toHaveBeenNthCalledWith(1, `${host}/organization-profile`);
expect(mockHref).toHaveBeenNthCalledWith(2, `${host}/organization-profile?__clerk_db_jwt=deadbeef`);
});
});
});
Expand All @@ -278,10 +257,8 @@ describe('Clerk singleton - Redirects', () => {
let clerkForDevelopmentInstance: Clerk;

beforeEach(async () => {
mockUsesUrlBasedSessionSync.mockReturnValue(true);
mockEnvironmentFetch.mockReturnValue(
Promise.resolve({
authConfig: { urlBasedSessionSyncing: true } as AuthConfig,
userSettings: mockUserSettings,
displayConfig: mockDisplayConfigWithDifferentOrigin,
isProduction: () => false,
Expand All @@ -290,22 +267,20 @@ describe('Clerk singleton - Redirects', () => {
);

clerkForProductionInstance = new Clerk(productionPublishableKey);
await clerkForProductionInstance.load({
routerPush: mockNavigate,
});

clerkForDevelopmentInstance = new Clerk(developmentPublishableKey);
await clerkForDevelopmentInstance.load({
routerPush: mockNavigate,
});

await clerkForProductionInstance.load(mockedLoadOptions);
await clerkForDevelopmentInstance.load(mockedLoadOptions);
});

const host = 'https://app.example.com';

it('redirects to the provided url with __clerk_db_jwt in the url', async () => {
await clerkForProductionInstance.redirectWithAuth('https://app.example.com');
expect(mockHref).toHaveBeenNthCalledWith(1, 'https://app.example.com/');
await clerkForProductionInstance.redirectWithAuth(host);
await clerkForDevelopmentInstance.redirectWithAuth(host);

await clerkForDevelopmentInstance.redirectWithAuth('https://app.example.com');
expect(mockHref).toHaveBeenNthCalledWith(2, 'https://app.example.com/#__clerk_db_jwt[deadbeef]');
expect(mockHref).toHaveBeenNthCalledWith(1, `${host}/`);
expect(mockHref).toHaveBeenNthCalledWith(2, `${host}/?__clerk_db_jwt=deadbeef`);
});
});
});
Loading

0 comments on commit eeb2b4a

Please sign in to comment.