From 6cb9ddb32d6d74863a08478f6322103330421265 Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 12:47:44 -0500
Subject: [PATCH 01/14] Wizard: let RTK Query own the blueprint name check

The wizard asks the server whether a blueprint name is already taken. That
answer used to live in a useState inside useDetailsValidation, filled in
later by a useEffect that waited 300ms and then called the API.

Two things go wrong when you keep server data in useState.

First, state belongs to one component. Three components call
useDetailsValidation, so there were three copies of the answer, three
timers, and three identical requests for the same name.

Second, state does not know which request it came from. Type a name, then
change it, and two requests are in flight at once. Whichever one finishes
last wins, even if it is the older one. The wizard could settle on the
answer for a name you had already replaced, and it would stay that way,
because nothing re-runs the effect to correct it.

Ask the query for the debounced name instead. RTK Query keys its cache by
the argument you pass it, so every component asking about the same name
shares one cache entry and one request, and an answer for an old name can
never overwrite the answer for the current one.

While the answer is still on its way, nothing is known to be wrong yet.
That is not the same as a validation error, so report it separately as
isPending. Before, a pending check made disabledNext true, and the footer
reads disabledNext as "there are errors to reveal". It revealed nothing,
refused to advance, and left the button enabled. Clicking it did nothing
at all. Now the footer disables Next until the answer arrives, so the
button is never enabled and inert.

Skip the request entirely when the name has not been edited. A name that
already belongs to this blueprint cannot collide with anything.
---
 .../CreateImageWizard/CreateImageWizard.tsx   |  3 +
 .../components/CustomWizardFooter.tsx         | 21 ++++-
 .../utilities/useValidation.tsx               | 91 ++++++++++---------
 3 files changed, 68 insertions(+), 47 deletions(-)

