|
| 1 | +/** |
| 2 | + * ObjectUI |
| 3 | + * Copyright (c) 2024-present ObjectStack Inc. |
| 4 | + * |
| 5 | + * This source code is licensed under the MIT license found in the |
| 6 | + * LICENSE file in the root directory of this source tree. |
| 7 | + */ |
| 8 | + |
| 9 | +/** |
| 10 | + * Under declared SSO enforcement (`features.ssoEnforced` with |
| 11 | + * `features.sso`), the email-routed "Sign in with SSO" button is the way in. |
| 12 | + * It used to render only inside the password form, which enforcement keeps |
| 13 | + * collapsed until "Use a password instead" is clicked, so the first paint |
| 14 | + * offered no SSO control at all. The first paint now carries the email field |
| 15 | + * and the SSO button, and no password field; the break-glass link still |
| 16 | + * reveals the password form. |
| 17 | + * |
| 18 | + * The same holds when the password door is shut (`emailPassword.enabled: |
| 19 | + * false`) and the server advertises SSO without enforcing it: that collapses |
| 20 | + * the same form. There the break-glass link is no longer offered: the |
| 21 | + * password form it would open is one the server refuses, unless phone+password |
| 22 | + * sign-in is on. |
| 23 | + * |
| 24 | + * The controls: federated providers only, a server whose password form is |
| 25 | + * shown, and the no-method state keep their views. |
| 26 | + */ |
| 27 | +import React from 'react'; |
| 28 | +import { afterEach, describe, it, expect, vi } from 'vitest'; |
| 29 | +import { cleanup, render, screen, waitFor, fireEvent } from '@testing-library/react'; |
| 30 | +import { AuthProvider } from '../AuthProvider'; |
| 31 | +import { LoginForm } from '../LoginForm'; |
| 32 | +import type { AuthClient, AuthPublicConfig } from '../types'; |
| 33 | + |
| 34 | +afterEach(() => { |
| 35 | + cleanup(); |
| 36 | + vi.unstubAllGlobals(); |
| 37 | +}); |
| 38 | + |
| 39 | +const SSO_BUTTON = { name: 'Sign in with SSO' } as const; |
| 40 | +const BREAK_GLASS = { name: 'Use a password instead' } as const; |
| 41 | +const BACK_TO_SSO = { name: 'Back to single sign-on' } as const; |
| 42 | +const PROVIDER_BUTTON = { name: /Continue with Acme IdP$/ } as const; |
| 43 | +const DIVIDER = 'or continue with email'; |
| 44 | +const OIDC: AuthPublicConfig['socialProviders'] = [ |
| 45 | + { id: 'acme-idp', name: 'Acme IdP', enabled: true, type: 'oidc' }, |
| 46 | +]; |
| 47 | + |
| 48 | +/** The card's staging reading of an SSO-enforced deployment with a registered OIDC provider. */ |
| 49 | +const ENFORCED_SSO: AuthPublicConfig = { |
| 50 | + socialProviders: [], |
| 51 | + emailPassword: { enabled: true, disableSignUp: true }, |
| 52 | + features: { sso: true, ssoEnforced: true }, |
| 53 | +}; |
| 54 | + |
| 55 | +function renderLogin(config: AuthPublicConfig) { |
| 56 | + const client = { |
| 57 | + signIn: vi.fn(), |
| 58 | + getSession: vi.fn().mockResolvedValue(null), |
| 59 | + getConfig: vi.fn().mockResolvedValue(config), |
| 60 | + signInWithProvider: vi.fn().mockResolvedValue(undefined), |
| 61 | + } as unknown as AuthClient; |
| 62 | + return render( |
| 63 | + <AuthProvider authUrl="/api/auth" client={client}> |
| 64 | + <LoginForm registerUrl="/register" /> |
| 65 | + </AuthProvider>, |
| 66 | + ); |
| 67 | +} |
| 68 | + |
| 69 | +const configResolved = () => |
| 70 | + waitFor(() => expect(screen.queryByTestId('login-config-loading')).toBeNull()); |
| 71 | + |
| 72 | +describe('LoginForm — SSO enforcement with SSO advertised: the first paint is the SSO path', () => { |
| 73 | + it('draws the email field and the SSO button, and no password field', async () => { |
| 74 | + renderLogin(ENFORCED_SSO); |
| 75 | + await configResolved(); |
| 76 | + |
| 77 | + expect(screen.getByLabelText('Email')).toBeTruthy(); |
| 78 | + expect(screen.getByRole('button', SSO_BUTTON)).toBeTruthy(); |
| 79 | + expect(screen.queryByLabelText('Password')).toBeNull(); |
| 80 | + expect(screen.getByRole('button', BREAK_GLASS)).toBeTruthy(); |
| 81 | + expect(screen.queryByText('Sign up')).toBeNull(); |
| 82 | + }); |
| 83 | + |
| 84 | + it('routes the entered email to the IdP from the first paint', async () => { |
| 85 | + const fetchMock = vi.fn().mockResolvedValue({ |
| 86 | + ok: false, |
| 87 | + json: async () => ({ message: 'No SSO provider for that domain' }), |
| 88 | + }); |
| 89 | + vi.stubGlobal('fetch', fetchMock); |
| 90 | + renderLogin(ENFORCED_SSO); |
| 91 | + await configResolved(); |
| 92 | + |
| 93 | + fireEvent.change(screen.getByLabelText('Email'), { target: { value: ' jane@acme.example ' } }); |
| 94 | + fireEvent.click(screen.getByRole('button', SSO_BUTTON)); |
| 95 | + |
| 96 | + await waitFor(() => expect(fetchMock).toHaveBeenCalledTimes(1)); |
| 97 | + const [url, init] = fetchMock.mock.calls[0] as [string, RequestInit]; |
| 98 | + expect(url).toBe('/api/v1/auth/sign-in/sso'); |
| 99 | + expect(JSON.parse(String(init.body)).email).toBe('jane@acme.example'); |
| 100 | + expect(await screen.findByText('No SSO provider for that domain')).toBeTruthy(); |
| 101 | + }); |
| 102 | + |
| 103 | + it('keeps "Use a password instead" as the break-glass route to the password form, and back', async () => { |
| 104 | + renderLogin(ENFORCED_SSO); |
| 105 | + await configResolved(); |
| 106 | + |
| 107 | + fireEvent.click(screen.getByRole('button', BREAK_GLASS)); |
| 108 | + expect(await screen.findByLabelText('Password')).toBeTruthy(); |
| 109 | + expect(screen.getByRole('button', SSO_BUTTON)).toBeTruthy(); |
| 110 | + |
| 111 | + fireEvent.click(screen.getByRole('button', BACK_TO_SSO)); |
| 112 | + await screen.findByRole('button', BREAK_GLASS); |
| 113 | + expect(screen.queryByLabelText('Password')).toBeNull(); |
| 114 | + expect(screen.getByRole('button', SSO_BUTTON)).toBeTruthy(); |
| 115 | + }); |
| 116 | + |
| 117 | + it('separates the provider buttons from the SSO email field with the divider', async () => { |
| 118 | + renderLogin({ ...ENFORCED_SSO, socialProviders: OIDC }); |
| 119 | + await configResolved(); |
| 120 | + |
| 121 | + expect(await screen.findByRole('button', PROVIDER_BUTTON)).toBeTruthy(); |
| 122 | + expect(screen.getByText(DIVIDER)).toBeTruthy(); |
| 123 | + expect(screen.getByRole('button', SSO_BUTTON)).toBeTruthy(); |
| 124 | + expect(screen.queryByLabelText('Password')).toBeNull(); |
| 125 | + }); |
| 126 | +}); |
| 127 | + |
| 128 | +describe('LoginForm — password door shut with SSO advertised: the first paint is the SSO path too', () => { |
| 129 | + it('draws the email field and the SSO button, and no password field, without enforcement', async () => { |
| 130 | + renderLogin({ |
| 131 | + socialProviders: [], |
| 132 | + emailPassword: { enabled: false }, |
| 133 | + features: { sso: true, ssoEnforced: false }, |
| 134 | + }); |
| 135 | + await configResolved(); |
| 136 | + |
| 137 | + expect(screen.getByLabelText('Email')).toBeTruthy(); |
| 138 | + expect(screen.getByRole('button', SSO_BUTTON)).toBeTruthy(); |
| 139 | + expect(screen.queryByLabelText('Password')).toBeNull(); |
| 140 | + expect(screen.queryByTestId('login-no-sign-in-method')).toBeNull(); |
| 141 | + // The password form the link would open is one the server refuses. |
| 142 | + expect(screen.queryByRole('button', BREAK_GLASS)).toBeNull(); |
| 143 | + }); |
| 144 | + |
| 145 | + it('keeps the link when phone+password is a door the server still accepts', async () => { |
| 146 | + renderLogin({ |
| 147 | + socialProviders: [], |
| 148 | + emailPassword: { enabled: false }, |
| 149 | + features: { sso: true, ssoEnforced: false, phoneNumber: true }, |
| 150 | + }); |
| 151 | + await configResolved(); |
| 152 | + |
| 153 | + expect(screen.getByRole('button', SSO_BUTTON)).toBeTruthy(); |
| 154 | + expect(screen.getByRole('button', BREAK_GLASS)).toBeTruthy(); |
| 155 | + }); |
| 156 | +}); |
| 157 | + |
| 158 | +describe('LoginForm — the views around it stay as they were', () => { |
| 159 | + it('enforcement with federated providers only: the providers and the link, no email field', async () => { |
| 160 | + renderLogin({ socialProviders: OIDC, features: { sso: false, ssoEnforced: true } }); |
| 161 | + await configResolved(); |
| 162 | + |
| 163 | + expect(await screen.findByRole('button', PROVIDER_BUTTON)).toBeTruthy(); |
| 164 | + expect(screen.getByRole('button', BREAK_GLASS)).toBeTruthy(); |
| 165 | + expect(screen.queryByLabelText('Email')).toBeNull(); |
| 166 | + expect(screen.queryByRole('button', SSO_BUTTON)).toBeNull(); |
| 167 | + expect(screen.queryByText(DIVIDER)).toBeNull(); |
| 168 | + }); |
| 169 | + |
| 170 | + it('no enforcement: the password form, with the SSO button inside it', async () => { |
| 171 | + renderLogin({ socialProviders: [], features: { sso: true, ssoEnforced: false } }); |
| 172 | + await configResolved(); |
| 173 | + |
| 174 | + expect(screen.getByLabelText('Password')).toBeTruthy(); |
| 175 | + expect(screen.getByRole('button', SSO_BUTTON)).toBeTruthy(); |
| 176 | + expect(screen.queryByRole('button', BREAK_GLASS)).toBeNull(); |
| 177 | + expect(screen.queryByTestId('login-sso-email-form')).toBeNull(); |
| 178 | + }); |
| 179 | + |
| 180 | + it('password off and nothing else advertised: the no-method statement', async () => { |
| 181 | + renderLogin({ |
| 182 | + socialProviders: [], |
| 183 | + emailPassword: { enabled: false }, |
| 184 | + features: { sso: false, ssoEnforced: false }, |
| 185 | + }); |
| 186 | + |
| 187 | + expect(await screen.findByTestId('login-no-sign-in-method')).toBeTruthy(); |
| 188 | + expect(screen.queryByLabelText('Email')).toBeNull(); |
| 189 | + expect(screen.queryByRole('button', SSO_BUTTON)).toBeNull(); |
| 190 | + }); |
| 191 | +}); |
![objectstack-fleet[bot]](https://avatars.githubusercontent.com/u/254823548?v=4&size=40){kind=avatar}
0 commit comments