diff --git a/.changeset/tough-cherries-smoke.md b/.changeset/tough-cherries-smoke.md new file mode 100644 index 0000000000..394227c196 --- /dev/null +++ b/.changeset/tough-cherries-smoke.md @@ -0,0 +1,6 @@ +--- +'@clerk/clerk-js': patch +'@clerk/clerk-react': patch +--- + +Fix support of Clerk@v3 instance from `` diff --git a/integration/testUtils/appPageObject.ts b/integration/testUtils/appPageObject.ts index 8f1ebde9b4..0a8cb4614d 100644 --- a/integration/testUtils/appPageObject.ts +++ b/integration/testUtils/appPageObject.ts @@ -32,7 +32,7 @@ export const createAppPageObject = (testArgs: { page: Page }, app: Application) waitForClerkJsLoaded: async () => { return page.waitForFunction(() => { // @ts-ignore - return window.Clerk?.loaded; + return window.Clerk?.isReady(); }); }, waitForClerkComponentMounted: async () => { diff --git a/packages/clerk-js/src/core/clerk.ts b/packages/clerk-js/src/core/clerk.ts index a3f7f6f76f..ecae840119 100644 --- a/packages/clerk-js/src/core/clerk.ts +++ b/packages/clerk-js/src/core/clerk.ts @@ -173,7 +173,7 @@ export default class Clerk implements ClerkInterface { #environment?: EnvironmentResource | null; #fapiClient: FapiClient; #instanceType: InstanceType; - #loaded = false; + #isReady = false; /** * @deprecated Although this being a private field, this is a reminder to drop it with the next major release @@ -200,7 +200,7 @@ export default class Clerk implements ClerkInterface { } get loaded(): boolean { - return this.#loaded; + return this.#isReady; } get isSatellite(): boolean { @@ -319,13 +319,10 @@ export default class Clerk implements ClerkInterface { public getFapiClient = (): FapiClient => this.#fapiClient; - public isReady = (): boolean => { - deprecated('Clerk.isReady()', 'Use `Clerk.loaded` instead.'); - return this.#loaded; - }; + public isReady = (): boolean => this.#isReady; public load = async (options?: ClerkOptions): Promise => { - if (this.#loaded) { + if (this.#isReady) { return; } @@ -335,9 +332,9 @@ export default class Clerk implements ClerkInterface { }; if (this.#options.standardBrowser) { - this.#loaded = await this.#loadInStandardBrowser(); + this.#isReady = await this.#loadInStandardBrowser(); } else { - this.#loaded = await this.#loadInNonStandardBrowser(); + this.#isReady = await this.#loadInNonStandardBrowser(); } }; @@ -952,7 +949,7 @@ export default class Clerk implements ClerkInterface { params: HandleOAuthCallbackParams = {}, customNavigate?: (to: string) => Promise, ): Promise => { - if (!this.loaded || !this.#environment || !this.client) { + if (!this.#isReady || !this.#environment || !this.client) { return; } const { signIn, signUp } = this.client; @@ -1622,7 +1619,7 @@ export default class Clerk implements ClerkInterface { }; #buildUrl = (key: 'signInUrl' | 'signUpUrl', options?: SignInRedirectOptions | SignUpRedirectOptions): string => { - if (!this.loaded || !this.#environment || !this.#environment.displayConfig) { + if (!this.#isReady || !this.#environment || !this.#environment.displayConfig) { return ''; } diff --git a/packages/react/src/isomorphicClerk.ts b/packages/react/src/isomorphicClerk.ts index ad90632300..bdfd174830 100644 --- a/packages/react/src/isomorphicClerk.ts +++ b/packages/react/src/isomorphicClerk.ts @@ -363,7 +363,7 @@ export default class IsomorphicClerk implements IsomorphicLoadedClerk { // Otherwise use the instantiated Clerk object c = this.Clerk; - if (!c.loaded) { + if (!c.isReady()) { await c.load(this.options); } } @@ -390,7 +390,7 @@ export default class IsomorphicClerk implements IsomorphicLoadedClerk { global.Clerk.sdkMetadata = this.options.sdkMetadata ?? { name: PACKAGE_NAME, version: PACKAGE_VERSION }; - if (global.Clerk?.loaded) { + if (global.Clerk?.loaded || global.Clerk?.isReady()) { return this.hydrateClerkJS(global.Clerk); } return;