diff --git a/src/Components/CreateImageWizard/CreateImageWizard.tsx b/src/Components/CreateImageWizard/CreateImageWizard.tsx
index f26989158d..5048caaaeb 100644
--- a/src/Components/CreateImageWizard/CreateImageWizard.tsx
+++ b/src/Components/CreateImageWizard/CreateImageWizard.tsx
@@ -183,6 +183,8 @@ const CreateImageWizard = () => {
     imagePullValidation.disabledNext ||
     (restrictions.users.isStandalone && usersHaveErrors);
 
+  const baseSettingsIsPending = !!detailsValidation.isPending;
+
   const advancedSettingsHasErrors =
     filesystemValidation.disabledNext ||
     timezoneValidation.disabledNext ||
@@ -488,6 +490,7 @@ const CreateImageWizard = () => {
             <CustomWizardFooter
               disableBack={true}
               hasErrors={baseSettingsHasErrors}
+              isPending={baseSettingsIsPending}
               isOnPremise={isOnPremise}
             />
           }
diff --git a/src/Components/CreateImageWizard/components/CustomWizardFooter.tsx b/src/Components/CreateImageWizard/components/CustomWizardFooter.tsx
index 9c25ac749d..3400f7cc42 100644
--- a/src/Components/CreateImageWizard/components/CustomWizardFooter.tsx
+++ b/src/Components/CreateImageWizard/components/CustomWizardFooter.tsx
@@ -21,6 +21,7 @@ import { scrollToFirstError } from '../utilities/scrollToFirstError';
 type CustomWizardFooterPropType = {
   disableBack?: boolean;
   hasErrors: boolean;
+  isPending?: boolean;
   beforeNext?: () => boolean;
   isOnPremise: boolean;
 };
@@ -28,6 +29,7 @@ type CustomWizardFooterPropType = {
 export const CustomWizardFooter = ({
   disableBack,
   hasErrors,
+  isPending,
   beforeNext,
   isOnPremise,
 }: CustomWizardFooterPropType) => {
@@ -38,6 +40,13 @@ export const CustomWizardFooter = ({
   const reviewAndFinishBtnID = 'wizard-review-and-finish-btn';
   const cancelBtnID = 'wizard-cancel-btn';
 
+  // While a check is still running there is no error to show, so clicking would
+  // do nothing at all. Disable instead: an enabled button that silently
+  // discards the click is indistinguishable from a broken page, both to a user
+  // and to anything automating one. Real errors keep their enabled button so
+  // that clicking still reveals them.
+  const isWaitingOnValidation = !!isPending && !hasErrors;
+
   const handleNext = () => {
     if (hasErrors) {
       flushSync(() => {
@@ -89,10 +98,18 @@ export const CustomWizardFooter = ({
         >
           Back
         </Button>
-        <Button variant='secondary' onClick={handleNext}>
+        <Button
+          variant='secondary'
+          onClick={handleNext}
+          isDisabled={isWaitingOnValidation}
+        >
           Next
         </Button>
-        <Button variant='primary' onClick={handleReview}>
+        <Button
+          variant='primary'
+          onClick={handleReview}
+          isDisabled={isWaitingOnValidation}
+        >
           Review image
         </Button>
         <Button
diff --git a/src/Components/CreateImageWizard/utilities/useValidation.tsx b/src/Components/CreateImageWizard/utilities/useValidation.tsx
index 4618d065e7..5cb13a7466 100644
--- a/src/Components/CreateImageWizard/utilities/useValidation.tsx
+++ b/src/Components/CreateImageWizard/utilities/useValidation.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
 
 import { CheckCircleIcon } from '@patternfly/react-icons';
 import { jwtDecode } from 'jwt-decode';
@@ -9,10 +9,10 @@ import {
   UNIQUE_VALIDATION_DELAY,
 } from '@/constants';
 import {
-  BlueprintsResponse,
+  useGetBlueprintQuery,
+  useGetBlueprintsQuery,
   useGetImageExistsQuery,
   useGetOscapCustomizationsQuery,
-  useLazyGetBlueprintsQuery,
 } from '@/store/api/backend';
 import { useShowActivationKeyQuery } from '@/store/api/rhsm';
 import { useAppSelector } from '@/store/hooks';
@@ -68,6 +68,7 @@ import {
   selectUsers,
   UserWithAdditionalInfo,
 } from '@/store/slices/wizard';
+import useDebounce from '@/Utilities/useDebounce';
 
 import { getListOfDuplicates } from './getListOfDuplicates';
 
@@ -109,6 +110,9 @@ export type StepValidation = {
     [key: string]: string;
   };
   disabledNext: boolean;
+  // An async check has not answered yet. Kept separate from disabledNext so a
+  // step can wait for the answer instead of treating it as a validation error.
+  isPending?: boolean;
 };
 
 export type UsersStepValidation = {
@@ -152,6 +156,7 @@ export function useIsBlueprintValid(): boolean {
     !services.disabledNext &&
     !firstBoot.disabledNext &&
     !details.disabledNext &&
+    !details.isPending &&
     !users.disabledNext &&
     !userGroups.disabledNext &&
     !azureTarget.disabledNext &&
@@ -1139,53 +1144,47 @@ export function useDetailsValidation(): StepValidation {
   const blueprintId = useAppSelector(selectBlueprintId);
 
   const nameValid = isBlueprintNameValid(name);
-  const [uniqueName, setUniqueName] = useState<boolean | null>(null);
-
-  const [trigger] = useLazyGetBlueprintsQuery();
-
-  // Debounce the API call to check if the name is unique
-  useEffect(() => {
-    if (name !== '' && nameValid) {
-      const timer = setTimeout(
-        () => {
-          setUniqueName(null);
-          trigger({ name })
-            .unwrap()
-            .then((response: BlueprintsResponse) => {
-              if (
-                response.meta.count > 0 &&
-                response.data[0].id !== blueprintId
-              ) {
-                setUniqueName(false);
-              } else {
-                setUniqueName(true);
-              }
-            })
-            .catch(() => {
-              // If the request fails, we assume the name is unique
-              setUniqueName(true);
-            });
-        },
-        UNIQUE_VALIDATION_DELAY, // If name is empty string, instantly return
-      );
 
-      return () => {
-        clearTimeout(timer);
-      };
-    }
-  }, [blueprintId, name, setUniqueName, trigger, nameValid]);
+  // Already cached by the wizard, which fetches the same blueprint in edit mode
+  const { data: savedBlueprint } = useGetBlueprintQuery(
+    { id: blueprintId || '' },
+    { skip: !blueprintId },
+  );
+
+  // A name that hasn't been edited cannot collide with anything, so skip the
+  // lookup rather than spending a round trip to confirm it.
+  const isUnchangedName = !!blueprintId && name === savedBlueprint?.name;
+  const skipUniqueCheck = !name || !nameValid || isUnchangedName;
+
+  // Debouncing the query argument rather than the request itself lets RTK Query
+  // own the caching. Every call site of this hook then shares one cache entry
+  // and one in-flight request, and a remount reads the cached answer instead of
+  // restarting the check from scratch.
+  const debouncedName = useDebounce(name, UNIQUE_VALIDATION_DELAY);
+
+  const { data, isFetching, isError } = useGetBlueprintsQuery(
+    { name: debouncedName },
+    { skip: skipUniqueCheck || !debouncedName },
+  );
+
+  let isUniqueName: boolean | null;
+  if (skipUniqueCheck || isError) {
+    // A check we could not run is not evidence of a collision, so fail open
+    // rather than block the user on it.
+    isUniqueName = true;
+  } else if (debouncedName !== name || isFetching || !data) {
+    isUniqueName = null;
+  } else {
+    isUniqueName = data.meta.count === 0 || data.data[0].id === blueprintId;
+  }
 
   let nameError = '';
   if (!name) {
     nameError = 'Blueprint name is required';
-  }
-  if (name && !nameValid) {
+  } else if (!nameValid) {
     nameError = 'Invalid blueprint name';
-  } else if (uniqueName === false) {
+  } else if (isUniqueName === false) {
     nameError = 'Blueprint with this name already exists';
-  } else if (!blueprintId && uniqueName === null) {
-    // Hack to keep the error message from flickering in create mode
-    return { errors: { name: '' }, disabledNext: false };
   }
 
   let descriptionError = '';
@@ -1199,8 +1198,10 @@ export function useDetailsValidation(): StepValidation {
       name: nameError,
       description: descriptionError,
     },
-    // if uniqueName is null, we are still waiting for the API response
-    disabledNext: !!nameError || !!descriptionError || uniqueName !== true,
+    disabledNext: !!nameError || !!descriptionError,
+    // Reported separately from disabledNext: nothing is known to be wrong yet,
+    // so the step should wait for the answer rather than report an error.
+    isPending: isUniqueName === null,
   };
 }
 

From 63c5172f1e286e1db413fab2a1fafe5d20b7b85d Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 12:27:09 -0500
Subject: [PATCH 02/14] Wizard: keep the "already initialized" flag in Redux

The wizard resets its form the first time it opens. A useRef held the flag
that says "this already happened", so that the reset would not run twice.

A ref survives re-renders, but it does not survive unmounting. When React
unmounts a component it throws away everything inside it, refs included.
Mount it again and you get a brand new ref, back to false.

That matters here, because insights-chrome unmounts and remounts this
whole module as a matter of routine - roughly twice per page load, in
every run we measured. Usually it happens while the page is still loading
and nobody notices. Occasionally it happens after you have opened the
wizard and started typing. The fresh ref then says "not initialized yet",
the reset runs a second time, and the name and description you entered are
replaced by the defaults.

Redux state is not stored inside the component, so it survives the
remount. Keep the flag there and the second mount can see what the first
one did. Closing the modal already resets that slice, so the flag resets
along with it.

The symptom looked like several unrelated bugs, because which fields were
lost depended only on what you had typed before the remount.
---
 .../CreateImageWizard/CreateImageWizard.tsx   |  9 +--
 .../tests/WizardReinitialization.test.tsx     | 63 +++++++++++++++++++
 .../CreateImageWizard/tests/helpers.tsx       |  4 ++
 .../slices/wizard/tests/mockWizardState.ts    |  1 +
 src/store/slices/wizardModal/selectors.ts     |  3 +
 src/store/slices/wizardModal/slice.ts         | 11 +++-
 6 files changed, 86 insertions(+), 5 deletions(-)
 create mode 100644 src/Components/CreateImageWizard/tests/WizardReinitialization.test.tsx

diff --git a/src/Components/CreateImageWizard/CreateImageWizard.tsx b/src/Components/CreateImageWizard/CreateImageWizard.tsx
index 5048caaaeb..2c58c46ecc 100644
--- a/src/Components/CreateImageWizard/CreateImageWizard.tsx
+++ b/src/Components/CreateImageWizard/CreateImageWizard.tsx
@@ -51,7 +51,9 @@ import {
 } from '@/store/slices/wizard';
 import {
   closeWizardModal,
+  markWizardInitialized,
   openWizardModal,
+  selectHasWizardInitialized,
   selectIsWizardModalOpen,
   selectWizardModalMode,
 } from '@/store/slices/wizardModal';
@@ -123,7 +125,7 @@ const CreateImageWizard = () => {
   const imageSource = useAppSelector(selectImageSource);
   const [searchParams, setSearchParams] = useSearchParams();
   const resolvePath = useAppSelector(selectPathResolver);
-  const hasInitialized = useRef(false);
+  const hasInitialized = useAppSelector(selectHasWizardInitialized);
   const { analytics, auth } = useChrome();
   const { userData } = useGetUser(auth);
   const hasTrackedInitialStepRef = useRef(false);
@@ -209,9 +211,9 @@ const CreateImageWizard = () => {
     }
 
     if (mode === 'create' && showWizardModal) {
-      if (!hasInitialized.current) {
+      if (!hasInitialized) {
         dispatch(initializeWizard());
-        hasInitialized.current = true;
+        dispatch(markWizardInitialized());
       }
 
       // Initialize registration URLs
@@ -389,7 +391,6 @@ const CreateImageWizard = () => {
   const handleClose = () => {
     dispatch(closeWizardModal());
     dispatch(initializeWizard());
-    hasInitialized.current = false;
     hasTrackedInitialStepRef.current = false;
     hasTrackedWizardOpenedRef.current = false;
 
diff --git a/src/Components/CreateImageWizard/tests/WizardReinitialization.test.tsx b/src/Components/CreateImageWizard/tests/WizardReinitialization.test.tsx
new file mode 100644
index 0000000000..1a6a9385c1
--- /dev/null
+++ b/src/Components/CreateImageWizard/tests/WizardReinitialization.test.tsx
@@ -0,0 +1,63 @@
+import React from 'react';
+
+import { configureStore } from '@reduxjs/toolkit';
+import { act, render, screen } from '@testing-library/react';
+import { Provider } from 'react-redux';
+import { createMemoryRouter, RouterProvider } from 'react-router-dom';
+
+import { RootState, serviceMiddleware, serviceReducer } from '@/store';
+import { changeBlueprintName, setIsCustomName } from '@/store/slices/wizard';
+
+import CreateImageWizard from '../CreateImageWizard';
+
+// insights-chrome remounts this module routinely, so the wizard must treat a
+// remount as a continuation rather than a fresh start. Guarding initialization
+// with a ref silently discarded whatever the user had already entered.
+const renderWizardWithStore = (store: ReturnType<typeof makeStore>) => {
+  const router = createMemoryRouter(
+    [{ path: 'insights/image-builder/', element: <CreateImageWizard /> }],
+    { initialEntries: ['/insights/image-builder/'] },
+  );
+
+  return render(
+    <Provider store={store}>
+      <RouterProvider router={router} future={{ v7_startTransition: true }} />
+    </Provider>,
+  );
+};
+
+const makeStore = () =>
+  configureStore({
+    reducer: serviceReducer,
+    middleware: serviceMiddleware,
+    preloadedState: {
+      wizardModal: {
+        isModalOpen: true,
+        mode: 'create' as const,
+        hasInitialized: false,
+      },
+    } as Partial<RootState>,
+  });
+
+describe('wizard re-initialization', () => {
+  test('a remount does not discard details the user already entered', async () => {
+    const store = makeStore();
+
+    const view = renderWizardWithStore(store);
+    await screen.findByRole('heading', { name: /image output/i });
+
+    // Mirrors what typing in the Details step dispatches.
+    act(() => {
+      store.dispatch(changeBlueprintName('my-blueprint'));
+      store.dispatch(setIsCustomName());
+    });
+    expect(store.getState().wizard.details.blueprint.name).toBe('my-blueprint');
+
+    view.unmount();
+
+    renderWizardWithStore(store);
+    await screen.findByRole('heading', { name: /image output/i });
+
+    expect(store.getState().wizard.details.blueprint.name).toBe('my-blueprint');
+  });
+});
diff --git a/src/Components/CreateImageWizard/tests/helpers.tsx b/src/Components/CreateImageWizard/tests/helpers.tsx
index 0280bc903d..d559dee536 100644
--- a/src/Components/CreateImageWizard/tests/helpers.tsx
+++ b/src/Components/CreateImageWizard/tests/helpers.tsx
@@ -77,6 +77,7 @@ export const renderWithQueryParams = async (
       wizardModal: {
         isModalOpen: true,
         mode: 'create' as const,
+        hasInitialized: false,
       },
     },
     initialRoute: `/insights/image-builder${queryString}`,
@@ -92,6 +93,7 @@ export const renderCreateMode = async (): Promise<{
       wizardModal: {
         isModalOpen: true,
         mode: 'create' as const,
+        hasInitialized: false,
       },
     },
     initialRoute: '/insights/image-builder/',
@@ -107,6 +109,7 @@ export const renderEditMode = async (
       wizardModal: {
         isModalOpen: true,
         mode: 'edit' as const,
+        hasInitialized: false,
       },
       blueprints: {
         selectedBlueprintId: blueprintId,
@@ -135,6 +138,7 @@ export const renderImportMode = async (
       wizardModal: {
         isModalOpen: true,
         mode: 'import' as const,
+        hasInitialized: false,
       },
       wizard: importBlueprintState,
     },
diff --git a/src/store/slices/wizard/tests/mockWizardState.ts b/src/store/slices/wizard/tests/mockWizardState.ts
index edde90f6e3..fe5f7d954f 100644
--- a/src/store/slices/wizard/tests/mockWizardState.ts
+++ b/src/store/slices/wizard/tests/mockWizardState.ts
@@ -13,6 +13,7 @@ export const mockRootState: RootState = {
   wizardModal: {
     isModalOpen: false,
     mode: 'create',
+    hasInitialized: false,
   },
   blueprints: {
     selectedBlueprintId: undefined,
diff --git a/src/store/slices/wizardModal/selectors.ts b/src/store/slices/wizardModal/selectors.ts
index 0c324791da..758c23dfa7 100644
--- a/src/store/slices/wizardModal/selectors.ts
+++ b/src/store/slices/wizardModal/selectors.ts
@@ -5,3 +5,6 @@ export const selectIsWizardModalOpen = (state: RootState) =>
 
 export const selectWizardModalMode = (state: RootState) =>
   state.wizardModal.mode;
+
+export const selectHasWizardInitialized = (state: RootState) =>
+  state.wizardModal.hasInitialized;
diff --git a/src/store/slices/wizardModal/slice.ts b/src/store/slices/wizardModal/slice.ts
index de1464ada5..a1d408f72b 100644
--- a/src/store/slices/wizardModal/slice.ts
+++ b/src/store/slices/wizardModal/slice.ts
@@ -3,11 +3,16 @@ import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 export type WizardModalState = {
   isModalOpen: boolean;
   mode: 'create' | 'edit' | 'import';
+  // Lives in the store rather than a ref because chrome remounts this module
+  // routinely; a ref resets on remount and lets the wizard re-initialize on
+  // top of whatever the user has already entered.
+  hasInitialized: boolean;
 };
 
 const initialState: WizardModalState = {
   isModalOpen: false,
   mode: 'create',
+  hasInitialized: false,
 };
 
 export const wizardModalSlice = createSlice({
@@ -21,10 +26,14 @@ export const wizardModalSlice = createSlice({
       state.isModalOpen = true;
       state.mode = action.payload;
     },
+    markWizardInitialized: (state) => {
+      state.hasInitialized = true;
+    },
     closeWizardModal: () => {
       return initialState;
     },
   },
 });
 
-export const { openWizardModal, closeWizardModal } = wizardModalSlice.actions;
+export const { openWizardModal, markWizardInitialized, closeWizardModal } =
+  wizardModalSlice.actions;

From 0c2be1006bae81f7eb734412aae33fcc93eb7093 Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 12:45:20 -0500
Subject: [PATCH 03/14] Wizard: guard the blueprint lookup against an empty
 page

If the API ever reports a non-zero count alongside an empty data array,
indexing the first element throws while rendering. There is no error
boundary above this, so a TypeError here takes down the whole page rather
than the one field that could not be validated.

This is the same shape as a686d339, where an empty share_with_accounts
list turned into a crash on the images table for anyone whose account
happened to contain such an image.
---
 src/Components/CreateImageWizard/utilities/useValidation.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Components/CreateImageWizard/utilities/useValidation.tsx b/src/Components/CreateImageWizard/utilities/useValidation.tsx
index 5cb13a7466..b81cf79ab5 100644
--- a/src/Components/CreateImageWizard/utilities/useValidation.tsx
+++ b/src/Components/CreateImageWizard/utilities/useValidation.tsx
@@ -1175,7 +1175,7 @@ export function useDetailsValidation(): StepValidation {
   } else if (debouncedName !== name || isFetching || !data) {
     isUniqueName = null;
   } else {
-    isUniqueName = data.meta.count === 0 || data.data[0].id === blueprintId;
+    isUniqueName = data.meta.count === 0 || data.data[0]?.id === blueprintId;
   }
 
   let nameError = '';

From 0c05ae73a781368fb6827cecd03dc994000ab6d3 Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 13:08:26 -0500
Subject: [PATCH 04/14] playwright: make ensureRepositoryExists verify what it
 returns

The helper matched an existing repository on its name alone, so a
repository left behind with the wrong url or snapshot setting was reused
indefinitely. RepeatableBuild asserts that its repository is rejected for
having no snapshots, and a reused repository with snapshots enabled fails
that assertion on every run, looking like a product bug rather than stale
fixture data.

It also returned as soon as the create call succeeded. Content sources
introspects a new repository asynchronously, and until that finishes the
wizard disables it with "we are still learning about it" instead of the
reason the test is asserting on.

Verify the url and snapshot setting match what was asked for, replacing
the repository when they do not, and wait for introspection to finish
before returning.
---
 playwright/helpers/apiHelpers.ts | 127 +++++++++++++++++++++----------
 1 file changed, 87 insertions(+), 40 deletions(-)

diff --git a/playwright/helpers/apiHelpers.ts b/playwright/helpers/apiHelpers.ts
index ea17abf6de..c0bc13cc51 100644
--- a/playwright/helpers/apiHelpers.ts
+++ b/playwright/helpers/apiHelpers.ts
@@ -1,4 +1,4 @@
-import { APIResponse, Page } from '@playwright/test';
+import { APIResponse, expect, Page } from '@playwright/test';
 
 /**
  * Call API and return the response
@@ -93,8 +93,15 @@ type RepositoryResponse = {
   uuid: string;
   name: string;
   url: string;
+  snapshot?: boolean;
+  status?: string;
+  last_introspection_time?: string;
 };
 
+// Introspection of a small repository takes seconds, but the backend gives no
+// completion signal, so we poll.
+const INTROSPECTION_TIMEOUT = 90_000;
+
 export const createRepositoryViaApi = async (
   page: Page,
   repository: RepositoryRequest,
@@ -138,58 +145,98 @@ export const deleteRepositoryViaApi = async (
   }
 };
 
-// Ensures a repository with the given name exists. If it already exists,
-// returns the existing repo. If not, creates it. Handles race conditions
-// where a concurrent test run creates the repo between the check and
-// the create attempt.
-export const ensureRepositoryExists = async (
+const findRepositoryByName = async (
   page: Page,
-  repository: RepositoryRequest,
-): Promise<RepositoryResponse> => {
+  name: string,
+): Promise<RepositoryResponse | undefined> => {
   const headers = await getAuthHeaders(page);
-
-  // Check if the repo already exists by name
-  const searchResponse = await page
+  const response = await page
     .context()
     .request.get(
-      `/api/content-sources/v1/repositories/?name=${encodeURIComponent(repository.name)}`,
+      `/api/content-sources/v1/repositories/?name=${encodeURIComponent(name)}`,
       { headers },
     );
 
-  if (searchResponse.status() === 200) {
-    const body = await searchResponse.json();
-    const existing = body.data?.find(
-      (r: { name: string }) => r.name === repository.name,
-    );
-    if (existing) {
-      return existing;
-    }
+  if (response.status() !== 200) {
+    return undefined;
+  }
+
+  const body = await response.json();
+  return body.data?.find((r: RepositoryResponse) => r.name === name);
+};
+
+const normalizeUrl = (url: string) => url.replace(/\/+$/, '');
+
+const matchesRequest = (
+  repo: RepositoryResponse,
+  request: RepositoryRequest,
+): boolean =>
+  normalizeUrl(repo.url) === normalizeUrl(request.url) &&
+  !!repo.snapshot === !!request.snapshot;
+
+// A repository is only usable by a test once it has been introspected. Before
+// that the wizard still disables it, but with "we are still learning about it"
+// rather than whatever reason the test is asserting on, so waiting here keeps
+// that timing out of the specs.
+const waitForIntrospection = async (
+  page: Page,
+  name: string,
+): Promise<void> => {
+  await expect
+    .poll(
+      async () => {
+        const repo = await findRepositoryByName(page, name);
+        if (!repo) return 'missing';
+        if (!repo.last_introspection_time) return 'not introspected yet';
+        return repo.status ?? 'unknown';
+      },
+      {
+        message: `Repository "${name}" never became usable`,
+        timeout: INTROSPECTION_TIMEOUT,
+        intervals: [500, 1000, 2000, 5000],
+      },
+    )
+    .toBe('Valid');
+};
+
+// Ensures a repository with the given name exists, matches the requested
+// configuration, and has been introspected. Handles a concurrent run creating
+// the repository between the search and the create attempt.
+export const ensureRepositoryExists = async (
+  page: Page,
+  repository: RepositoryRequest,
+): Promise<RepositoryResponse> => {
+  const existing = await findRepositoryByName(page, repository.name);
+
+  // Matching on the name alone would reuse a repository left behind with the
+  // wrong url or snapshot setting, which then fails every later run for a
+  // reason that looks nothing like stale fixture data.
+  if (existing && !matchesRequest(existing, repository)) {
+    await deleteRepositoryViaApi(page, existing.uuid);
   }
 
-  // Repo doesn't exist, create it
-  try {
-    return await createRepositoryViaApi(page, repository);
-  } catch {
-    // Another run may have created it concurrently, try searching again
-    const retryResponse = await page
-      .context()
-      .request.get(
-        `/api/content-sources/v1/repositories/?name=${encodeURIComponent(repository.name)}`,
-        { headers },
-      );
-
-    if (retryResponse.status() === 200) {
-      const body = await retryResponse.json();
-      const existing = body.data?.find(
-        (r: { name: string }) => r.name === repository.name,
-      );
-      if (existing) {
-        return existing;
+  if (!existing || !matchesRequest(existing, repository)) {
+    try {
+      await createRepositoryViaApi(page, repository);
+    } catch {
+      // A concurrent run may have created it in the meantime.
+      if (!(await findRepositoryByName(page, repository.name))) {
+        throw new Error(
+          `Failed to create or find repository "${repository.name}"`,
+        );
       }
     }
+  }
+
+  await waitForIntrospection(page, repository.name);
 
-    throw new Error(`Failed to create or find repository "${repository.name}"`);
+  const repo = await findRepositoryByName(page, repository.name);
+  if (!repo) {
+    throw new Error(
+      `Repository "${repository.name}" disappeared after introspection`,
+    );
   }
+  return repo;
 };
 
 export const deleteRepositoryByUrlViaApi = async (

From 7aab1ee997cad60476aedf2300572e5e45da6e47 Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 13:34:02 -0500
Subject: [PATCH 05/14] playwright: stop two specs fighting over one repository
 url

Content sources allows one repository per url per organization.
Repositories.spec claims its url by deleting whatever already holds it,
and it used the same url as RepeatableBuild - so whenever the two
overlapped, it deleted RepeatableBuild's repository mid-run.

RepeatableBuild would list the repository, assert it was disabled, and
then fail on the next assertion once the list refetched without it. The
symptom was a dropdown reading "No repositories found", which looks like
a product bug rather than another test deleting the fixture.

Every other spec already owns its url outright. Give this one its own,
and wait for the new repository to be introspected before using it, since
the wizard filters the list by architecture and version and a repository
does not qualify for either until introspection finishes.
---
 playwright/Customizations/Repositories.spec.ts | 11 +++++++++--
 playwright/helpers/apiHelpers.ts               |  2 +-
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/playwright/Customizations/Repositories.spec.ts b/playwright/Customizations/Repositories.spec.ts
index c39eee4e56..d383b6ebac 100644
--- a/playwright/Customizations/Repositories.spec.ts
+++ b/playwright/Customizations/Repositories.spec.ts
@@ -5,6 +5,7 @@ import {
   createRepositoryViaApi,
   deleteRepositoryByUrlViaApi,
   deleteRepositoryViaApi,
+  waitForIntrospection,
 } from '../helpers/apiHelpers';
 import { isHosted } from '../helpers/helpers';
 import { ensureAuthenticated } from '../helpers/login';
@@ -21,8 +22,11 @@ import {
   registerLater,
 } from '../helpers/wizardHelpers';
 
-const REPOSITORY_URL =
-  'https://jlsherrill.fedorapeople.org/fake-repos/really-empty/';
+// Content sources allows one repository per url per organization, and this
+// spec claims the url by deleting whatever already holds it. Every spec
+// therefore needs a url of its own - sharing one with RepeatableBuild meant
+// this test deleted that test's repository out from under it mid-run.
+const REPOSITORY_URL = 'https://jlsherrill.fedorapeople.org/fake-repos/signed/';
 
 test('Create blueprint with repository and test edit mode removal', async ({
   page,
@@ -50,6 +54,9 @@ test('Create blueprint with repository and test edit mode removal', async ({
       snapshot: false,
     });
     repositoryUuid = repository.uuid;
+    // The wizard lists repositories filtered by architecture and version, and
+    // a repository does not qualify until content sources has introspected it.
+    await waitForIntrospection(page, repositoryName);
   });
 
   cleanup.add(() => deleteBlueprint(page, blueprintName));
diff --git a/playwright/helpers/apiHelpers.ts b/playwright/helpers/apiHelpers.ts
index c0bc13cc51..c9366c0769 100644
--- a/playwright/helpers/apiHelpers.ts
+++ b/playwright/helpers/apiHelpers.ts
@@ -178,7 +178,7 @@ const matchesRequest = (
 // that the wizard still disables it, but with "we are still learning about it"
 // rather than whatever reason the test is asserting on, so waiting here keeps
 // that timing out of the specs.
-const waitForIntrospection = async (
+export const waitForIntrospection = async (
   page: Page,
   name: string,
 ): Promise<void> => {

From f8f32a0a05860fc92dfdd07fda4d8a98f55d7faa Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 13:36:34 -0500
Subject: [PATCH 06/14] playwright: pin the browser timezone to UTC

Specs assert on dates as the wizard renders them. The browser followed the
host clock, so a date stored as UTC midnight rendered as the previous day
anywhere west of Greenwich: RepeatableBuild asserts "Dec 24, 2025" and saw
"Dec 23, 2025".

CI runners are already UTC, so this only ever failed on a developer's
machine - the least useful place for a test to disagree with CI.
---
 playwright.config.ts | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/playwright.config.ts b/playwright.config.ts
index a5d71f389a..bcb65c4aef 100644
--- a/playwright.config.ts
+++ b/playwright.config.ts
@@ -33,6 +33,11 @@ export default defineConfig({
     actionTimeout: 30_000, // 30s
     navigationTimeout: 30_000, // 30s
     headless: true,
+    // Specs assert on rendered dates. Without this the browser follows the
+    // host clock, so a date the wizard stores as UTC midnight renders as the
+    // previous day anywhere west of Greenwich - passing in CI and failing on
+    // a developer's machine.
+    timezoneId: 'UTC',
     baseURL: process.env.BASE_URL
       ? process.env.BASE_URL
       : 'http://127.0.0.1:9090',

From dd749b5207d72a1234cf451d1b9818d8f5884457 Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 13:48:49 -0500
Subject: [PATCH 07/14] playwright: add opt-in latency injection for hunting
 races

Races between the browser and the API are only a few hundred milliseconds
wide, so reproducing one means getting a test to click inside that window
by luck. PW_CHAOS=1 widens the window on purpose.

Uniform slowness finds nothing, because Playwright waits for elements to
become actionable and simply absorbs it. Reordering is what breaks code
that assumes replies arrive in the order they were sent, so delays come
from a heavy tailed distribution: most requests pass straight through and
a small share are held long enough to overtake a request issued earlier.

Delays are capped below actionTimeout so slowness alone cannot fail a
test, which keeps every red run meaningful. Each test records the seed it
used, so a failure can be replayed rather than fished for again.

Off unless PW_CHAOS is set.
---
 README.md                             |  53 +++++++++++
 playwright/fixtures/customizations.ts |   2 +
 playwright/fixtures/networkChaos.ts   | 121 ++++++++++++++++++++++++++
 3 files changed, 176 insertions(+)
 create mode 100644 playwright/fixtures/networkChaos.ts

diff --git a/README.md b/README.md
index f8ac9622f4..631ce2dd6f 100644
--- a/README.md
+++ b/README.md
@@ -413,6 +413,59 @@ PLAYWRIGHT_STATIC_PASSWORD="<your_static_user_password>"
 
 For local development purposes, you can use the same credentials as for `PLAYWRIGHT_USER` and `PLAYWRIGHT_PASSWORD` if you are using your stage account for those.
 
+### Finding flaky tests with injected latency
+
+Races between the browser and the API are hard to reproduce on demand. The
+window is usually a few hundred milliseconds wide, and it only matters when a
+test happens to click inside it. Setting `PW_CHAOS=1` delays the app's own API
+responses so those windows open wide enough to hit deliberately.
+
+```bash
+PW_CHAOS=1 npx playwright test --project="UI tests" --repeat-each=5
+```
+
+What finds bugs here is **reordering**, not slowness. Playwright waits for
+elements to become actionable, so uniformly slower responses are absorbed and
+nothing fails. Delays are drawn from a heavy tailed distribution instead: most
+requests pass straight through and a small share are held for up to two
+seconds, which is long enough for one response to overtake another issued
+before it. Code that assumes replies arrive in the order they were sent breaks
+under this. Code that does not, does not.
+
+Delays are capped below `actionTimeout`, so slowness on its own can never fail
+a test - anything that goes red under chaos is a real defect. Only requests to
+`**/api/**` are delayed, since holding bundles and fonts adds wall clock
+without producing anything worth finding.
+
+#### Reproducing a specific failure
+
+Every test records the seed it used as an annotation, visible in the HTML
+report:
+
+```
+chaos-seed     PW_CHAOS_SEED=2223827117 (test seed 729962994)
+chaos-summary  175 requests delayed, max 1982ms, total 19208ms
+```
+
+Passing that seed back replays the same delays:
+
+```bash
+PW_CHAOS=1 PW_CHAOS_SEED=2223827117 npx playwright test --project="UI tests"
+```
+
+Reproduction is close but not exact. Delays are drawn per request in dispatch
+order, so a run that issues its requests in a different order gets a different
+assignment - narrowing to a single spec is enough to change that. When a seed
+does not reproduce, raising `--repeat-each` is usually faster than chasing it.
+
+#### What it tends to find
+
+Failures under chaos point at state that outlives the request it came from:
+a cached answer that a slower, older response overwrites; a control that is
+enabled before the data behind it has arrived; an effect that re-runs after the
+component has already moved on. A failure that only appears under chaos is
+still real. It just needs an unlucky user rather than an unlucky test.
+
 ## Playwright Boot tests
 
 This section describes what Playwright Boot tests are, how they work and how to run them locally.
diff --git a/playwright/fixtures/customizations.ts b/playwright/fixtures/customizations.ts
index 783abacfe1..bfbe52a3b6 100644
--- a/playwright/fixtures/customizations.ts
+++ b/playwright/fixtures/customizations.ts
@@ -5,6 +5,7 @@ import { test as ariaHiddenTest } from './ariaHiddenWorkaround';
 import { blockAnalyticsTest } from './blockAnalytics';
 import { test as cleanupTest } from './cleanup';
 import { test as coverageTest } from './coverage';
+import { test as networkChaosTest } from './networkChaos';
 import { test as popupTest } from './popupHandler';
 
 // Combine the fixtures into one
@@ -13,5 +14,6 @@ export const test = mergeTests(
   blockAnalyticsTest,
   cleanupTest,
   coverageTest,
+  networkChaosTest,
   popupTest,
 );
diff --git a/playwright/fixtures/networkChaos.ts b/playwright/fixtures/networkChaos.ts
new file mode 100644
index 0000000000..31dedb6b67
--- /dev/null
+++ b/playwright/fixtures/networkChaos.ts
@@ -0,0 +1,121 @@
+import { test as base } from '@playwright/test';
+
+// Fault injection for shaking out client-side request races.
+//
+// Uniform latency finds very little: Playwright's auto-waiting absorbs a
+// slower-but-still-ordered backend. What breaks code is RESPONSE REORDERING -
+// an earlier request resolving after a later one, so a stale closure wins and
+// writes obsolete state. Reordering only happens when the spread between
+// delays exceeds the natural spacing between requests, so the distribution is
+// deliberately heavy tailed rather than uniform.
+//
+// Enable with PW_CHAOS=1. Every test records the seed it used as an
+// annotation; replay a specific failure with PW_CHAOS_SEED=<that seed>.
+
+const CHAOS_ENABLED = process.env.PW_CHAOS === '1';
+
+// Only the app's own API traffic. Delaying bundles and fonts adds wall clock
+// and load timeouts without producing any reordering worth finding.
+const TARGET = '**/api/**';
+
+type Band = { weight: number; min: number; max: number };
+
+// Measured stage latency sits around 320ms, so the tail has to reach well past
+// that for one response to overtake another.
+const BANDS: Band[] = [
+  // Most requests pass straight through. A few milliseconds of jitter would
+  // not reorder anything, and holding every request open while it elapsed put
+  // real load on the dev proxy.
+  { weight: 70, min: 0, max: 0 },
+  { weight: 20, min: 50, max: 400 }, // same order as real latency
+  { weight: 10, min: 400, max: 2000 }, // the tail that causes overtaking
+];
+
+const TOTAL_WEIGHT = BANDS.reduce((sum, b) => sum + b.weight, 0);
+
+// mulberry32 - small, fast, and good enough that a seed reproduces a run.
+const makeRng = (seed: number) => {
+  let a = seed >>> 0;
+  return () => {
+    a = (a + 0x6d2b79f5) >>> 0;
+    let t = Math.imul(a ^ (a >>> 15), 1 | a);
+    t = (t + Math.imul(t ^ (t >>> 7), 61 | t)) ^ t;
+    return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
+  };
+};
+
+const pickDelay = (rng: () => number): number => {
+  let roll = rng() * TOTAL_WEIGHT;
+  for (const band of BANDS) {
+    roll -= band.weight;
+    if (roll <= 0) {
+      return Math.floor(band.min + rng() * (band.max - band.min));
+    }
+  }
+  return 0;
+};
+
+// Distinct per test so parallel workers scramble differently, but derived from
+// the run seed so the whole suite replays from one env var.
+const deriveSeed = (runSeed: number, testId: string): number => {
+  let h = runSeed >>> 0;
+  for (let i = 0; i < testId.length; i++) {
+    h = (Math.imul(h ^ testId.charCodeAt(i), 0x01000193) + 1) >>> 0;
+  }
+  return h;
+};
+
+export type NetworkChaosFixture = {
+  networkChaos: void;
+};
+
+export const test = base.extend<NetworkChaosFixture>({
+  networkChaos: [
+    async ({ page }, use, testInfo) => {
+      if (!CHAOS_ENABLED) {
+        await use(undefined);
+        return;
+      }
+
+      const runSeed = process.env.PW_CHAOS_SEED
+        ? Number(process.env.PW_CHAOS_SEED)
+        : Math.floor(Math.random() * 0xffffffff);
+      const seed = deriveSeed(
+        runSeed,
+        `${testInfo.titlePath.join(' > ')}#${testInfo.repeatEachIndex}`,
+      );
+      const rng = makeRng(seed);
+
+      testInfo.annotations.push({
+        type: 'chaos-seed',
+        description: `PW_CHAOS_SEED=${runSeed} (test seed ${seed})`,
+      });
+
+      const delays: number[] = [];
+
+      await page.route(TARGET, async (route) => {
+        const delay = pickDelay(rng);
+        delays.push(delay);
+        if (delay > 0) {
+          await new Promise((resolve) => setTimeout(resolve, delay));
+        }
+        // fallback rather than continue so other route handlers still apply
+        await route.fallback();
+      });
+
+      await use(undefined);
+
+      await page.unroute(TARGET);
+
+      if (delays.length > 0) {
+        const max = Math.max(...delays);
+        const total = delays.reduce((a, b) => a + b, 0);
+        testInfo.annotations.push({
+          type: 'chaos-summary',
+          description: `${delays.length} requests delayed, max ${max}ms, total ${total}ms`,
+        });
+      }
+    },
+    { auto: true },
+  ],
+});

From 1b73c498cb59f629529e5ca9350c635fb77f6606 Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 14:01:34 -0500
Subject: [PATCH 08/14] playwright: wait for the modal, and stop keeping every
 trace

createBlueprint used isVisible() to decide whether the save-and-build
modal had appeared. isVisible() ignores the timeout passed to it and
reports the state at that instant, so a modal that took a moment to paint
read as absent. The second click never happened, the blueprint was never
created, and the test failed later at the blueprint list - nowhere near
the cause. Use waitFor(), which honours the timeout.

trace: 'on' also kept a trace for every passing test, hundreds of
megabytes of artifacts nobody opens. 'retain-on-failure' matches the
existing video setting and keeps a trace whenever there is a failure to
look at, including locally where retries are 0 and 'on-first-retry' would
record nothing at all.

The UI tests project raised the per test timeout to 29.5m, which only
governs how long a hung test burns before it is killed - a third of
globalTimeout. The slowest attempt observed is under 3m.
---
 playwright.config.ts                | 11 +++++++++--
 playwright/helpers/wizardHelpers.ts |  9 ++++++++-
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/playwright.config.ts b/playwright.config.ts
index bcb65c4aef..c7979a2115 100644
--- a/playwright.config.ts
+++ b/playwright.config.ts
@@ -42,7 +42,11 @@ export default defineConfig({
       ? process.env.BASE_URL
       : 'http://127.0.0.1:9090',
     video: 'retain-on-failure',
-    trace: 'on',
+    // 'on' kept a trace for every passing test too, which is hundreds of
+    // megabytes of artifacts nobody opens. 'on-first-retry' would record
+    // nothing locally, where retries are 0, so match the video setting and
+    // keep a trace whenever there is a failure to look at.
+    trace: 'retain-on-failure',
 
     ignoreHTTPSErrors: true,
   },
@@ -50,7 +54,10 @@ export default defineConfig({
     { name: 'Setup', testMatch: /.*\.setup\.ts/ },
     {
       name: 'UI tests',
-      timeout: 29.5 * 60 * 1000, // 29.5m
+      // The slowest attempt observed is under 3m. This is only a ceiling on
+      // how long a hung test can burn before it is killed, and at 29.5m one
+      // could take a third of globalTimeout with it.
+      timeout: 5 * 60 * 1000, // 5m
       use: {
         ...devices['Desktop Chrome'],
         storageState: '.auth/user.json',
diff --git a/playwright/helpers/wizardHelpers.ts b/playwright/helpers/wizardHelpers.ts
index 0f93fbca76..84403f31ae 100644
--- a/playwright/helpers/wizardHelpers.ts
+++ b/playwright/helpers/wizardHelpers.ts
@@ -32,8 +32,15 @@ export const createBlueprint = async (
   // An informational modal may appear on first create if localStorage
   // does not have 'imageBuilder.saveAndBuildModalSeen'. Dismiss it and
   // click the button again.
+  // isVisible() ignores its timeout and reports the state right now, so a
+  // modal that took a moment to paint read as absent, the second click never
+  // happened, and the blueprint was silently never created.
   const closeBtn = page.getByTestId('close-button-saveandbuild-modal');
-  if (await closeBtn.isVisible({ timeout: 3000 }).catch(() => false)) {
+  const modalAppeared = await closeBtn
+    .waitFor({ state: 'visible', timeout: 3000 })
+    .then(() => true)
+    .catch(() => false);
+  if (modalAppeared) {
     await closeBtn.click();
     await page.getByRole('button', { name: 'Create blueprint' }).click();
   }

From 8ce0124a2fb5ace1ad947a2cafff2dd0b71eea1f Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 14:10:13 -0500
Subject: [PATCH 09/14] playwright: lower the default expect timeout to 15s

The default has only ever gone up: 5s out of the box, raised to 30s in
34fdd8f0 and to 50s in ff2cc68d, both times in response to flakes. A
longer wait has never fixed a race, it just makes each failure slower and
buries the signal - the blueprint name race lived under
toBeEnabled({ timeout: 10000 }) guards for months.

It also inverted the meaning of the explicit timeouts at call sites. Most
of them ask for 10s or 30s, which was an extension when written against a
5s default and is a reduction against 50s. Nothing at a call site tells
you what the effective wait is any more.

Assertions that genuinely wait on slow work - image builds, policy
loading, introspection - already say so explicitly, and those are
unaffected. A low default leaves those as deliberate statements rather
than noise against a background where everything waits 50s.

The full UI suite passes at 15s with no assertion needing more.
---
 playwright.config.ts | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/playwright.config.ts b/playwright.config.ts
index c7979a2115..d03d763ddf 100644
--- a/playwright.config.ts
+++ b/playwright.config.ts
@@ -28,7 +28,10 @@ export default defineConfig({
   reporter: reporters,
   globalTimeout: 89.5 * 60 * 1000, // 1h29.5m, Set because of codebuild, we want PW to timeout before CB to get the results.
   timeout: 3 * 60 * 1000, // 3m
-  expect: { timeout: 50_000 }, // 50s
+  // Assertions that genuinely need to wait longer say so at the call site.
+  // A high default hides which those are, and turns every ordinary failure
+  // into a slow one.
+  expect: { timeout: 15_000 }, // 15s
   use: {
     actionTimeout: 30_000, // 30s
     navigationTimeout: 30_000, // 30s

From f7dd9fb4a8f422c6d88e41e4db81071043ea20e0 Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 14:46:51 -0500
Subject: [PATCH 10/14] playwright: drop waits that the default now covers

Three guards asserted a button was enabled immediately before clicking it.
click() already waits for actionability, so the assertion only changed
which error appeared on failure. One of them came in with dfaccffb,
"playwright: Improve flakey behaviour", and the blueprint name race it was
working around is fixed.

The rest are explicit expect timeouts of 5s and 10s. Those were extensions
when written against Playwright's 5s default, but the default has since
been raised twice, so they had quietly become reductions - the opposite of
what their authors asked for. Removing them restores the intent.

Left alone: short timeouts on waitFor and click, where being short is the
point, since they probe whether an optional element is present rather than
wait for one that should be.
---
 playwright/Basic/imageMode.spec.ts            | 20 +++++++++----------
 .../Customizations/Registration.spec.ts       |  1 -
 2 files changed, 9 insertions(+), 12 deletions(-)

diff --git a/playwright/Basic/imageMode.spec.ts b/playwright/Basic/imageMode.spec.ts
index fb8340cc8e..3199d2f9c3 100644
--- a/playwright/Basic/imageMode.spec.ts
+++ b/playwright/Basic/imageMode.spec.ts
@@ -44,7 +44,7 @@ test('Image mode blueprint create, edit, export, import', async ({
   // Skip the test if the image mode flag is not enabled in this environment
   const imageModeToggle = frame.getByRole('button', { name: 'Image mode' });
   try {
-    await expect(imageModeToggle).toBeVisible({ timeout: 10000 });
+    await expect(imageModeToggle).toBeVisible();
   } catch {
     test.skip(true, 'Image mode flag not enabled');
   }
@@ -64,8 +64,8 @@ test('Image mode blueprint create, edit, export, import', async ({
     let imageSourceDropdown = frame.getByRole('button', {
       name: /Red Hat Enterprise Linux|RHEL/i,
     });
-    await expect(imageSourceDropdown).toBeVisible({ timeout: 10000 });
-    await expect(imageSourceDropdown).toBeEnabled({ timeout: 5000 });
+    await expect(imageSourceDropdown).toBeVisible();
+    await expect(imageSourceDropdown).toBeEnabled();
     await imageSourceDropdown.click();
     await frame.getByRole('option', { name: 'Fedora Hummingbird' }).click();
 
@@ -88,8 +88,8 @@ test('Image mode blueprint create, edit, export, import', async ({
       name: /fedora hummingbird/i,
     });
     await imageSourceDropdown.click();
-    await expect(imageSourceDropdown).toBeVisible({ timeout: 10000 });
-    await expect(imageSourceDropdown).toBeEnabled({ timeout: 5000 });
+    await expect(imageSourceDropdown).toBeVisible();
+    await expect(imageSourceDropdown).toBeEnabled();
     await frame
       .getByRole('option', { name: 'Red Hat Enterprise Linux (RHEL)' })
       .click();
@@ -99,14 +99,14 @@ test('Image mode blueprint create, edit, export, import', async ({
     const imageSourceDropdown = frame.getByRole('button', {
       name: /Red Hat Enterprise Linux|RHEL/i,
     });
-    await expect(imageSourceDropdown).toBeVisible({ timeout: 10000 });
-    await expect(imageSourceDropdown).toBeEnabled({ timeout: 5000 });
+    await expect(imageSourceDropdown).toBeVisible();
+    await expect(imageSourceDropdown).toBeEnabled();
     await imageSourceDropdown.click();
 
     const rhelSourceOption = frame
       .getByRole('option', { name: /RHEL/i })
       .first();
-    await expect(rhelSourceOption).toBeVisible({ timeout: 10000 });
+    await expect(rhelSourceOption).toBeVisible();
     await rhelSourceOption.click();
 
     await expect(
@@ -126,7 +126,6 @@ test('Image mode blueprint create, edit, export, import', async ({
     const reviewImageButton = frame.getByRole('button', {
       name: 'Review image',
     });
-    await expect(reviewImageButton).toBeEnabled({ timeout: 10000 });
     await reviewImageButton.click();
     await createBlueprint(frame, blueprintName);
   });
@@ -158,7 +157,6 @@ test('Image mode blueprint create, edit, export, import', async ({
     const reviewImageButton = frame.getByRole('button', {
       name: 'Review image',
     });
-    await expect(reviewImageButton).toBeEnabled({ timeout: 10000 });
     await reviewImageButton.click();
     await frame
       .getByRole('button', { name: 'Save changes to blueprint' })
@@ -185,7 +183,7 @@ test('Image mode blueprint create, edit, export, import', async ({
     const importedImageMode = frame.getByRole('button', {
       name: 'Image mode',
     });
-    await expect(importedImageMode).toBeVisible({ timeout: 10000 });
+    await expect(importedImageMode).toBeVisible();
     await expect(importedImageMode).toHaveAttribute('aria-pressed', 'true');
 
     // Export doesn't include image_requests, so image types must be re-selected
diff --git a/playwright/Customizations/Registration.spec.ts b/playwright/Customizations/Registration.spec.ts
index c04d7d6646..30db865504 100644
--- a/playwright/Customizations/Registration.spec.ts
+++ b/playwright/Customizations/Registration.spec.ts
@@ -415,7 +415,6 @@ registrationModes.forEach(
           const saveButton = frame.getByRole('button', {
             name: 'Save changes to blueprint',
           });
-          await expect(saveButton).toBeEnabled();
           await saveButton.click();
         });
 

From 514c3ee3363f679ae1a6322338dfe2b86008bc8c Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 15:17:05 -0500
Subject: [PATCH 11/14] playwright: stop reporting every startup failure as a
 login failure

ensureAuthenticated waited for the app heading and treated a timeout as
proof the user was logged out. It then called login(), which looked for a
"Red Hat login" textbox on a page that was already the console, and failed
30 seconds later with a missing login field.

So any reason the app was slow to render arrived as evidence that
authentication was broken. A stage 502, a chrome-service outage, a
saturated dev proxy and a landing page that simply took longer than 30s
have all been reported that way, and each cost time before anyone looked
past the message.

Wait for the app or the login form, whichever appears, and log in only
when the login form is the thing that showed up. When neither appears,
say that the app did not render and point at the console and network log
rather than at SSO.

This narrows the budget for a genuinely absent login form from 60s to 30s.
The extra 30s was never deliberate - it came from spending the first
timeout on the wrong question.
---
 playwright/helpers/login.ts | 76 +++++++++++++++++++++++++++----------
 1 file changed, 55 insertions(+), 21 deletions(-)

diff --git a/playwright/helpers/login.ts b/playwright/helpers/login.ts
index af56dd5371..3d67600d89 100644
--- a/playwright/helpers/login.ts
+++ b/playwright/helpers/login.ts
@@ -1,6 +1,6 @@
 import path from 'path';
 
-import { expect, type Page } from '@playwright/test';
+import { expect, type Locator, type Page } from '@playwright/test';
 
 import { closePopupsIfExist, isHosted } from './helpers';
 import { ibFrame } from './navHelpers';
@@ -36,38 +36,72 @@ export const login = async (page: Page, staticUser: boolean = false) => {
   return loginCockpit(page, user, password);
 };
 
-/**
- * Checks if the user is already authenticated, if not, logs them in
- * @param page - the page object
- * @param staticUser - if true, use the static user instead of dynamically created one
- */
+// How long the app gets to render before we give up. The landing page loads
+// chrome, the federated module, and the blueprint and image lists, so this is
+// not instant on a loaded CI runner.
+const AUTH_TIMEOUT = 30_000;
+
+type AuthState = 'app' | 'login' | 'neither';
+
+const detectAuthState = async (
+  appHeading: Locator,
+  loginField: Locator,
+): Promise<AuthState> => {
+  // Checked before the login form so that an app which has already rendered
+  // is never mistaken for a login prompt.
+  if (await appHeading.isVisible().catch(() => false)) return 'app';
+  if (await loginField.isVisible().catch(() => false)) return 'login';
+  return 'neither';
+};
+
+// Waits for the app or the login form, whichever arrives, and logs in only if
+// the login form is the one that showed up.
+//
+// This used to wait for the app alone and treat a timeout as "not logged in".
+// A slow render therefore sent the run off to fill a login form that was not
+// there, and the failure surfaced 30 seconds later as a missing "Red Hat login"
+// textbox - which reads as broken authentication no matter what actually went
+// wrong. Stage outages, a chrome-service 502, a saturated dev proxy and a slow
+// render have all been reported that way.
 export const ensureAuthenticated = async (
   page: Page,
   staticUser: boolean = false,
 ) => {
-  // Navigate to the target page
-  if (isHosted()) {
-    await page.goto('/insights/image-builder/landing');
-  } else {
-    await page.goto('/cockpit-image-builder');
-  }
+  await page.goto(
+    isHosted() ? '/insights/image-builder/landing' : '/cockpit-image-builder',
+  );
 
-  // Check for authentication success indicator
-  const successIndicator = isHosted()
+  const appHeading = isHosted()
     ? page.getByRole('heading', { name: 'Image builder' })
     : ibFrame(page).getByRole('heading', { name: 'Image builder' });
 
-  let isAuthenticated = false;
+  const loginField = isHosted()
+    ? page.getByRole('textbox', { name: 'Red Hat login' })
+    : page.getByRole('textbox', { name: 'User name' });
+
+  // Held in an object because TypeScript does not track assignments made
+  // inside the poll callback.
+  const seen: { state: AuthState } = { state: 'neither' };
   try {
-    // Give it a 30 second period to load, it's less expensive than having to rerun the test
-    await expect(successIndicator).toBeVisible({ timeout: 30000 });
-    isAuthenticated = true;
+    await expect
+      .poll(
+        async () => {
+          seen.state = await detectAuthState(appHeading, loginField);
+          return seen.state;
+        },
+        { timeout: AUTH_TIMEOUT, intervals: [250, 500, 1000] },
+      )
+      .not.toBe('neither');
   } catch {
-    isAuthenticated = false;
+    throw new Error(
+      `Neither image builder nor the login form appeared within ` +
+        `${AUTH_TIMEOUT / 1000}s at ${page.url()}. The app did not render, ` +
+        `which is not the same as being logged out - check the browser ` +
+        `console and the network log in the trace before suspecting SSO.`,
+    );
   }
 
-  if (!isAuthenticated) {
-    // Not authenticated, need to login
+  if (seen.state === 'login') {
     await login(page, staticUser);
   }
 };

From bedf38bbfbe777d9228ccea435833cab0619fc9c Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 15:32:11 -0500
Subject: [PATCH 12/14] playwright: reload once before declaring the app dead

A blank landing page usually means the federated module never mounted, and
a reload recovers it often enough to be worth trying. The previous code
navigated a second time as a side effect of falling through to the login
flow, so this restores that attempt deliberately rather than as a
consequence of guessing wrong.

Also say which layer failed. If the console chrome rendered then image
builder failed to mount, and if it did not then the problem is upstream of
this repository entirely. Those get chased in different places, and the
message now distinguishes them instead of leaving it to whoever opens the
trace.
---
 playwright/helpers/login.ts | 54 +++++++++++++++++++++++++------------
 1 file changed, 37 insertions(+), 17 deletions(-)

diff --git a/playwright/helpers/login.ts b/playwright/helpers/login.ts
index 3d67600d89..857998338f 100644
--- a/playwright/helpers/login.ts
+++ b/playwright/helpers/login.ts
@@ -82,23 +82,43 @@ export const ensureAuthenticated = async (
   // Held in an object because TypeScript does not track assignments made
   // inside the poll callback.
   const seen: { state: AuthState } = { state: 'neither' };
-  try {
-    await expect
-      .poll(
-        async () => {
-          seen.state = await detectAuthState(appHeading, loginField);
-          return seen.state;
-        },
-        { timeout: AUTH_TIMEOUT, intervals: [250, 500, 1000] },
-      )
-      .not.toBe('neither');
-  } catch {
-    throw new Error(
-      `Neither image builder nor the login form appeared within ` +
-        `${AUTH_TIMEOUT / 1000}s at ${page.url()}. The app did not render, ` +
-        `which is not the same as being logged out - check the browser ` +
-        `console and the network log in the trace before suspecting SSO.`,
-    );
+  const settle = async () => {
+    try {
+      await expect
+        .poll(
+          async () => {
+            seen.state = await detectAuthState(appHeading, loginField);
+            return seen.state;
+          },
+          { timeout: AUTH_TIMEOUT, intervals: [250, 500, 1000] },
+        )
+        .not.toBe('neither');
+      return true;
+    } catch {
+      return false;
+    }
+  };
+
+  if (!(await settle())) {
+    // A blank page usually means the federated module never mounted. Reloading
+    // recovers it often enough to be worth one attempt before failing.
+    await page.reload();
+    if (!(await settle())) {
+      // Distinguishes "chrome never loaded" from "chrome loaded but our module
+      // did not", which need to be chased in completely different places.
+      const chromeRendered = await page
+        .getByRole('banner')
+        .isVisible()
+        .catch(() => false);
+      throw new Error(
+        `Neither image builder nor the login form appeared within ` +
+          `${(AUTH_TIMEOUT / 1000) * 2}s (including one reload) at ` +
+          `${page.url()}. The console chrome ` +
+          `${chromeRendered ? 'rendered, so the image builder module failed to mount' : 'did not render either, so this is upstream of image builder'}. ` +
+          `This is not an authentication failure - check the browser console ` +
+          `and network log in the trace.`,
+      );
+    }
   }
 
   if (seen.state === 'login') {

From 2c627de7f002f7106e6b2746d4a28dc2b9cfab7c Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 15:47:41 -0500
Subject: [PATCH 13/14] playwright: attach what the browser reported to failing
 tests

A timed out assertion can only say what it was waiting for, never why the
thing never arrived. A blank page, a crashed module and a slow backend
produce the same message, so working out which one it was has meant
reading the trace by hand, and often asking someone to do it.

Record uncaught exceptions, console errors and warnings, failed requests
and any response of 400 or above, and attach them to tests that fail.
Passing tests attach nothing.

On a landing page that never rendered this immediately shows the 404 on
fed-modules.json, which is the manifest chrome needs to mount any micro
frontend - the difference between "our app is broken" and "chrome could
not load anything" without opening the trace at all.
---
 README.md                                 | 21 +++++++
 playwright/fixtures/browserDiagnostics.ts | 76 +++++++++++++++++++++++
 playwright/fixtures/customizations.ts     |  2 +
 3 files changed, 99 insertions(+)
 create mode 100644 playwright/fixtures/browserDiagnostics.ts

diff --git a/README.md b/README.md
index 631ce2dd6f..877ed30c7a 100644
--- a/README.md
+++ b/README.md
@@ -413,6 +413,27 @@ PLAYWRIGHT_STATIC_PASSWORD="<your_static_user_password>"
 
 For local development purposes, you can use the same credentials as for `PLAYWRIGHT_USER` and `PLAYWRIGHT_PASSWORD` if you are using your stage account for those.
 
+### Diagnosing a failure that has no visible cause
+
+A blank page, a control that never appears, and a page that renders slowly all
+look identical from the outside: an assertion times out and says only what it
+was waiting for. Failing tests therefore carry a `browser-diagnostics.log`
+attachment in the HTML report, holding what the browser reported while the test
+ran - uncaught exceptions, console errors and warnings, requests that failed,
+and any response of 400 or above, each stamped with the time since the test
+started.
+
+```
++  1429ms  HTTP 404    GET .../apps/chrome/operator-generated/fed-modules.json
++  2759ms  CONSOLE WARNING Unsatisfied version * from undefined of shared
+                           singleton module react-router-dom (required =6.30.4)
++  3210ms  HTTP 400    GET .../api/rbac/v1/access/?application=inventory
+```
+
+Passing tests attach nothing. Warnings have a smaller budget than errors,
+because the console shell emits them in bursts and they would otherwise crowd
+out the entries worth reading.
+
 ### Finding flaky tests with injected latency
 
 Races between the browser and the API are hard to reproduce on demand. The
diff --git a/playwright/fixtures/browserDiagnostics.ts b/playwright/fixtures/browserDiagnostics.ts
new file mode 100644
index 0000000000..60d415af56
--- /dev/null
+++ b/playwright/fixtures/browserDiagnostics.ts
@@ -0,0 +1,76 @@
+import { test as base } from '@playwright/test';
+
+// Attaches what the browser reported to any test that fails. A blank page or a
+// control that never appears looks identical from the outside whether the cause
+// was a JS exception, a failed module load, or a backend returning 502, and the
+// assertion that times out can say nothing about which it was.
+//
+// Only failures produce an attachment, so a green run stays quiet.
+
+// Capped so that a page erroring in a loop cannot produce an unreadable
+// attachment. Warnings get their own smaller budget because the console shell
+// emits them in bursts, and they would otherwise crowd out the errors.
+const MAX_ERRORS = 150;
+const MAX_WARNINGS = 30;
+
+export type BrowserDiagnosticsFixture = {
+  browserDiagnostics: void;
+};
+
+export const test = base.extend<BrowserDiagnosticsFixture>({
+  browserDiagnostics: [
+    async ({ page }, use, testInfo) => {
+      const startedAt = Date.now();
+      const entries: string[] = [];
+      let errorCount = 0;
+      let warningCount = 0;
+
+      const record = (line: string, isWarning = false) => {
+        if (isWarning && warningCount >= MAX_WARNINGS) return;
+        if (!isWarning && errorCount >= MAX_ERRORS) return;
+        if (isWarning) warningCount++;
+        else errorCount++;
+        const at = String(Date.now() - startedAt).padStart(6);
+        entries.push(`+${at}ms  ${line}`);
+      };
+
+      page.on('pageerror', (error) =>
+        record(`PAGEERROR   ${error.message.split('\n')[0]}`),
+      );
+
+      page.on('console', (message) => {
+        const type = message.type();
+        if (type !== 'error' && type !== 'warning') return;
+        record(
+          `CONSOLE ${type.toUpperCase().padEnd(7)} ${message.text().slice(0, 300)}`,
+        );
+      });
+
+      page.on('requestfailed', (request) =>
+        record(
+          `REQ FAILED  ${request.method()} ${request.url().slice(0, 160)} ` +
+            `- ${request.failure()?.errorText ?? 'unknown'}`,
+        ),
+      );
+
+      page.on('response', (response) => {
+        if (response.status() < 400) return;
+        record(
+          `HTTP ${response.status()}    ${response.request().method()} ` +
+            `${response.url().slice(0, 160)}`,
+        );
+      });
+
+      await use(undefined);
+
+      if (testInfo.status === testInfo.expectedStatus) return;
+      if (entries.length === 0) return;
+
+      await testInfo.attach('browser-diagnostics.log', {
+        body: entries.join('\n'),
+        contentType: 'text/plain',
+      });
+    },
+    { auto: true },
+  ],
+});
diff --git a/playwright/fixtures/customizations.ts b/playwright/fixtures/customizations.ts
index bfbe52a3b6..3f408af703 100644
--- a/playwright/fixtures/customizations.ts
+++ b/playwright/fixtures/customizations.ts
@@ -3,6 +3,7 @@ import { mergeTests } from '@playwright/test';
 
 import { test as ariaHiddenTest } from './ariaHiddenWorkaround';
 import { blockAnalyticsTest } from './blockAnalytics';
+import { test as browserDiagnosticsTest } from './browserDiagnostics';
 import { test as cleanupTest } from './cleanup';
 import { test as coverageTest } from './coverage';
 import { test as networkChaosTest } from './networkChaos';
@@ -12,6 +13,7 @@ import { test as popupTest } from './popupHandler';
 export const test = mergeTests(
   ariaHiddenTest,
   blockAnalyticsTest,
+  browserDiagnosticsTest,
   cleanupTest,
   coverageTest,
   networkChaosTest,

From a73b80fe918651d85ad727b7168a71214c74939e Mon Sep 17 00:00:00 2001
From: Lucas Garfield <lucas@redhat.com>
Date: Thu, 13 Aug 2026 15:57:35 -0500
Subject: [PATCH 14/14] playwright: actually charge warnings to the warning
 budget

The diagnostics fixture gives warnings their own smaller cap so a burst of
them cannot crowd errors out of the attachment. The console handler never
said which budget it was drawing from, and the default is the error budget,
so every warning was charged there and the warning cap was never consulted.

Found reviewing the branch; the attachment content was always right, only
the cap routing was wrong.
---
 playwright/fixtures/browserDiagnostics.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/playwright/fixtures/browserDiagnostics.ts b/playwright/fixtures/browserDiagnostics.ts
index 60d415af56..1a894b7d1d 100644
--- a/playwright/fixtures/browserDiagnostics.ts
+++ b/playwright/fixtures/browserDiagnostics.ts
@@ -43,6 +43,7 @@ export const test = base.extend<BrowserDiagnosticsFixture>({
         if (type !== 'error' && type !== 'warning') return;
         record(
           `CONSOLE ${type.toUpperCase().padEnd(7)} ${message.text().slice(0, 300)}`,
+          type === 'warning',
         );
       });