particle-os/debian-image-builder-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

test: Update CreateImageWizard tests

Browse source 
This updates following test suites after bumping react and testing-library:
- CreateImageWizard.azure.test.js
- CreateImageWizard.azure.2.test.js
- CreateImageWizard.content.test.js
- CreateImageWizard.test.js
This commit is contained in:
regexowl 2023-08-28 15:04:50 +02:00 • committed by Lucas Garfield
parent 9f3ed3d0ec
commit e71d98da08
4 changed files with 467 additions and 725 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/test/Components/CreateImageWizard/CreateImageWizard.azure.2.test.js
View file

@ -2,6 +2,7 @@ import React from 'react';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import { screen } from '@testing-library/react'; import { screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { rest } from 'msw'; import { rest } from 'msw';
import CreateImageWizard from '../../../Components/CreateImageWizard/CreateImageWizard'; import CreateImageWizard from '../../../Components/CreateImageWizard/CreateImageWizard';
@ -54,11 +55,12 @@ describe('Step Upload to Azure', () => {
jest.clearAllMocks(); jest.clearAllMocks();
}); });
const user = userEvent.setup();
const setUp = async () => { const setUp = async () => {
renderCustomRoutesWithReduxRouter('imagewizard', {}, routes); renderCustomRoutesWithReduxRouter('imagewizard', {}, routes);
// select aws as upload destination // select Azure as upload destination
const azureTile = screen.getByTestId('upload-azure'); await user.click(screen.getByTestId('upload-azure'));
azureTile.click();
await clickNext(); await clickNext();

75
src/test/Components/CreateImageWizard/CreateImageWizard.azure.test.js
View file

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import { act, screen, waitFor } from '@testing-library/react'; import { screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event'; import userEvent from '@testing-library/user-event';
import CreateImageWizard from '../../../Components/CreateImageWizard/CreateImageWizard'; import CreateImageWizard from '../../../Components/CreateImageWizard/CreateImageWizard';
@ -74,8 +74,7 @@ describe('Step Upload to Azure', () => {
const setUp = async () => { const setUp = async () => {
({ router } = renderCustomRoutesWithReduxRouter('imagewizard', {}, routes)); ({ router } = renderCustomRoutesWithReduxRouter('imagewizard', {}, routes));
// select Azure as upload destination // select Azure as upload destination
const azureTile = screen.getByTestId('upload-azure'); user.click(await screen.findByTestId('upload-azure'));
azureTile.click();
await clickNext(); await clickNext();
@ -87,7 +86,7 @@ describe('Step Upload to Azure', () => {
test('clicking Next loads Registration', async () => { test('clicking Next loads Registration', async () => {
await setUp(); await setUp();
await user.click(screen.getByTestId('azure-radio-manual')); await user.click(await screen.findByTestId('azure-radio-manual'));
// Randomly generated GUID // Randomly generated GUID
await user.type( await user.type(
screen.getByTestId('azure-tenant-id-manual'), screen.getByTestId('azure-tenant-id-manual'),
@ -101,9 +100,7 @@ describe('Step Upload to Azure', () => {
screen.getByTestId('azure-resource-group-manual'), screen.getByTestId('azure-resource-group-manual'),
'testResourceGroup' 'testResourceGroup'
); );
await act(async () => { clickNext();
await clickNext();
});
await screen.findByRole('textbox', { await screen.findByRole('textbox', {
name: 'Select activation key', name: 'Select activation key',
@ -130,14 +127,15 @@ describe('Step Upload to Azure', () => {
test('azure step basics works', async () => { test('azure step basics works', async () => {
await setUp(); await setUp();
const nextButton = await getNextButton();
expect(await getNextButton()).toHaveClass('pf-m-disabled'); expect(nextButton).toHaveClass('pf-m-disabled');
expect(screen.getByTestId('azure-radio-source')).toBeChecked(); expect(screen.getByTestId('azure-radio-source')).toBeChecked();
await user.click(screen.getByTestId('azure-radio-manual')); await user.click(screen.getByTestId('azure-radio-manual'));
expect(screen.getByTestId('azure-radio-manual')).toBeChecked(); expect(screen.getByTestId('azure-radio-manual')).toBeChecked();
expect(await getNextButton()).toHaveClass('pf-m-disabled'); expect(nextButton).toHaveClass('pf-m-disabled');
const tenantId = screen.getByTestId('azure-tenant-id-manual'); const tenantId = screen.getByTestId('azure-tenant-id-manual');
expect(tenantId).toHaveValue(''); expect(tenantId).toHaveValue('');
@ -152,11 +150,11 @@ describe('Step Upload to Azure', () => {
expect(resourceGroup).toBeEnabled(); expect(resourceGroup).toBeEnabled();
await user.type(resourceGroup, 'testGroup'); await user.type(resourceGroup, 'testGroup');
expect(await getNextButton()).not.toHaveClass('pf-m-disabled'); expect(nextButton).not.toHaveClass('pf-m-disabled');
screen.getByTestId('azure-radio-source').click(); user.click(screen.getByTestId('azure-radio-source'));
expect(await getNextButton()).toHaveClass('pf-m-disabled'); await waitFor(() => expect(nextButton).toHaveClass('pf-m-disabled'));
const sourceDropdown = await getSourceDropdown(); const sourceDropdown = await getSourceDropdown();
@ -164,26 +162,28 @@ describe('Step Upload to Azure', () => {
expect(screen.getByTestId('azure-tenant-id-source')).toHaveValue(''); expect(screen.getByTestId('azure-tenant-id-source')).toHaveValue('');
expect(screen.getByTestId('azure-subscription-id-source')).toHaveValue(''); expect(screen.getByTestId('azure-subscription-id-source')).toHaveValue('');
sourceDropdown.click(); user.click(sourceDropdown);
const source = await screen.findByRole('option', { user.click(
name: /azureSource1/i, await screen.findByRole('option', {
}); name: /azureSource1/i,
source.click(); })
);
// wait for fetching the upload info // wait for fetching the upload info
await waitFor(() => await waitFor(() =>
expect(screen.getByTestId('azure-tenant-id-source')).not.toHaveValue('') expect(screen.getByTestId('azure-tenant-id-source')).not.toHaveValue('')
); );
const resourceGroupDropdown = screen.getByRole('textbox', { await user.click(
name: /select resource group/i, screen.getByRole('textbox', {
}); name: /select resource group/i,
await user.click(resourceGroupDropdown); })
);
const groups = screen.getAllByLabelText(/^Resource group/); const groups = screen.getAllByLabelText(/^Resource group/);
expect(groups).toHaveLength(2); expect(groups).toHaveLength(2);
await user.click(screen.getByLabelText('Resource group myResourceGroup1')); await user.click(screen.getByLabelText('Resource group myResourceGroup1'));
expect(await getNextButton()).not.toHaveClass('pf-m-disabled'); expect(nextButton).not.toHaveClass('pf-m-disabled');
}, 10000); }, 10000);
test('handles change of selected Source', async () => { test('handles change of selected Source', async () => {
@ -191,30 +191,33 @@ describe('Step Upload to Azure', () => {
const sourceDropdown = await getSourceDropdown(); const sourceDropdown = await getSourceDropdown();
sourceDropdown.click(); user.click(sourceDropdown);
const source = await screen.findByRole('option', { user.click(
name: /azureSource1/i, await screen.findByRole('option', {
}); name: /azureSource1/i,
source.click(); })
);
await waitFor(() => await waitFor(() =>
expect(screen.getByTestId('azure-tenant-id-source')).not.toHaveValue('') expect(screen.getByTestId('azure-tenant-id-source')).not.toHaveValue('')
); );
sourceDropdown.click(); user.click(sourceDropdown);
const source2 = await screen.findByRole('option', { user.click(
name: /azureSource2/i, await screen.findByRole('option', {
}); name: /azureSource2/i,
source2.click(); })
);
await waitFor(() => await waitFor(() =>
expect(screen.getByTestId('azure-tenant-id-source')).toHaveValue( expect(screen.getByTestId('azure-tenant-id-source')).toHaveValue(
'73d5694c-7a28-417e-9fca-55840084f508' '73d5694c-7a28-417e-9fca-55840084f508'
) )
); );
const resourceGroupDropdown = screen.getByRole('textbox', { await user.click(
name: /select resource group/i, screen.getByRole('textbox', {
}); name: /select resource group/i,
await user.click(resourceGroupDropdown); })
);
const groups = screen.getByLabelText(/^Resource group/); const groups = screen.getByLabelText(/^Resource group/);
expect(groups).toBeInTheDocument(); expect(groups).toBeInTheDocument();
expect(screen.getByLabelText('Resource group theirGroup2')).toBeVisible(); expect(screen.getByLabelText('Resource group theirGroup2')).toBeVisible();

450
src/test/Components/CreateImageWizard/CreateImageWizard.content.test.js
View file

@ -2,7 +2,7 @@ import React from 'react';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import { act, screen, waitFor, within } from '@testing-library/react'; import { screen, waitFor, within } from '@testing-library/react';
import userEvent from '@testing-library/user-event'; import userEvent from '@testing-library/user-event';
import api from '../../../api.js'; import api from '../../../api.js';
@ -69,11 +69,11 @@ jest
const searchForAvailablePackages = async (searchbox, searchTerm) => { const searchForAvailablePackages = async (searchbox, searchTerm) => {
const user = userEvent.setup(); const user = userEvent.setup();
await user.type(searchbox, searchTerm); await user.type(searchbox, searchTerm);
await act(async () => { user.click(
screen await screen.findByRole('button', {
.getByRole('button', { name: /search button for available packages/i }) name: /search button for available packages/i,
.click(); })
}); );
}; };
const searchForChosenPackages = async (searchbox, searchTerm) => { const searchForChosenPackages = async (searchbox, searchTerm) => {
@ -119,44 +119,37 @@ describe('Step Packages', () => {
)); ));
// select aws as upload destination // select aws as upload destination
const awsTile = screen.getByTestId('upload-aws'); await user.click(await screen.findByTestId('upload-aws'));
await act(async () => { await clickNext();
awsTile.click();
await clickNext();
});
// aws step // aws step
const manualRadio = screen.getByRole('radio', { user.click(
name: /manually enter an account id\./i, screen.getByRole('radio', {
}); name: /manually enter an account id\./i,
manualRadio.click(); })
const aai = screen.getByTestId('aws-account-id'); );
await act(async () => { await user.type(
await user.type(aai, '012345678901'); await screen.findByTestId('aws-account-id'),
await clickNext(); '012345678901'
}); );
await clickNext();
// skip registration // skip registration
await screen.findByRole('textbox', { await screen.findByRole('textbox', {
name: 'Select activation key', name: 'Select activation key',
}); });
const registerLaterRadio = screen.getByTestId('registration-radio-later'); user.click(await screen.findByTestId('registration-radio-later'));
await act(async () => { await clickNext();
await user.click(registerLaterRadio); // skip fsc
await clickNext(); await clickNext();
// skip fsc
await clickNext();
});
}; };
test('clicking Next loads Image name', async () => { test('clicking Next loads Image name', async () => {
await setUp(); await setUp();
await act(async () => { await clickNext();
await clickNext();
});
screen.getByRole('heading', { await screen.findByRole('heading', {
name: 'Details', name: 'Details',
}); });
}); });
@ -164,9 +157,7 @@ describe('Step Packages', () => {
test('clicking Back loads file system configuration', async () => { test('clicking Back loads file system configuration', async () => {
await setUp(); await setUp();
await act(async () => { await clickBack();
await clickBack();
});
screen.getByRole('heading', { name: /file system configuration/i }); screen.getByRole('heading', { name: /file system configuration/i });
}); });
@ -180,12 +171,12 @@ describe('Step Packages', () => {
test('should display search bar and button', async () => { test('should display search bar and button', async () => {
await setUp(); await setUp();
const sapi = screen.getByTestId('search-available-pkgs-input'); await user.type(
await act(async () => { await screen.findByTestId('search-available-pkgs-input'),
await user.type(sapi, 'test'); 'test'
}); );
screen.getByRole('button', { await screen.findByRole('button', {
name: 'Search button for available packages', name: 'Search button for available packages',
}); });
}); });
@ -203,16 +194,14 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
await act(async () => { await user.click(searchbox);
searchbox.click();
});
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = await within(
'option' availablePackagesList
); ).findAllByRole('option');
expect(availablePackagesItems).toHaveLength(3); expect(availablePackagesItems).toHaveLength(3);
const [firstItem, secondItem, thirdItem] = availablePackagesItems; const [firstItem, secondItem, thirdItem] = availablePackagesItems;
expect(firstItem).toHaveTextContent('testsummary for test package'); expect(firstItem).toHaveTextContent('testsummary for test package');
@ -226,29 +215,15 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
await act(async () => { user.click(searchbox);
searchbox.click();
});
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
const apt = screen.getByTestId('available-pkgs-testPkg'); await user.click(await screen.findByTestId('available-pkgs-testPkg'));
await act(async () => { await user.click(screen.getByRole('button', { name: /Add selected/ }));
apt.click();
});
const bas = screen.getByRole('button', { name: /Add selected/ });
await act(async () => {
bas.click();
});
const spt = screen.getByTestId('selected-pkgs-testPkg'); user.click(screen.getByTestId('selected-pkgs-testPkg'));
await act(async () => { user.click(screen.getByRole('button', { name: /Remove selected/ }));
spt.click();
});
const brs = screen.getByRole('button', { name: /Remove selected/ });
await act(async () => {
brs.click();
});
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = within(availablePackagesList).getAllByRole(
@ -267,20 +242,12 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
await act(async () => { user.click(searchbox);
searchbox.click();
});
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
const baa = screen.getByRole('button', { name: /Add all/ }); user.click(screen.getByRole('button', { name: /Add all/ }));
await act(async () => { await user.click(screen.getByRole('button', { name: /Remove all/ }));
baa.click();
});
const bra = screen.getByRole('button', { name: /Remove all/ });
await act(async () => {
bra.click();
});
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = within(availablePackagesList).getAllByRole(
@ -299,72 +266,39 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
await act(async () => { user.click(searchbox);
searchbox.click();
});
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
const baa = screen.getByRole('button', { name: /Add all/ }); user.click(screen.getByRole('button', { name: /Add all/ }));
await act(async () => {
baa.click();
});
// remove a single package // remove a single package
const splt = screen.getByTestId('selected-pkgs-lib-test'); await user.click(await screen.findByTestId('selected-pkgs-lib-test'));
await act(async () => { user.click(screen.getByRole('button', { name: /Remove selected/ }));
splt.click();
});
const brs = screen.getByRole('button', { name: /Remove selected/ });
await act(async () => {
brs.click();
});
// skip name page // skip name page
const bn1 = screen.getByRole('button', { name: /Next/ }); clickNext();
await act(async () => {
bn1.click();
});
// review page // review page
const bn2 = screen.getByRole('button', { name: /Next/ }); clickNext();
await act(async () => {
bn2.click();
});
// await screen.findByTestId('chosen-packages-count'); // await screen.findByTestId('chosen-packages-count');
let chosen = await screen.findByTestId('chosen-packages-count'); let chosen = await screen.findByTestId('chosen-packages-count');
expect(chosen).toHaveTextContent('2'); expect(chosen).toHaveTextContent('2');
// remove another package // remove another package
const bb1 = screen.getByRole('button', { name: /Back/ }); clickBack();
await act(async () => { clickBack();
bb1.click();
});
const bb2 = screen.getByRole('button', { name: /Back/ });
await act(async () => {
bb2.click();
});
await screen.findByTestId('search-available-pkgs-input'); await screen.findByTestId('search-available-pkgs-input');
const op = screen.getByRole('option', { user.click(
name: /summary for test package/, screen.getByRole('option', {
}); name: /summary for test package/,
await act(async () => { })
op.click(); );
}); user.click(screen.getByRole('button', { name: /Remove selected/ }));
const brs2 = screen.getByRole('button', { name: /Remove selected/ });
await act(async () => {
brs2.click();
});
// review page // review page
const n1 = screen.getByRole('button', { name: /Next/ }); clickNext();
await act(async () => { clickNext();
n1.click();
});
const n2 = screen.getByRole('button', { name: /Next/ });
await act(async () => {
n2.click();
});
// await screen.findByTestId('chosen-packages-count'); // await screen.findByTestId('chosen-packages-count');
chosen = await screen.findByTestId('chosen-packages-count'); chosen = await screen.findByTestId('chosen-packages-count');
@ -377,12 +311,10 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
await act(async () => { user.click(searchbox);
searchbox.click();
});
await searchForAvailablePackages(searchbox, 'asdf'); await searchForAvailablePackages(searchbox, 'asdf');
screen.getByText('No results found'); await screen.findByText('No results found');
}); });
test('should display empty available state on failed search after a successful search', async () => { test('should display empty available state on failed search after a successful search', async () => {
@ -391,19 +323,19 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
await act(async () => { user.click(searchbox);
searchbox.click();
});
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
screen user.click(
.getByRole('button', { name: /clear available packages search/i }) await screen.findByRole('button', {
.click(); name: /clear available packages search/i,
})
);
await searchForAvailablePackages(searchbox, 'asdf'); await searchForAvailablePackages(searchbox, 'asdf');
screen.getByText('No results found'); await screen.findByText('No results found');
}); });
test('should display empty chosen state on failed search', async () => { test('should display empty chosen state on failed search', async () => {
@ -413,12 +345,12 @@ describe('Step Packages', () => {
const searchboxChosen = screen.getAllByRole('textbox')[1]; const searchboxChosen = screen.getAllByRole('textbox')[1];
await waitFor(() => expect(searchboxAvailable).toBeEnabled()); await waitFor(() => expect(searchboxAvailable).toBeEnabled());
searchboxAvailable.click(); user.click(searchboxAvailable);
await searchForAvailablePackages(searchboxAvailable, 'test'); await searchForAvailablePackages(searchboxAvailable, 'test');
screen.getByRole('button', { name: /Add all/ }).click(); user.click(await screen.findByRole('button', { name: /Add all/ }));
searchboxChosen.click(); user.click(searchboxChosen);
await user.type(searchboxChosen, 'asdf'); await user.type(searchboxChosen, 'asdf');
expect(screen.getByText('No packages found')).toBeInTheDocument(); expect(screen.getByText('No packages found')).toBeInTheDocument();
@ -432,7 +364,7 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
searchbox.click(); user.click(searchbox);
const getPackages = jest const getPackages = jest
.spyOn(api, 'getPackages') .spyOn(api, 'getPackages')
@ -443,7 +375,7 @@ describe('Step Packages', () => {
}); });
await searchForAvailablePackages(searchbox, 'testPkg'); await searchForAvailablePackages(searchbox, 'testPkg');
expect(getPackages).toHaveBeenCalledTimes(2); await waitFor(() => expect(getPackages).toHaveBeenCalledTimes(2));
screen.getByText('Over 100 results found. Refine your search.'); screen.getByText('Over 100 results found. Refine your search.');
screen.getByText('Too many results to display'); screen.getByText('Too many results to display');
@ -455,7 +387,7 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
searchbox.click(); user.click(searchbox);
const getPackages = jest const getPackages = jest
.spyOn(api, 'getPackages') .spyOn(api, 'getPackages')
@ -466,7 +398,7 @@ describe('Step Packages', () => {
}); });
await searchForAvailablePackages(searchbox, 'testPkg-128'); await searchForAvailablePackages(searchbox, 'testPkg-128');
expect(getPackages).toHaveBeenCalledTimes(2); await waitFor(() => expect(getPackages).toHaveBeenCalledTimes(2));
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getByRole( const availablePackagesItems = within(availablePackagesList).getByRole(
@ -484,14 +416,14 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
searchbox.click(); user.click(searchbox);
const getPackages = jest const getPackages = jest
.spyOn(api, 'getPackages') .spyOn(api, 'getPackages')
.mockImplementation(() => Promise.resolve(mockPkgResultAlpha)); .mockImplementation(() => Promise.resolve(mockPkgResultAlpha));
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
expect(getPackages).toHaveBeenCalledTimes(1); await waitFor(() => expect(getPackages).toHaveBeenCalledTimes(1));
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = within(availablePackagesList).getAllByRole(
@ -511,21 +443,25 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; const searchbox = screen.getAllByRole('textbox')[0];
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
searchbox.click(); user.click(searchbox);
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = await within(
'option' availablePackagesList
); ).findAllByRole('option');
expect(availablePackagesItems).toHaveLength(3); expect(availablePackagesItems).toHaveLength(3);
screen user.click(
.getByRole('button', { name: /clear available packages search/i }) await screen.findByRole('button', {
.click(); name: /clear available packages search/i,
})
);
screen.getByText('Search above to add additionalpackages to your image'); await screen.findByText(
'Search above to add additionalpackages to your image'
);
}); });
test('chosen packages can be reset after filtering', async () => { test('chosen packages can be reset after filtering', async () => {
@ -534,25 +470,26 @@ describe('Step Packages', () => {
const availableSearchbox = screen.getAllByRole('textbox')[0]; const availableSearchbox = screen.getAllByRole('textbox')[0];
await waitFor(() => expect(availableSearchbox).toBeEnabled()); await waitFor(() => expect(availableSearchbox).toBeEnabled());
availableSearchbox.click(); user.click(availableSearchbox);
await searchForAvailablePackages(availableSearchbox, 'test'); await searchForAvailablePackages(availableSearchbox, 'test');
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = await within(
'option' availablePackagesList
); ).findAllByRole('option');
expect(availablePackagesItems).toHaveLength(3); await waitFor(() => expect(availablePackagesItems).toHaveLength(3));
screen.getByRole('button', { name: /Add all/ }).click(); user.click(await screen.findByRole('button', { name: /Add all/ }));
const chosenPackagesList = screen.getByTestId('chosen-pkgs-list'); const chosenPackagesList = screen.getByTestId('chosen-pkgs-list');
let chosenPackagesItems = let chosenPackagesItems = await within(chosenPackagesList).findAllByRole(
within(chosenPackagesList).getAllByRole('option'); 'option'
expect(chosenPackagesItems).toHaveLength(3); );
await waitFor(() => expect(chosenPackagesItems).toHaveLength(3));
const chosenSearchbox = screen.getAllByRole('textbox')[1]; const chosenSearchbox = screen.getAllByRole('textbox')[1];
chosenSearchbox.click(); await user.click(chosenSearchbox);
await searchForChosenPackages(chosenSearchbox, 'lib'); await searchForChosenPackages(chosenSearchbox, 'lib');
chosenPackagesItems = await within(chosenPackagesList).findAllByRole( chosenPackagesItems = await within(chosenPackagesList).findAllByRole(
'option' 'option'
@ -560,11 +497,15 @@ describe('Step Packages', () => {
// eslint-disable-next-line jest-dom/prefer-in-document // eslint-disable-next-line jest-dom/prefer-in-document
expect(chosenPackagesItems).toHaveLength(1); expect(chosenPackagesItems).toHaveLength(1);
screen await user.click(
.getByRole('button', { name: /clear chosen packages search/i }) await screen.findByRole('button', {
.click(); name: /clear chosen packages search/i,
chosenPackagesItems = within(chosenPackagesList).getAllByRole('option'); })
expect(chosenPackagesItems).toHaveLength(3); );
chosenPackagesItems = await within(chosenPackagesList).findAllByRole(
'option'
);
await waitFor(() => expect(chosenPackagesItems).toHaveLength(3));
}); });
}); });
@ -578,20 +519,15 @@ describe('Step Packages', () => {
)); ));
// select aws as upload destination // select aws as upload destination
const awsTile = screen.getByTestId('upload-aws'); user.click(screen.getByTestId('upload-aws'));
await act(async () => { await clickNext();
awsTile.click();
await clickNext();
});
// aws step // aws step
await user.click( await user.click(
screen.getByRole('radio', { name: /manually enter an account id\./i }) screen.getByRole('radio', { name: /manually enter an account id\./i })
); );
await user.type(screen.getByTestId('aws-account-id'), '012345678901'); await user.type(screen.getByTestId('aws-account-id'), '012345678901');
await act(async () => { await clickNext();
await clickNext();
});
// skip registration // skip registration
await screen.findByRole('textbox', { await screen.findByRole('textbox', {
name: 'Select activation key', name: 'Select activation key',
@ -599,12 +535,9 @@ describe('Step Packages', () => {
const registerLaterRadio = screen.getByTestId('registration-radio-later'); const registerLaterRadio = screen.getByTestId('registration-radio-later');
await user.click(registerLaterRadio); await user.click(registerLaterRadio);
await act(async () => { await clickNext();
await clickNext(); // skip fsc
await clickNext();
// skip fsc
await clickNext();
});
}; };
test('search results should be sorted with most relevant results first', async () => { test('search results should be sorted with most relevant results first', async () => {
@ -619,9 +552,7 @@ describe('Step Packages', () => {
//const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref //const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
await act(async () => { user.click(searchbox);
searchbox.click();
});
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
@ -644,17 +575,15 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
await act(async () => { user.click(searchbox);
searchbox.click();
});
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
screen.getByTestId('available-pkgs-testPkg').click(); user.click(await screen.findByTestId('available-pkgs-testPkg'));
screen.getByRole('button', { name: /Add selected/ }).click(); user.click(screen.getByRole('button', { name: /Add selected/ }));
screen.getByTestId('selected-pkgs-testPkg').click(); user.click(await screen.findByTestId('selected-pkgs-testPkg'));
screen.getByRole('button', { name: /Remove selected/ }).click(); user.click(screen.getByRole('button', { name: /Remove selected/ }));
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = within(availablePackagesList).getAllByRole(
@ -673,17 +602,17 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
searchbox.click(); user.click(searchbox);
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
screen.getByRole('button', { name: /Add all/ }).click(); user.click(screen.getByRole('button', { name: /Add all/ }));
screen.getByRole('button', { name: /Remove all/ }).click(); user.click(screen.getByRole('button', { name: /Remove all/ }));
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = await within(
'option' availablePackagesList
); ).findAllByRole('option');
expect(availablePackagesItems).toHaveLength(3); expect(availablePackagesItems).toHaveLength(3);
const [firstItem, secondItem, thirdItem] = availablePackagesItems; const [firstItem, secondItem, thirdItem] = availablePackagesItems;
expect(firstItem).toHaveTextContent('testsummary for test package'); expect(firstItem).toHaveTextContent('testsummary for test package');
@ -697,22 +626,22 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
searchbox.click(); user.click(searchbox);
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
screen.getByRole('button', { name: /Add all/ }).click(); user.click(screen.getByRole('button', { name: /Add all/ }));
// remove a single package // remove a single package
screen.getByTestId('selected-pkgs-lib-test').click(); user.click(await screen.findByTestId('selected-pkgs-lib-test'));
screen.getByRole('button', { name: /Remove selected/ }).click(); user.click(screen.getByRole('button', { name: /Remove selected/ }));
// skip Custom repositories page // skip Custom repositories page
screen.getByRole('button', { name: /Next/ }).click(); clickNext();
// skip name page // skip name page
screen.getByRole('button', { name: /Next/ }).click(); clickNext();
// review page // review page
screen.getByRole('button', { name: /Next/ }).click(); clickNext();
// await screen.findByTestId('chosen-packages-count'); // await screen.findByTestId('chosen-packages-count');
const chosen = await screen.findByTestId('chosen-packages-count'); const chosen = await screen.findByTestId('chosen-packages-count');
@ -725,7 +654,7 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
searchbox.click(); user.click(searchbox);
await searchForAvailablePackages(searchbox, 'asdf'); await searchForAvailablePackages(searchbox, 'asdf');
@ -739,12 +668,12 @@ describe('Step Packages', () => {
const searchboxChosen = screen.getAllByRole('textbox')[1]; const searchboxChosen = screen.getAllByRole('textbox')[1];
await waitFor(() => expect(searchboxAvailable).toBeEnabled()); await waitFor(() => expect(searchboxAvailable).toBeEnabled());
searchboxAvailable.click(); user.click(searchboxAvailable);
await searchForAvailablePackages(searchboxAvailable, 'test'); await searchForAvailablePackages(searchboxAvailable, 'test');
screen.getByRole('button', { name: /Add all/ }).click(); user.click(screen.getByRole('button', { name: /Add all/ }));
searchboxChosen.click(); user.click(searchboxChosen);
await user.type(searchboxChosen, 'asdf'); await user.type(searchboxChosen, 'asdf');
expect(screen.getByText('No packages found')).toBeInTheDocument(); expect(screen.getByText('No packages found')).toBeInTheDocument();
@ -758,7 +687,7 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref const searchbox = screen.getAllByRole('textbox')[0]; // searching by id doesn't update the input ref
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
searchbox.click(); user.click(searchbox);
const getPackages = jest const getPackages = jest
.spyOn(api, 'getPackagesContentSources') .spyOn(api, 'getPackagesContentSources')
@ -767,7 +696,7 @@ describe('Step Packages', () => {
); );
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
expect(getPackages).toHaveBeenCalledTimes(1); await waitFor(() => expect(getPackages).toHaveBeenCalledTimes(1));
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = within(availablePackagesList).getAllByRole(
@ -787,21 +716,23 @@ describe('Step Packages', () => {
const searchbox = screen.getAllByRole('textbox')[0]; const searchbox = screen.getAllByRole('textbox')[0];
await waitFor(() => expect(searchbox).toBeEnabled()); await waitFor(() => expect(searchbox).toBeEnabled());
searchbox.click(); user.click(searchbox);
await searchForAvailablePackages(searchbox, 'test'); await searchForAvailablePackages(searchbox, 'test');
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = await within(
'option' availablePackagesList
); ).findAllByRole('option');
expect(availablePackagesItems).toHaveLength(3); expect(availablePackagesItems).toHaveLength(3);
screen user.click(
.getByRole('button', { name: /clear available packages search/i }) screen.getByRole('button', { name: /clear available packages search/i })
.click(); );
screen.getByText('Search above to add additionalpackages to your image'); await screen.findByText(
'Search above to add additionalpackages to your image'
);
}); });
test('chosen packages can be reset after filtering', async () => { test('chosen packages can be reset after filtering', async () => {
@ -810,35 +741,40 @@ describe('Step Packages', () => {
const availableSearchbox = screen.getAllByRole('textbox')[0]; const availableSearchbox = screen.getAllByRole('textbox')[0];
await waitFor(() => expect(availableSearchbox).toBeEnabled()); await waitFor(() => expect(availableSearchbox).toBeEnabled());
availableSearchbox.click(); user.click(availableSearchbox);
await searchForAvailablePackages(availableSearchbox, 'test'); await searchForAvailablePackages(availableSearchbox, 'test');
const availablePackagesList = screen.getByTestId('available-pkgs-list'); const availablePackagesList = screen.getByTestId('available-pkgs-list');
const availablePackagesItems = within(availablePackagesList).getAllByRole( const availablePackagesItems = await within(
'option' availablePackagesList
); ).findAllByRole('option');
expect(availablePackagesItems).toHaveLength(3); expect(availablePackagesItems).toHaveLength(3);
screen.getByRole('button', { name: /Add all/ }).click(); user.click(screen.getByRole('button', { name: /Add all/ }));
const chosenPackagesList = screen.getByTestId('chosen-pkgs-list'); const chosenPackagesList = screen.getByTestId('chosen-pkgs-list');
let chosenPackagesItems = let chosenPackagesItems = await within(chosenPackagesList).findAllByRole(
within(chosenPackagesList).getAllByRole('option'); 'option'
);
expect(chosenPackagesItems).toHaveLength(3); expect(chosenPackagesItems).toHaveLength(3);
const chosenSearchbox = screen.getAllByRole('textbox')[1]; const chosenSearchbox = screen.getAllByRole('textbox')[1];
chosenSearchbox.click(); user.click(chosenSearchbox);
await searchForChosenPackages(chosenSearchbox, 'lib'); await searchForChosenPackages(chosenSearchbox, 'lib');
chosenPackagesItems = within(chosenPackagesList).getAllByRole('option'); chosenPackagesItems = within(chosenPackagesList).getAllByRole('option');
// eslint-disable-next-line jest-dom/prefer-in-document // eslint-disable-next-line jest-dom/prefer-in-document
expect(chosenPackagesItems).toHaveLength(1); expect(chosenPackagesItems).toHaveLength(1);
screen await user.click(
.getByRole('button', { name: /clear chosen packages search/i }) await screen.findByRole('button', {
.click(); name: /clear chosen packages search/i,
chosenPackagesItems = within(chosenPackagesList).getAllByRole('option'); })
expect(chosenPackagesItems).toHaveLength(3); );
chosenPackagesItems = await within(chosenPackagesList).findAllByRole(
'option'
);
await waitFor(() => expect(chosenPackagesItems).toHaveLength(3));
}); });
}); });
}); });
@ -849,43 +785,34 @@ describe('Step Custom repositories', () => {
({ router } = renderCustomRoutesWithReduxRouter('imagewizard', {}, routes)); ({ router } = renderCustomRoutesWithReduxRouter('imagewizard', {}, routes));
// select aws as upload destination // select aws as upload destination
const awsTile = screen.getByTestId('upload-aws'); user.click(await screen.findByTestId('upload-aws'));
await act(async () => { await clickNext();
awsTile.click();
await clickNext();
});
// aws step // aws step
await user.click( await user.click(
screen.getByRole('radio', { name: /manually enter an account id\./i }) screen.getByRole('radio', { name: /manually enter an account id\./i })
); );
await user.type(screen.getByTestId('aws-account-id'), '012345678901'); await user.type(screen.getByTestId('aws-account-id'), '012345678901');
await act(async () => {
await clickNext(); await clickNext();
});
// skip registration // skip registration
await screen.findByRole('textbox', { await screen.findByRole('textbox', {
name: 'Select activation key', name: 'Select activation key',
}); });
const registerLaterRadio = screen.getByLabelText('Register later'); user.click(screen.getByLabelText('Register later'));
await user.click(registerLaterRadio); await clickNext();
await act(async () => { // skip fsc
await clickNext(); await clickNext();
// skip packages
// skip fsc await clickNext();
await clickNext();
// skip packages
await clickNext();
});
}; };
test('selected repositories stored in and retrieved from form state', async () => { test('selected repositories stored in and retrieved from form state', async () => {
await setUp(); await setUp();
const getFirstRepoCheckbox = () => const getFirstRepoCheckbox = async () =>
screen.findByRole('checkbox', { await screen.findByRole('checkbox', {
name: /select row 0/i, name: /select row 0/i,
}); });
let firstRepoCheckbox = await getFirstRepoCheckbox(); let firstRepoCheckbox = await getFirstRepoCheckbox();
@ -894,10 +821,8 @@ describe('Step Custom repositories', () => {
await user.click(firstRepoCheckbox); await user.click(firstRepoCheckbox);
expect(firstRepoCheckbox.checked).toEqual(true); expect(firstRepoCheckbox.checked).toEqual(true);
await act(async () => { await clickNext();
await clickNext(); clickBack();
clickBack();
});
firstRepoCheckbox = await getFirstRepoCheckbox(); firstRepoCheckbox = await getFirstRepoCheckbox();
expect(firstRepoCheckbox.checked).toEqual(true); expect(firstRepoCheckbox.checked).toEqual(true);
@ -906,10 +831,11 @@ describe('Step Custom repositories', () => {
test('correct number of repositories is fetched', async () => { test('correct number of repositories is fetched', async () => {
await setUp(); await setUp();
const selectButton = await screen.findByRole('button', { await user.click(
name: /select/i, await screen.findByRole('button', {
}); name: /select/i,
await user.click(selectButton); })
);
screen.getByText(/select all \(1015 items\)/i); screen.getByText(/select all \(1015 items\)/i);
}); });
@ -933,12 +859,12 @@ describe('Step Custom repositories', () => {
expect(rows).toHaveLength(1); expect(rows).toHaveLength(1);
// clear filter // clear filter
screen.getByRole('button', { name: /reset/i }).click(); await user.click(await screen.findByRole('button', { name: /reset/i }));
rows = getRows(); rows = getRows();
// remove first row from list since it is just header labels // remove first row from list since it is just header labels
rows.shift(); rows.shift();
expect(rows).toHaveLength(10); await waitFor(() => expect(rows).toHaveLength(10));
}); });
}); });

659
src/test/Components/CreateImageWizard/CreateImageWizard.test.js
View file

File diff suppressed because it is too large Load diff