fix(ui): prevent logout redirect loop

Author: smiggleworth

.github/assets/fitz-logo.png

@@ -25,9 +25,11 @@ const requestHeaders: Middleware = (context, next) => {
 
 const redirectUnauthenticated: Middleware = async (context, next) => {
   const result = await next(context);
+  const requestPath = new URL(context.request.url).pathname;
 
   if (
     result.status === 401 &&
+    requestPath !== "/api/v1/session" &&
     typeof window !== "undefined" &&
     !window.location.pathname.startsWith("/login")
   ) {

ui/src/adapters/client.ts

@@ -1,22 +1,5 @@
 import { expect, test } from "@playwright/test";
-import { mockAdminFeatures } from "./shell/api-fixtures";
-
-async function mockCredentialLogin(page: import("@playwright/test").Page) {
-  await page.route("**/api/v1/features", async (route) => {
-    await route.fulfill({
-      json: {
-        admin_auth_required: true,
-        admin_auth_mode: "password",
-        route_families: ["1"],
-        route_families_wildcard: false,
-      },
-    });
-  });
-
-  await page.route("**/api/v1/session", async (route) => {
-    await route.fulfill({ status: 401, json: { error: "unauthenticated" } });
-  });
-}
+import { mockAdminFeatures, mockCredentialLogin, mockPendingLogout } from "./shell/api-fixtures";
 
 test("should_center_the_credential_form_in_the_full_viewport", async ({ page }) => {
   // Arrange
@@ -93,14 +76,7 @@ test("renders truthful open-access state when authentication is disabled", async
 
 test("should_show_logout_progress_while_the_session_is_cleared", async ({ page }) => {
   // Arrange
-  await mockCredentialLogin(page);
-  await page.route("**/api/v1/session", async (route) => {
-    if (route.request().method() === "DELETE") {
-      await new Promise<void>(() => {});
-      return;
-    }
-    await route.fallback();
-  });
+  await mockPendingLogout(page);
   await page.goto("/logout");
   await expect(page.getByRole("heading", { level: 1, name: "Signing out" })).toBeVisible();
   const viewport = page.viewportSize();

ui/tests/e2e/login.spec.ts

@@ -45,6 +45,35 @@ export async function mockAdminFeatures(page: Page) {
   });
 }
 
+export async function mockCredentialLogin(page: Page) {
+  await page.route("**/api/v1/features", async (route) => {
+    await route.fulfill({
+      json: {
+        admin_auth_required: true,
+        admin_auth_mode: "password",
+        route_families: ["1"],
+        route_families_wildcard: false,
+      },
+    });
+  });
+
+  await page.route("**/api/v1/session", async (route) => {
+    await route.fulfill({ status: 401, json: { error: "unauthenticated" } });
+  });
+}
+
+export async function mockPendingLogout(page: Page) {
+  await mockCredentialLogin(page);
+  await page.route("**/api/v1/session", async (route) => {
+    if (route.request().method() === "DELETE") {
+      await new Promise<void>(() => {});
+      return;
+    }
+
+    await route.fallback();
+  });
+}
+
 export const topologyApiPayload: MessagingTopology = {
   broker: {
     connections: topologyOverview.broker.connections,

ui/tests/e2e/shell/api-fixtures.ts

@@ -4,6 +4,7 @@ import {
   mockDomainOverviewApis,
   mockHomeRouteApis,
   mockMetricsApi,
+  mockPendingLogout,
   mockSessionsApi,
   sessionsWithData,
 } from "./api-fixtures";
@@ -520,8 +521,8 @@ export const sprint16Routes: RouteScenario[] = [
   {
     path: "/logout",
     shell: "auth",
-    setup: (page) => mockHomeRouteApis(page),
-    title: "Sign out",
+    setup: (page) => mockPendingLogout(page),
+    title: "Signing out",
   },
   {
     path: "/admin/1/rpc/default/ops/primary/GetStatus",