From 97d4ad7cc8f64a2dc0e6882926cbf1ad6d997dc8 Mon Sep 17 00:00:00 2001 From: regexowl Date: Wed, 21 Feb 2024 09:58:50 +0100 Subject: [PATCH] test: Enable packages tests This re-enables previously disabled test for the Packages step. --- .../CreateImageWizard.content.test.tsx | 1080 +++++------------ .../CreateImageWizard.test.tsx | 22 +- 2 files changed, 329 insertions(+), 773 deletions(-) diff --git a/src/test/Components/CreateImageWizardV2/CreateImageWizard.content.test.tsx b/src/test/Components/CreateImageWizardV2/CreateImageWizard.content.test.tsx index 1cbe4c78..bd1f4562 100644 --- a/src/test/Components/CreateImageWizardV2/CreateImageWizard.content.test.tsx +++ b/src/test/Components/CreateImageWizardV2/CreateImageWizard.content.test.tsx @@ -2,24 +2,16 @@ import React from 'react'; import '@testing-library/jest-dom'; +import type { Router as RemixRouter } from '@remix-run/router'; import { screen, waitFor, within } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; -// import api from '../../../api.js'; import CreateImageWizard from '../../../Components/CreateImageWizardV2/CreateImageWizard'; -// import ShareImageModal from '../../../Components/ShareImageModal/ShareImageModal'; -// import { -// mockPkgResultAlpha, -// mockPkgResultAlphaContentSources, -// mockPkgResultAll, -// mockPkgResultPartial, -// } from '../../fixtures/packages'; import { clickBack, clickNext, renderCustomRoutesWithReduxRouter, - // renderWithReduxRouter, - // verifyCancelButton, + verifyCancelButton, } from '../../testUtils'; const routes = [ @@ -31,15 +23,10 @@ const routes = [ path: 'insights/image-builder/imagewizard/:composeId?', element: , }, - // { - // path: 'insights/image-builder/share/:composeId', - // element: , - // }, ]; // The router is just initiliazed here, it's assigned a value in the tests -// eslint-disable-next-line @typescript-eslint/no-unused-vars -let router = undefined; +let router: RemixRouter | undefined = undefined; jest.mock('@redhat-cloud-services/frontend-components/useChrome', () => ({ useChrome: () => ({ @@ -59,26 +46,7 @@ jest.mock('@redhat-cloud-services/frontend-components/useChrome', () => ({ getEnvironment: () => 'prod', }), })); -// -// const searchForAvailablePackages = async (searchbox, searchTerm) => { -// const user = userEvent.setup(); -// await user.type(searchbox, searchTerm); -// await user.click( -// await screen.findByRole('button', { -// name: /search button for available packages/i, -// }) -// ); -// }; -// -// const searchForChosenPackages = async (searchbox, searchTerm) => { -// const user = userEvent.setup(); -// if (!searchTerm) { -// await user.clear(searchbox); -// } else { -// await user.type(searchbox, searchTerm); -// } -// }; -// + let mockContentSourcesEnabled: boolean; jest.mock('@unleash/proxy-client-react', () => ({ useUnleashContext: () => jest.fn(), @@ -100,729 +68,317 @@ afterEach(() => { mockContentSourcesEnabled = true; }); -// describe('Step Packages', () => { -// describe('without Content Sources', () => { -// const user = userEvent.setup(); -// const setUp = async () => { -// mockContentSourcesEnabled = false; -// -// ({ router } = await renderCustomRoutesWithReduxRouter( -// 'imagewizard', -// {}, -// routes -// )); -// -// // select aws as upload destination -// await user.click(await screen.findByTestId('upload-aws')); -// await clickNext(); -// -// // aws step -// await user.click( -// await screen.findByRole('radio', { -// name: /manually enter an account id\./i, -// }) -// ); -// await user.type( -// await screen.findByTestId('aws-account-id'), -// '012345678901' -// ); -// await clickNext(); -// // skip registration -// await screen.findByRole('textbox', { -// name: 'Select activation key', -// }); -// -// await user.click(await screen.findByTestId('registration-radio-later')); -// await clickNext(); -// // skip fsc -// await clickNext(); -// }; -// -// test('clicking Next loads Image name', async () => { -// await setUp(); -// -// await clickNext(); -// -// await screen.findByRole('heading', { -// name: 'Details', -// }); -// }); -// -// test('clicking Back loads file system configuration', async () => { -// await setUp(); -// -// await clickBack(); -// -// await screen.findByRole('heading', { -// name: /file system configuration/i, -// }); -// }); -// -// test('clicking Cancel loads landing page', async () => { -// await setUp(); -// -// await verifyCancelButton(router); -// }); -// -// test('should display search bar and button', async () => { -// await setUp(); -// -// await user.type( -// await screen.findByTestId('search-available-pkgs-input'), -// 'test' -// ); -// -// await screen.findByRole('button', { -// name: 'Search button for available packages', -// }); -// }); -// -// test('should display default state', async () => { -// await setUp(); -// -// await screen.findByText( -// 'Search above to add additionalpackages to your image' -// ); -// await screen.findByText('No packages added'); -// }); -// -// test('search results should be sorted with most relevant results first', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = await within( -// availablePackagesList -// ).findAllByRole('option'); -// expect(availablePackagesItems).toHaveLength(3); -// const [firstItem, secondItem, thirdItem] = availablePackagesItems; -// expect(firstItem).toHaveTextContent('testsummary for test package'); -// expect(secondItem).toHaveTextContent('testPkgtest package summary'); -// expect(thirdItem).toHaveTextContent('lib-testlib-test package summary'); -// }); -// -// test('search results should be sorted after selecting them and then deselecting them', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// -// await user.click(await screen.findByTestId('available-pkgs-testPkg')); -// await user.click( -// await screen.findByRole('button', { name: /Add selected/ }) -// ); -// -// await user.click(await screen.findByTestId('selected-pkgs-testPkg')); -// await user.click( -// await screen.findByRole('button', { name: /Remove selected/ }) -// ); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = within(availablePackagesList).getAllByRole( -// 'option' -// ); -// expect(availablePackagesItems).toHaveLength(3); -// const [firstItem, secondItem, thirdItem] = availablePackagesItems; -// expect(firstItem).toHaveTextContent('testsummary for test package'); -// expect(secondItem).toHaveTextContent('testPkgtest package summary'); -// expect(thirdItem).toHaveTextContent('lib-testlib-test package summary'); -// }); -// -// test('search results should be sorted after adding and then removing all packages', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// -// await user.click(await screen.findByRole('button', { name: /Add all/ })); -// await user.click( -// await screen.findByRole('button', { name: /Remove all/ }) -// ); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = within(availablePackagesList).getAllByRole( -// 'option' -// ); -// expect(availablePackagesItems).toHaveLength(3); -// const [firstItem, secondItem, thirdItem] = availablePackagesItems; -// expect(firstItem).toHaveTextContent('testsummary for test package'); -// expect(secondItem).toHaveTextContent('testPkgtest package summary'); -// expect(thirdItem).toHaveTextContent('lib-testlib-test package summary'); -// }); -// -// test('removing a single package updates the state correctly', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// await user.click(await screen.findByRole('button', { name: /Add all/ })); -// -// // remove a single package -// await user.click(await screen.findByTestId('selected-pkgs-lib-test')); -// await user.click( -// await screen.findByRole('button', { name: /Remove selected/ }) -// ); -// -// // skip name page -// clickNext(); -// -// // review page -// clickNext(); -// -// let chosen = await screen.findByTestId('chosen-packages-count'); -// expect(chosen).toHaveTextContent('2'); -// -// // remove another package -// clickBack(); -// clickBack(); -// await screen.findByTestId('search-available-pkgs-input'); -// await user.click( -// await screen.findByRole('option', { -// name: /summary for test package/, -// }) -// ); -// await user.click( -// await screen.findByRole('button', { name: /Remove selected/ }) -// ); -// -// // review page -// clickNext(); -// clickNext(); -// -// chosen = await screen.findByTestId('chosen-packages-count'); -// expect(chosen).toHaveTextContent('1'); -// }); -// -// test('should display empty available state on failed search', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'asdf'); -// await screen.findByText('No results found'); -// }); -// -// test('should display empty available state on failed search after a successful search', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// -// await user.click( -// await screen.findByRole('button', { -// name: /clear available packages search/i, -// }) -// ); -// -// await searchForAvailablePackages(searchbox, 'asdf'); -// -// await screen.findByText('No results found'); -// }); -// -// test('should display empty chosen state on failed search', async () => { -// await setUp(); -// -// const searchboxAvailable = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// const searchboxChosen = screen.getAllByRole('textbox')[1]; -// -// await waitFor(() => expect(searchboxAvailable).toBeEnabled()); -// await user.click(searchboxAvailable); -// await searchForAvailablePackages(searchboxAvailable, 'test'); -// -// await user.click(await screen.findByRole('button', { name: /Add all/ })); -// -// await user.click(searchboxChosen); -// await user.type(searchboxChosen, 'asdf'); -// -// expect(await screen.findByText('No packages found')).toBeInTheDocument(); -// // We need to clear this input in order to not have sideeffects on other tests -// await searchForChosenPackages(searchboxChosen, ''); -// }); -// -// test('should display warning when over hundred results were found', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// const getPackages = jest -// .spyOn(api, 'getPackages') -// .mockImplementation((distribution, architecture, search, limit) => { -// return limit -// ? Promise.resolve(mockPkgResultAll) -// : Promise.resolve(mockPkgResultPartial); -// }); -// -// await searchForAvailablePackages(searchbox, 'testPkg'); -// await waitFor(() => expect(getPackages).toHaveBeenCalledTimes(2)); -// -// await screen.findByText('Over 100 results found. Refine your search.'); -// await screen.findByText('Too many results to display'); -// }); -// -// test('should display an exact match if found regardless of too many results', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// const getPackages = jest -// .spyOn(api, 'getPackages') -// .mockImplementation((distribution, architecture, search, limit) => { -// return limit -// ? Promise.resolve(mockPkgResultAll) -// : Promise.resolve(mockPkgResultPartial); -// }); -// -// await searchForAvailablePackages(searchbox, 'testPkg-128'); -// await waitFor(() => expect(getPackages).toHaveBeenCalledTimes(2)); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = await within( -// availablePackagesList -// ).findByRole('option'); -// expect(availablePackagesItems).toBeInTheDocument(); -// await screen.findByText('Exact match'); -// await screen.findByText('testPkg-128'); -// await screen.findByText('Too many results to display'); -// }); -// -// test('search results should be sorted alphabetically', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// const getPackages = jest -// .spyOn(api, 'getPackages') -// .mockImplementation(() => Promise.resolve(mockPkgResultAlpha)); -// -// await searchForAvailablePackages(searchbox, 'test'); -// await waitFor(() => expect(getPackages).toHaveBeenCalledTimes(1)); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = within(availablePackagesList).getAllByRole( -// 'option' -// ); -// expect(availablePackagesItems).toHaveLength(3); -// -// const [firstItem, secondItem, thirdItem] = availablePackagesItems; -// expect(firstItem).toHaveTextContent('testsummary for test package'); -// expect(secondItem).toHaveTextContent('lib-testlib-test package summary'); -// expect(thirdItem).toHaveTextContent('Z-testZ-test package summary'); -// }); -// -// test('available packages can be reset', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = await within( -// availablePackagesList -// ).findAllByRole('option'); -// expect(availablePackagesItems).toHaveLength(3); -// -// await user.click( -// await screen.findByRole('button', { -// name: /clear available packages search/i, -// }) -// ); -// -// await screen.findByText( -// 'Search above to add additionalpackages to your image' -// ); -// }); -// -// test('chosen packages can be reset after filtering', async () => { -// await setUp(); -// -// const availableSearchbox = screen.getAllByRole('textbox')[0]; -// -// await waitFor(() => expect(availableSearchbox).toBeEnabled()); -// await user.click(availableSearchbox); -// -// await searchForAvailablePackages(availableSearchbox, 'test'); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = await within( -// availablePackagesList -// ).findAllByRole('option'); -// await waitFor(() => expect(availablePackagesItems).toHaveLength(3)); -// -// await user.click(await screen.findByRole('button', { name: /Add all/ })); -// -// const chosenPackagesList = await screen.findByTestId('chosen-pkgs-list'); -// let chosenPackagesItems = await within(chosenPackagesList).findAllByRole( -// 'option' -// ); -// await waitFor(() => expect(chosenPackagesItems).toHaveLength(3)); -// -// const chosenSearchbox = screen.getAllByRole('textbox')[1]; -// await user.click(chosenSearchbox); -// await searchForChosenPackages(chosenSearchbox, 'lib'); -// chosenPackagesItems = await within(chosenPackagesList).findAllByRole( -// 'option' -// ); -// expect(chosenPackagesItems).toHaveLength(1); -// -// await user.click( -// await screen.findByRole('button', { -// name: /clear chosen packages search/i, -// }) -// ); -// chosenPackagesItems = await within(chosenPackagesList).findAllByRole( -// 'option' -// ); -// await waitFor(() => expect(chosenPackagesItems).toHaveLength(3)); -// }); -// }); -// -// describe('with Content Sources', () => { -// const user = userEvent.setup(); -// const setUp = async () => { -// ({ router } = renderCustomRoutesWithReduxRouter( -// 'imagewizard', -// {}, -// routes -// )); -// -// // select aws as upload destination -// await waitFor( -// async () => await user.click(await screen.findByTestId('upload-aws')) -// ); -// await clickNext(); -// -// // aws step -// await user.click( -// await screen.findByRole('radio', { -// name: /manually enter an account id\./i, -// }) -// ); -// await user.type( -// await screen.findByTestId('aws-account-id'), -// '012345678901' -// ); -// await clickNext(); -// // skip registration -// await screen.findByRole('textbox', { -// name: 'Select activation key', -// }); -// -// const registerLaterRadio = await screen.findByTestId( -// 'registration-radio-later' -// ); -// await user.click(registerLaterRadio); -// await clickNext(); -// // skip fsc -// await clickNext(); -// }; -// -// test('search results should be sorted with most relevant results first', async () => { -// await setUp(); -// -// const view = await screen.findByTestId('search-available-pkgs-input'); -// -// const searchbox = await within(view).findByRole('textbox', { -// name: /search input/i, -// }); -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = await within( -// availablePackagesList -// ).findAllByRole('option'); -// expect(availablePackagesItems).toHaveLength(3); -// const [firstItem, secondItem, thirdItem] = availablePackagesItems; -// expect(firstItem).toHaveTextContent('testsummary for test package'); -// expect(secondItem).toHaveTextContent('testPkgtest package summary'); -// expect(thirdItem).toHaveTextContent('lib-testlib-test package summary'); -// }); -// -// test('search results should be sorted after selecting them and then deselecting them', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// -// await user.click(await screen.findByTestId('available-pkgs-testPkg')); -// await user.click( -// await screen.findByRole('button', { name: /Add selected/ }) -// ); -// -// await user.click(await screen.findByTestId('selected-pkgs-testPkg')); -// await user.click( -// await screen.findByRole('button', { name: /Remove selected/ }) -// ); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = within(availablePackagesList).getAllByRole( -// 'option' -// ); -// expect(availablePackagesItems).toHaveLength(3); -// const [firstItem, secondItem, thirdItem] = availablePackagesItems; -// expect(firstItem).toHaveTextContent('testsummary for test package'); -// expect(secondItem).toHaveTextContent('testPkgtest package summary'); -// expect(thirdItem).toHaveTextContent('lib-testlib-test package summary'); -// }); -// -// test('search results should be sorted after adding and then removing all packages', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// -// await user.click(await screen.findByRole('button', { name: /Add all/ })); -// await user.click( -// await screen.findByRole('button', { name: /Remove all/ }) -// ); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = await within( -// availablePackagesList -// ).findAllByRole('option'); -// expect(availablePackagesItems).toHaveLength(3); -// const [firstItem, secondItem, thirdItem] = availablePackagesItems; -// expect(firstItem).toHaveTextContent('testsummary for test package'); -// expect(secondItem).toHaveTextContent('testPkgtest package summary'); -// expect(thirdItem).toHaveTextContent('lib-testlib-test package summary'); -// }); -// -// test('removing a single package updates the state correctly', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// await user.click(await screen.findByRole('button', { name: /Add all/ })); -// -// // remove a single package -// await user.click(await screen.findByTestId('selected-pkgs-lib-test')); -// await user.click( -// await screen.findByRole('button', { name: /Remove selected/ }) -// ); -// // skip Custom repositories page -// clickNext(); -// -// // skip name page -// clickNext(); -// -// // review page -// clickNext(); -// -// const chosen = await screen.findByTestId('chosen-packages-count'); -// expect(chosen).toHaveTextContent('2'); -// }); -// -// test('should display empty available state on failed search', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'asdf'); -// -// await screen.findByText('No results found'); -// }); -// -// test('should display empty chosen state on failed search', async () => { -// await setUp(); -// -// const searchboxAvailable = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// const searchboxChosen = screen.getAllByRole('textbox')[1]; -// -// await waitFor(() => expect(searchboxAvailable).toBeEnabled()); -// await user.click(searchboxAvailable); -// await searchForAvailablePackages(searchboxAvailable, 'test'); -// -// await user.click(await screen.findByRole('button', { name: /Add all/ })); -// -// await user.click(searchboxChosen); -// await user.type(searchboxChosen, 'asdf'); -// -// expect(await screen.findByText('No packages found')).toBeInTheDocument(); -// // We need to clear this input in order to not have sideeffects on other tests -// await searchForChosenPackages(searchboxChosen, ''); -// }); -// -// test('search results should be sorted alphabetically', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// const getPackages = jest -// .spyOn(api, 'getPackagesContentSources') -// .mockImplementation(() => -// Promise.resolve(mockPkgResultAlphaContentSources) -// ); -// -// await searchForAvailablePackages(searchbox, 'test'); -// await waitFor(() => expect(getPackages).toHaveBeenCalledTimes(1)); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = within(availablePackagesList).getAllByRole( -// 'option' -// ); -// expect(availablePackagesItems).toHaveLength(3); -// -// const [firstItem, secondItem, thirdItem] = availablePackagesItems; -// expect(firstItem).toHaveTextContent('testsummary for test package'); -// expect(secondItem).toHaveTextContent('lib-testlib-test package summary'); -// expect(thirdItem).toHaveTextContent('Z-testZ-test package summary'); -// }); -// -// test('available packages can be reset', async () => { -// await setUp(); -// -// const searchbox = screen.getAllByRole('textbox')[0]; -// -// await waitFor(() => expect(searchbox).toBeEnabled()); -// await user.click(searchbox); -// -// await searchForAvailablePackages(searchbox, 'test'); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = await within( -// availablePackagesList -// ).findAllByRole('option'); -// expect(availablePackagesItems).toHaveLength(3); -// -// await user.click( -// await screen.findByRole('button', { -// name: /clear available packages search/i, -// }) -// ); -// -// await screen.findByText( -// 'Search above to add additionalpackages to your image' -// ); -// }); -// -// test('chosen packages can be reset after filtering', async () => { -// await setUp(); -// -// const availableSearchbox = screen.getAllByRole('textbox')[0]; -// -// await waitFor(() => expect(availableSearchbox).toBeEnabled()); -// await user.click(availableSearchbox); -// -// await searchForAvailablePackages(availableSearchbox, 'test'); -// -// const availablePackagesList = await screen.findByTestId( -// 'available-pkgs-list' -// ); -// const availablePackagesItems = await within( -// availablePackagesList -// ).findAllByRole('option'); -// expect(availablePackagesItems).toHaveLength(3); -// -// await user.click(await screen.findByRole('button', { name: /Add all/ })); -// -// const chosenPackagesList = await screen.findByTestId('chosen-pkgs-list'); -// let chosenPackagesItems = await within(chosenPackagesList).findAllByRole( -// 'option' -// ); -// expect(chosenPackagesItems).toHaveLength(3); -// -// const chosenSearchbox = screen.getAllByRole('textbox')[1]; -// await user.click(chosenSearchbox); -// await searchForChosenPackages(chosenSearchbox, 'lib'); -// chosenPackagesItems = within(chosenPackagesList).getAllByRole('option'); -// expect(chosenPackagesItems).toHaveLength(1); -// -// await user.click( -// await screen.findByRole('button', { -// name: /clear chosen packages search/i, -// }) -// ); -// chosenPackagesItems = await within(chosenPackagesList).findAllByRole( -// 'option' -// ); -// await waitFor(() => expect(chosenPackagesItems).toHaveLength(3)); -// }); -// }); -// }); -// +const typeIntoSearchBox = async (searchTerm: string) => { + const searchbox = await screen.findByRole('textbox', { + name: /search packages/i, + }); + + await userEvent.click(searchbox); + await userEvent.type(searchbox, searchTerm); +}; + +const clearSearchBox = async () => { + const searchbox = await screen.findByRole('textbox', { + name: /search packages/i, + }); + + await userEvent.click(searchbox); + await userEvent.clear(searchbox); +}; + +const getAllCheckboxes = async () => { + const pkgTable = await screen.findByTestId('packages-table'); + await screen.findAllByTestId('package-row'); + + const checkboxes = await within(pkgTable).findAllByRole('checkbox', { + name: /select row/i, + }); + + return checkboxes; +}; + +const toggleSelected = async () => { + await userEvent.click( + await screen.findByRole('button', { name: /selected/i }) + ); +}; + +const clickRefresh = async () => { + await userEvent.click( + await screen.findByRole('button', { name: /refresh/i }) + ); +}; + +describe('Step Packages', () => { + const setUp = async () => { + mockContentSourcesEnabled = false; + + ({ router } = await renderCustomRoutesWithReduxRouter( + 'imagewizard', + {}, + routes + )); + + // select aws as upload destination + await userEvent.click(await screen.findByTestId('upload-aws')); + await clickNext(); + + // aws step + await userEvent.click( + await screen.findByRole('radio', { + name: /manually enter an account id\./i, + }) + ); + await userEvent.type( + await screen.findByRole('textbox', { + name: 'aws account id', + }), + '012345678901' + ); + await clickNext(); + // skip registration + await screen.findByRole('textbox', { + name: 'Select activation key', + }); + + await userEvent.click( + await screen.findByTestId('registration-radio-later') + ); + await clickNext(); + // skip OpenSCAP + await clickNext(); + // skip Repositories + await clickNext(); + // skip fsc + //await clickNext(); + }; + + test('clicking Next loads Image name', async () => { + await setUp(); + + await clickNext(); + + await screen.findByRole('heading', { + name: 'Details', + }); + }); + + test('clicking Back loads repositories', async () => { + await setUp(); + + await clickBack(); + + await screen.findByRole('heading', { + name: /Custom repositories/i, + }); + }); + + test('clicking Cancel loads landing page', async () => { + await setUp(); + + await verifyCancelButton(router); + }); + + test('should display search bar and button', async () => { + await setUp(); + + await typeIntoSearchBox('test'); + + await screen.findByRole('button', { + name: /refresh/i, + }); + }); + + test('should display default state', async () => { + await setUp(); + + await screen.findByText( + 'Search above to add additionalpackages to your image' + ); + }); + + test('should display an exact match if found regardless of too many results', async () => { + await setUp(); + + await typeIntoSearchBox('testPkg-123'); + await clickRefresh(); + + await screen.findByTestId('exact-match-row'); + + await screen.findByRole('heading', { + name: /too many results to display/i, + }); + }); + + test('search results should be sorted with most relevant results first', async () => { + await setUp(); + + await typeIntoSearchBox('test'); + + const packagesTable = await screen.findByTestId('packages-table'); + + const getRows = async () => + await within(packagesTable).findAllByTestId('package-row'); + const availablePackages = await getRows(); + + await waitFor(() => expect(availablePackages).toHaveLength(6)); + + expect(availablePackages[0]).toHaveTextContent('test'); + expect(availablePackages[1]).toHaveTextContent('test-sources'); + expect(availablePackages[2]).toHaveTextContent('testPkg'); + expect(availablePackages[3]).toHaveTextContent('testPkg-sources'); + expect(availablePackages[4]).toHaveTextContent('lib-test'); + expect(availablePackages[5]).toHaveTextContent('lib-test-sources'); + }); + + test('selected packages are sorted the same way as available packages', async () => { + await setUp(); + + await typeIntoSearchBox('test'); + + const checkboxes = await getAllCheckboxes(); + + for (const checkbox in checkboxes) { + await userEvent.click(checkboxes[checkbox]); + } + + await toggleSelected(); + + const packagesTable = await screen.findByTestId('packages-table'); + + const getRows = async () => + await within(packagesTable).findAllByTestId('package-row'); + const availablePackages = await getRows(); + + await waitFor(() => expect(availablePackages).toHaveLength(6)); + + expect(availablePackages[0]).toHaveTextContent('test'); + expect(availablePackages[1]).toHaveTextContent('test-sources'); + expect(availablePackages[2]).toHaveTextContent('testPkg'); + expect(availablePackages[3]).toHaveTextContent('testPkg-sources'); + expect(availablePackages[4]).toHaveTextContent('lib-test'); + expect(availablePackages[5]).toHaveTextContent('lib-test-sources'); + }); + + test('selected packages persist throughout steps', async () => { + await setUp(); + + await typeIntoSearchBox('test'); + const pkgTable = await screen.findByTestId('packages-table'); + await screen.findAllByTestId('package-row'); + + const getFirstPkgCheckbox = async () => + await within(pkgTable).findByRole('checkbox', { + name: /select row 0/i, + }); + let firstPkgCheckbox = (await getFirstPkgCheckbox()) as HTMLInputElement; + + expect(firstPkgCheckbox.checked).toEqual(false); + await userEvent.click(firstPkgCheckbox); + expect(firstPkgCheckbox.checked).toEqual(true); + + await clickNext(); + await clickBack(); + + firstPkgCheckbox = (await getFirstPkgCheckbox()) as HTMLInputElement; + expect(firstPkgCheckbox.checked).toEqual(true); + }); + + test('removing a single package updates the state correctly', async () => { + await setUp(); + + await typeIntoSearchBox('test'); + + const checkboxes = await getAllCheckboxes(); + + await userEvent.click(checkboxes[0]); + expect(await screen.findByText('1 selected')); + + await userEvent.click(checkboxes[2]); + expect(await screen.findByText('2 selected')); + + await userEvent.click(checkboxes[0]); + expect(await screen.findAllByText('1 selected')); + }); + + test('should display empty available state on failed search', async () => { + await setUp(); + + await typeIntoSearchBox('asdf'); + + await screen.findByText('No results found'); + }); + + test('should display too many results state for more than 100 results', async () => { + await setUp(); + + await typeIntoSearchBox('te'); + + await screen.findByText('Too many results to display'); + }); + + test('should display relevant results in selected first', async () => { + await setUp(); + + await typeIntoSearchBox('test'); + + const checkboxes = await getAllCheckboxes(); + + await userEvent.click(checkboxes[0]); + await userEvent.click(checkboxes[1]); + + await clearSearchBox(); + await typeIntoSearchBox('mock'); + await clickRefresh(); + + await userEvent.click(checkboxes[0]); + await userEvent.click(checkboxes[1]); + + await toggleSelected(); + + await clearSearchBox(); + await typeIntoSearchBox('test'); + await clickRefresh(); + + const packagesTable = await screen.findByTestId('packages-table'); + + const getRows = async () => + await within(packagesTable).findAllByTestId('package-row'); + const availablePackages = await getRows(); + + expect(availablePackages[0]).toHaveTextContent('test'); + expect(availablePackages[1]).toHaveTextContent('test-sources'); + }); + + test('bulk select works', async () => { + await setUp(); + + await typeIntoSearchBox('test'); + + await userEvent.click( + await screen.findByRole('checkbox', { name: /select all/i }) + ); + + let checkboxes = await getAllCheckboxes(); + + for (const checkbox in checkboxes) { + const pkgCheckbox = checkboxes[checkbox] as HTMLInputElement; + expect(pkgCheckbox.checked).toEqual(true); + } + + await userEvent.click( + await screen.findByRole('checkbox', { name: /select all/i }) + ); + + checkboxes = await getAllCheckboxes(); + + for (const checkbox in checkboxes) { + const pkgCheckbox = checkboxes[checkbox] as HTMLInputElement; + expect(pkgCheckbox.checked).toEqual(false); + } + }); +}); + describe('Step Custom repositories', () => { const user = userEvent.setup(); const setUp = async () => { @@ -859,10 +415,8 @@ describe('Step Custom repositories', () => { await clickNext(); // skip OpenSCAP await clickNext(); - // // skip fsc - // await clickNext(); - // // skip packages - // await clickNext(); + // skip fsc + //await clickNext(); }; test('selected repositories stored in and retrieved from form state', async () => { diff --git a/src/test/Components/CreateImageWizardV2/CreateImageWizard.test.tsx b/src/test/Components/CreateImageWizardV2/CreateImageWizard.test.tsx index 04ca2185..2d6824e9 100644 --- a/src/test/Components/CreateImageWizardV2/CreateImageWizard.test.tsx +++ b/src/test/Components/CreateImageWizardV2/CreateImageWizard.test.tsx @@ -121,10 +121,10 @@ describe('Create Image Wizard', () => { await screen.findByRole('button', { name: 'Register' }); // await screen.findByRole('button', { name: 'File system configuration' }); await screen.findByRole('button', { name: 'Content' }); - // await screen.findByRole('button', { name: 'Additional Red Hat packages' }); await screen.findByRole('button', { name: 'Custom repositories' }); + await screen.findByRole('button', { name: 'Additional packages' }); await screen.findByRole('button', { name: 'Details' }); - // await screen.findByRole('button', { name: 'Review' }); + await screen.findByRole('button', { name: 'Review' }); }); }); @@ -870,10 +870,10 @@ describe('Step Upload to AWS', () => { await clickNext(); // skip repositories await clickNext(); - // // skip fsc - // await clickNext(); - // // skip packages - // await clickNext(); + // skip packages + await clickNext(); + // skip fsc + //await clickNext(); }; test('image name invalid for more than 63 chars', async () => { @@ -926,7 +926,7 @@ describe('Step Upload to AWS', () => { ); await clickNext(); - // // aws step + // aws step await switchToAWSManual(); await user.type( await screen.findByRole('textbox', { @@ -950,6 +950,8 @@ describe('Step Upload to AWS', () => { await clickNext(); // skip repositories await clickNext(); + // skip packages + await clickNext(); // skip Details const blueprintName = await screen.findByRole('textbox', { name: /blueprint name/i, @@ -985,7 +987,7 @@ describe('Step Upload to AWS', () => { ); await clickNext(); - // // aws step + // aws step await switchToAWSManual(); await user.type( await screen.findByRole('textbox', { @@ -1008,8 +1010,8 @@ describe('Step Upload to AWS', () => { await clickNext(); // skip packages - // await clickNext(); - // skip repositories + await clickNext(); + // skip repositories await clickNext(); // skip Details const blueprintName = await screen.findByRole('textbox', {