fix(ui): route the challenge raised from the enterprise connections picker

`SignInFactorOneEnterpriseConnections` called `authenticateWithRedirect` and
returned it directly. A challenge raised while preparing the hand-off makes
that call resolve *without* issuing a redirect, so the user clicked their
connection and the card sat there unchanged — no challenge, no error, nothing.

Every other first- and second-factor call site funnels through
`navigateOnSignInProtectGate`; this one did not. Route it to
`../protect-check` like the rest.

Also records why `resumeEnterpriseSSO` passes no `enterpriseConnectionId`: it
runs only under the single-connection guard, so the server has exactly one
connection to prepare. Resuming a connection the user picked from this card
would need the id carried across the challenge, which nothing does today.

Author: zourzouvillys

.changeset/enterprise-sso-hand-off-challenge.md

@@ -3,4 +3,4 @@
 '@clerk/ui': patch
 ---
 
-Fix enterprise SSO sign-ins erroring instead of showing a verification challenge raised while handing off to the identity provider.
+Fix enterprise SSO sign-ins erroring, or appearing to do nothing, instead of showing a verification challenge raised while handing off to the identity provider. This covers the card for choosing between multiple enterprise connections, where clicking a connection left the user on an unchanged card.

packages/ui/src/components/SignIn/SignInFactorOneEnterpriseConnections.tsx

@@ -8,6 +8,8 @@ import { Flow, localizationKeys } from '@/ui/customizables';
 import { withCardStateProvider } from '@/ui/elements/contexts';
 import type { AvailableComponentProps } from '@/ui/types';
 
+import { useRouter } from '../../router';
+import { navigateOnSignInProtectGate } from './handleProtectCheck';
 import { hasMultipleEnterpriseConnections } from './shared';
 
 /**
@@ -16,6 +18,7 @@ import { hasMultipleEnterpriseConnections } from './shared';
 const SignInFactorOneEnterpriseConnectionsInternal = () => {
   const ctx = useSignInContext();
   const clerk = useClerk();
+  const { navigate } = useRouter();
   const signIn = clerk.client.signIn;
 
   if (!hasMultipleEnterpriseConnections(signIn.supportedFirstFactors)) {
@@ -28,18 +31,23 @@ const SignInFactorOneEnterpriseConnectionsInternal = () => {
     name: ff.enterpriseConnectionName,
   }));
 
-  const handleEnterpriseSSO = (enterpriseConnectionId: string) => {
+  const handleEnterpriseSSO = async (enterpriseConnectionId: string) => {
     const redirectUrl = ctx.ssoCallbackUrl;
     const redirectUrlComplete = ctx.afterSignInUrl || '/';
 
-    return signIn.authenticateWithRedirect({
+    await signIn.authenticateWithRedirect({
       strategy: 'enterprise_sso',
       redirectUrl,
       redirectUrlComplete,
       oidcPrompt: ctx.oidcPrompt,
       continueSignIn: true,
       enterpriseConnectionId,
     });
+
+    // Preparing the hand-off can itself raise a challenge, in which case no redirect was issued
+    // and the sign-in is sitting on the gate instead. Without this the picker looks inert: the
+    // user clicks their connection and nothing happens.
+    navigateOnSignInProtectGate(signIn, navigate, '../protect-check');
   };
 
   return (

packages/ui/src/components/SignIn/SignInProtectCheck.tsx

@@ -82,6 +82,10 @@ function SignInProtectCheckInternal(): JSX.Element | null {
       }
       await resumeSignInAfterProtectCheck(updatedSignIn, {
         navigate,
+        // No `enterpriseConnectionId` is passed: this runs only under
+        // `shouldHandOffToEnterpriseConnection`, which requires a single connection, so the server
+        // has exactly one to prepare. If that guard is ever loosened to resume a connection the
+        // user chose, the id has to be carried across the challenge and passed here.
         resumeEnterpriseSSO: async () => {
           await signIn.authenticateWithRedirect({
             strategy: 'enterprise_sso',

packages/ui/src/components/SignIn/__tests__/SignInFactorOneEnterpriseConnections.test.tsx

@@ -0,0 +1,62 @@
+import type { SignInResource } from '@clerk/shared/types';
+import { waitFor } from '@testing-library/react';
+import { describe, expect, it } from 'vitest';
+
+import { bindCreateFixtures } from '@/test/create-fixtures';
+import { render, screen } from '@/test/utils';
+
+import { SignInFactorOneEnterpriseConnections } from '../SignInFactorOneEnterpriseConnections';
+
+const { createFixtures } = bindCreateFixtures('SignIn');
+
+/** Two connections is what puts the user on this card rather than a direct hand-off. */
+const TWO_CONNECTIONS = [
+  { strategy: 'enterprise_sso', enterpriseConnectionId: 'ent_acme', enterpriseConnectionName: 'Acme SSO' },
+  { strategy: 'enterprise_sso', enterpriseConnectionId: 'ent_globex', enterpriseConnectionName: 'Globex SSO' },
+];
+
+describe('SignInFactorOneEnterpriseConnections', () => {
+  it('routes to the challenge when preparing the hand-off raises one', async () => {
+    // GIVEN a user choosing between two enterprise connections
+    const { wrapper, fixtures } = await createFixtures(f => {
+      f.withEmailAddress();
+      f.startSignInWithEmailAddress();
+    });
+    (fixtures.signIn as unknown as SignInResource).supportedFirstFactors = TWO_CONNECTIONS as never;
+    // WHEN preparing the hand-off comes back gated: no redirect is issued, the call just resolves.
+    fixtures.signIn.authenticateWithRedirect.mockImplementationOnce(() => {
+      (fixtures.signIn as any).protectCheck = { status: 'pending', token: 'challenge-token-abc' };
+      return Promise.resolve();
+    });
+
+    const { userEvent } = render(<SignInFactorOneEnterpriseConnections />, { wrapper });
+    await userEvent.click(await screen.findByText('Acme SSO'));
+
+    // THEN the challenge is shown, instead of the card sitting there looking inert.
+    await waitFor(() => {
+      expect(fixtures.router.navigate).toHaveBeenCalledWith('../protect-check');
+    });
+    expect(fixtures.signIn.authenticateWithRedirect).toHaveBeenCalledWith(
+      expect.objectContaining({ strategy: 'enterprise_sso', enterpriseConnectionId: 'ent_acme' }),
+    );
+  });
+
+  it('does not route to the challenge when the hand-off is issued normally', async () => {
+    // GIVEN the same card, but nothing gates the hand-off
+    const { wrapper, fixtures } = await createFixtures(f => {
+      f.withEmailAddress();
+      f.startSignInWithEmailAddress();
+    });
+    (fixtures.signIn as unknown as SignInResource).supportedFirstFactors = TWO_CONNECTIONS as never;
+    fixtures.signIn.authenticateWithRedirect.mockResolvedValueOnce(undefined as never);
+
+    const { userEvent } = render(<SignInFactorOneEnterpriseConnections />, { wrapper });
+    await userEvent.click(await screen.findByText('Globex SSO'));
+
+    // THEN the redirect owns the navigation and we must not steal it.
+    await waitFor(() => {
+      expect(fixtures.signIn.authenticateWithRedirect).toHaveBeenCalled();
+    });
+    expect(fixtures.router.navigate).not.toHaveBeenCalledWith('../protect-check');
+  });
+});