test: Move and re-enabled Details test

There was a disabled Details test in CreateImageWizard.test.tsx, this moves the test to Details.test.tsx, updates it and enables it again. The re-enabled tests are checking maximum length of image name and description.
osbuild · Oct 14, 2024 · 8722d79 · 8722d79
1 parent 38cc047
commit 8722d79
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 92 deletions.
diff --git a/src/test/Components/CreateImageWizard/CreateImageWizard.test.tsx b/src/test/Components/CreateImageWizard/CreateImageWizard.test.tsx
@@ -59,92 +59,6 @@ describe('Create Image Wizard', () => {
   });
 });
 
-//describe('Step Details', () => {
-//  beforeEach(() => {
-//    vi.clearAllMocks();
-//    router = undefined;
-//  });
-//
-//  const user = userEvent.setup();
-//  const setUp = async () => {
-//    ({ router } = await renderCustomRoutesWithReduxRouter(
-//      'imagewizard',
-//      {},
-//      routes
-//    ));
-//
-//    // select aws as upload destination
-//    const uploadAws = await screen.findByTestId('upload-aws');
-//    user.click(uploadAws);
-//    await clickNext();
-//
-//    // aws step
-//    await switchToAWSManual();
-//    const awsAccountId = await screen.findByRole('textbox', {
-//      name: 'aws account id',
-//    });
-//
-//    await waitFor(() => user.type(awsAccountId, '012345678901'));
-//
-//    await clickNext();
-//    // skip registration
-//    await screen.findByRole('textbox', {
-//      name: 'Select activation key',
-//    });
-//
-//    const registerLaterRadio = screen.getByTestId('registration-radio-later');
-//    user.click(registerLaterRadio);
-//    await clickNext();
-//    // skip oscap
-//    await clickNext();
-//    // skip repositories
-//    await clickNext();
-//    // skip packages
-//    await clickNext();
-//    // skip fsc
-//    await clickNext();
-//    // skip snapshot
-//    await clickNext();
-//    //skip firstBoot
-//    await clickNext();
-//  };
-//
-//  test('image name invalid for more than 100 chars and description for 250', async () => {
-//    await setUp();
-//
-//    // Enter image name
-//    const invalidName = 'a'.repeat(101);
-//    await enterBlueprintName(invalidName);
-//    expect(await getNextButton()).toHaveClass('pf-m-disabled');
-//    expect(await getNextButton()).toBeDisabled();
-//    const nameInput = await screen.findByRole('textbox', {
-//      name: /blueprint name/i,
-//    });
-//    await waitFor(() => user.clear(nameInput));
-//
-//    await enterBlueprintName();
-//
-//    expect(await getNextButton()).not.toHaveClass('pf-m-disabled');
-//    expect(await getNextButton()).toBeEnabled();
-//
-//    // Enter description image
-//    const descriptionInput = await screen.findByRole('textbox', {
-//      name: /description/i,
-//    });
-//
-//    const invalidDescription = 'a'.repeat(251);
-//    await waitFor(() => user.type(descriptionInput, invalidDescription));
-//
-//    expect(await getNextButton()).toHaveClass('pf-m-disabled');
-//    expect(await getNextButton()).toBeDisabled();
-//    await waitFor(() => user.clear(descriptionInput));
-//    await waitFor(() => user.type(descriptionInput, 'valid-description'));
-//
-//    expect(await getNextButton()).not.toHaveClass('pf-m-disabled');
-//    expect(await getNextButton()).toBeEnabled();
-//  }, 20000);
-//});
-
 describe('Keyboard accessibility', () => {
   beforeEach(() => {
     vi.clearAllMocks();

diff --git a/src/test/Components/CreateImageWizard/steps/Details/Details.test.tsx b/src/test/Components/CreateImageWizard/steps/Details/Details.test.tsx
@@ -27,14 +27,17 @@ const goToDetailsStep = async () => {
   await clickNext();
 };
 
-const enterBlueprintDescription = async () => {
-  const user = userEvent.setup();
+const enterBlueprintDescription = async (
+  description: string = 'Now with extra carmine!'
+) => {
+  const user = userEvent.setup({ delay: null });
   const blueprintDescription = await screen.findByRole('textbox', {
     name: /blueprint description/i,
   });
-  await waitFor(() =>
-    user.type(blueprintDescription, 'Now with extra carmine!')
-  );
+
+  await waitFor(() => user.clear(blueprintDescription));
+  await waitFor(() => expect(blueprintDescription).toHaveValue(''));
+  await waitFor(() => user.type(blueprintDescription, description));
 };
 
 const goToReviewStep = async () => {
@@ -86,6 +89,42 @@ describe('Step Details', () => {
     await waitFor(() => expect(nextButton).toBeDisabled());
   });
 
+  test('name invalid for more than 100 chars', async () => {
+    await renderCreateMode();
+    await goToRegistrationStep();
+    await clickRegisterLater();
+    await goToDetailsStep();
+
+    // enter invalid image name
+    const invalidName = 'a'.repeat(101);
+    await enterBlueprintName(invalidName);
+    expect(await getNextButton()).toHaveClass('pf-m-disabled');
+    expect(await getNextButton()).toBeDisabled();
+
+    // enter valid image name
+    await enterBlueprintName();
+    expect(await getNextButton()).not.toHaveClass('pf-m-disabled');
+    expect(await getNextButton()).toBeEnabled();
+  });
+
+  test('description invalid for more than 250', async () => {
+    await renderCreateMode();
+    await goToRegistrationStep();
+    await clickRegisterLater();
+    await goToDetailsStep();
+
+    // enter invalid image description
+    const invalidDescription = 'a'.repeat(251);
+    await enterBlueprintDescription(invalidDescription);
+    expect(await getNextButton()).toHaveClass('pf-m-disabled');
+    expect(await getNextButton()).toBeDisabled();
+
+    // enter valid image description
+    await enterBlueprintDescription();
+    expect(await getNextButton()).not.toHaveClass('pf-m-disabled');
+    expect(await getNextButton()).toBeEnabled();
+  });
+
   test('revisit step button on Review works', async () => {
     await renderCreateMode();
     await goToRegistrationStep();

diff --git a/src/test/Components/CreateImageWizard/wizardTestUtils.tsx b/src/test/Components/CreateImageWizard/wizardTestUtils.tsx
@@ -127,7 +127,7 @@ export const selectCustomRepo = async () => {
 };
 
 export const enterBlueprintName = async (name: string = 'Red Velvet') => {
-  const user = userEvent.setup();
+  const user = userEvent.setup({ delay: null });
   const blueprintName = await screen.findByRole('textbox', {
     name: /blueprint name/i,
   });