Displayed OAuth2 accounts in user profile page

Author: zonia3000

docs/development/tests.md

@@ -20,7 +20,24 @@ By default v2 tests are run. These tests require running a fractal-server instan
 
 To run v1 tests start playwright setting the environment variable `TEST_VERSION` to `v1`. These tests require running a fractal-server instance using `FRACTAL_RUNNER_BACKEND=local`.
 
-OAuth2 test requires a running instance of dexidp test image and a fractal-server instance configured to use it. To skip OAuth2 test set the environment variable `SKIP_OAUTH_TEST` to `true`.
+OAuth2 test requires a running instance of dexidp test image and a fractal-server instance configured to use it.
+
+To skip OAuth2 test set the environment variable `SKIP_OAUTH_TEST` to `true`.
+
+To run the OAuth2 test locally add the following configuration to `.fractal_server.env`:
+
+```
+OAUTH_DEXIDP_CLIENT_ID=client_test_web_id
+OAUTH_DEXIDP_CLIENT_SECRET=client_test_web_secret
+OAUTH_DEXIDP_REDIRECT_URL=http://localhost:5173/auth/login/oauth2/
+OAUTH_DEXIDP_OIDC_CONFIGURATION_ENDPOINT=http://127.0.0.1:5556/dex/.well-known/openid-configuration
+```
+
+And then start the test IdP container:
+
+```sh
+docker run -d --rm -p 5556:5556 ghcr.io/fractal-analytics-platform/oauth:0.1
+```
 
 ## Coverage
 

playwright.config.js

@@ -107,7 +107,7 @@ export default defineConfig({
 
 	webServer: [
 		{
-			command: './tests/start-test-server.sh 2.5.0a0',
+			command: './tests/start-test-server.sh 2.5.0a1',
 			port: 8000,
 			waitForPort: true,
 			stdout: 'pipe',

src/lib/types.d.ts

@@ -117,6 +117,11 @@ export type User = {
   slurm_accounts: string[]
   group_names?: string[]
   group_ids?: number[]
+  oauth_accounts: Array<{
+    id: number
+    account_email: string
+    oauth_name: string
+  }>
 }
 
 export type Group = {

src/routes/profile/+page.svelte

@@ -263,6 +263,23 @@
 					</td>
 					<td />
 				</tr>
+				<tr>
+					<th>OAuth2 accounts</th>
+					<td colspan="2">
+						{#if user.oauth_accounts.length === 0}
+							-
+						{:else}
+							<table class="table mb-0">
+								{#each user.oauth_accounts as account}
+									<tr>
+										<th>{account.oauth_name}</th>
+										<td>{account.account_email}</td>
+									</tr>
+								{/each}
+							</table>
+						{/if}
+					</td>
+				</tr>
 			</tbody>
 		</table>
 		<div id="profileUpdate-error" />

tests/oauth2.spec.js

@@ -4,28 +4,39 @@ import { waitPageLoading } from './utils.js';
 // Reset storage state for this file to avoid being authenticated
 test.use({ storageState: { cookies: [], origins: [] } });
 
-test('Login using OAuth2 provider', async ({ page }) => {
+test('OAuth2 account', async ({ page }) => {
 	if (process.env.SKIP_OAUTH_TEST === 'true') {
 		console.warn(
 			`WARNING: Skipping OAuth2 test since SKIP_OAUTH_TEST environment variable is set to true`
 		);
 		return;
 	}
 
-	await page.goto('/');
-	expect(await page.textContent('h1')).toBe('Welcome to Fractal web client.');
+	await test.step('Login using OAuth2 provider', async () => {
+		await page.goto('/');
+		expect(await page.textContent('h1')).toBe('Welcome to Fractal web client.');
 
-	await page.getByRole('link', { name: 'Login' }).first().click();
+		await page.getByRole('link', { name: 'Login' }).first().click();
 
-	await waitPageLoading(page);
+		await waitPageLoading(page);
 
-	await page.getByText('Login with OAuth2 provider').click();
-	await expect(page.getByText('as a non-verified user, you have limited access')).toBeVisible();
+		await page.getByText('Login with OAuth2 provider').click();
+		await expect(page.getByText('as a non-verified user, you have limited access')).toBeVisible();
+	});
 
-	await page.getByRole('button', { name: '[email protected]' }).click();
-	await page.getByRole('link', { name: 'Logout' }).click();
-	await page.waitForURL('/');
+	await test.step('Check that OAuth2 account is listed on profile', async () => {
+		await page.goto('/profile');
+		const row = page.getByRole('row', { name: 'OAuth2 accounts' });
+		await expect(row).toContainText('[email protected]');
+		await expect(row).toContainText('openid');
+	});
 
-	await expect(page.getByText('[email protected]')).toHaveCount(0);
-	await expect(page.getByText('Login')).toHaveCount(2);
+	await test.step('Logout', async () => {
+		await page.getByRole('button', { name: '[email protected]' }).click();
+		await page.getByRole('link', { name: 'Logout' }).click();
+		await page.waitForURL('/');
+
+		await expect(page.getByText('[email protected]')).toHaveCount(0);
+		await expect(page.getByText('Login')).toHaveCount(2);
+	});
 });