1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-07-26 13:48:33 +02:00

test: manage variant dependency UI (#6756)

This commit is contained in:
Mateusz Kwasniewski 2024-04-02 13:52:47 +02:00 committed by GitHub
parent 317a204070
commit d5b73694fa
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 139 additions and 42 deletions

View File

@ -3,6 +3,9 @@ import userEvent from '@testing-library/user-event';
import { render } from 'utils/testRenderer';
import { AddDependencyDialogue } from './AddDependencyDialogue';
import { testServerRoute, testServerSetup } from 'utils/testServer';
import { http, HttpResponse } from 'msw';
import type { IDependency } from 'interfaces/featureToggle';
import type { IChangeSchema } from 'hooks/api/actions/useChangeRequestApi/useChangeRequestApi';
const server = testServerSetup();
@ -30,11 +33,21 @@ const setupApi = () => {
'post',
);
testServerRoute(
server,
'/api/admin/projects/default/features/parentA/parent-variants',
['variantA', 'variantB'],
);
testServerRoute(
server,
'/api/admin/projects/default/features/child/parents',
['parentA', 'parentB'],
);
testServerRoute(server, '/api/admin/projects/default/features/child', {
dependencies: [{ feature: 'parentB', enabled: true, variants: [] }],
});
};
const setupChangeRequestApi = () => {
@ -86,7 +99,18 @@ test('Delete dependency', async () => {
test('Edit dependency', async () => {
let closed = false;
let dependency: IDependency;
setupApi();
server.use(
http.post(
'/api/admin/projects/default/features/child/dependencies',
async ({ request }) => {
dependency = (await request.json()) as IDependency;
return new HttpResponse(null, { status: 200 });
},
),
);
render(
<AddDependencyDialogue
project='default'
@ -99,10 +123,10 @@ test('Edit dependency', async () => {
/>,
);
const removeDependency = await screen.findByText('Add');
const addDependency = await screen.findByText('Add');
await waitFor(() => {
expect(removeDependency).not.toBeDisabled();
expect(addDependency).not.toBeDisabled();
});
// Open the dropdown by selecting the role.
@ -111,12 +135,27 @@ test('Edit dependency', async () => {
expect(featureDropdown.innerHTML).toBe('parentB');
userEvent.click(featureDropdown);
// select parent
const parentAOption = await screen.findByText('parentA');
userEvent.click(parentAOption);
// select parent status
await screen.findByText('feature status');
expect(featureStatusDropdown.innerHTML).toBe('enabled');
userEvent.click(featureStatusDropdown);
const enabledWithVariants = await screen.findByText(
'enabled with variants',
);
userEvent.click(enabledWithVariants);
// select variant
await screen.findByText('variant');
const variantDropdown = await screen.findByPlaceholderText('Select values');
userEvent.click(variantDropdown);
const variantA = await screen.findByText('variantA');
userEvent.click(variantA);
// add dependency
const addButton = await screen.findByText('Add');
userEvent.click(addButton);
@ -124,17 +163,33 @@ test('Edit dependency', async () => {
await waitFor(() => {
expect(closed).toBe(true);
expect(dependency).toEqual({
feature: 'parentA',
enabled: true,
variants: ['variantA'],
});
});
});
test('Add change to draft', async () => {
let closed = false;
let change: IChangeSchema[];
setupApi();
setupChangeRequestApi();
server.use(
http.post(
'/api/admin/projects/default/environments/development/change-requests',
async ({ request }) => {
change = (await request.json()) as IChangeSchema[];
return new HttpResponse(null, { status: 201 });
},
),
);
render(
<AddDependencyDialogue
project='default'
featureId='child'
parentDependency={{ feature: 'parentB' }}
showDependencyDialogue={true}
onClose={() => {
closed = true;
@ -148,5 +203,12 @@ test('Add change to draft', async () => {
await waitFor(() => {
expect(closed).toBe(true);
expect(change).toEqual([
{
action: 'addDependency',
feature: 'child',
payload: { feature: 'parentB', enabled: true, variants: [] },
},
]);
});
});

View File

@ -2,7 +2,7 @@ import { screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { render } from 'utils/testRenderer';
import { FeatureOverviewSidePanelDetails } from './FeatureOverviewSidePanelDetails';
import type { IFeatureToggle } from 'interfaces/featureToggle';
import type { IDependency, IFeatureToggle } from 'interfaces/featureToggle';
import { testServerRoute, testServerSetup } from 'utils/testServer';
import ToastRenderer from 'component/common/ToastRenderer/ToastRenderer';
@ -170,19 +170,22 @@ test('show children', async () => {
await screen.findByText('2 features');
});
const feature = {
name: 'feature',
project: 'default',
dependencies: [] as IDependency[],
children: [] as string[],
} as IFeatureToggle;
test('delete dependency', async () => {
render(
<>
<ToastRenderer />
<FeatureOverviewSidePanelDetails
feature={
{
name: 'feature',
project: 'default',
dependencies: [{ feature: 'some_parent' }],
children: [] as string[],
} as IFeatureToggle
}
feature={{
...feature,
dependencies: [{ feature: 'some_parent' }],
}}
header={''}
/>
</>,
@ -213,14 +216,10 @@ test('delete dependency with change request', async () => {
<>
<ToastRenderer />
<FeatureOverviewSidePanelDetails
feature={
{
name: 'feature',
project: 'default',
dependencies: [{ feature: 'some_parent' }],
children: [] as string[],
} as IFeatureToggle
}
feature={{
...feature,
dependencies: [{ feature: 'some_parent' }],
}}
header={''}
/>
</>,
@ -248,14 +247,10 @@ test('delete dependency with change request', async () => {
test('edit dependency', async () => {
render(
<FeatureOverviewSidePanelDetails
feature={
{
name: 'feature',
project: 'default',
dependencies: [{ feature: 'some_parent', enabled: false }],
children: [] as string[],
} as IFeatureToggle
}
feature={{
...feature,
dependencies: [{ feature: 'some_parent', enabled: false }],
}}
header={''}
/>,
{
@ -284,23 +279,63 @@ test('edit dependency', async () => {
test('show variant dependencies', async () => {
render(
<FeatureOverviewSidePanelDetails
feature={
{
name: 'feature',
project: 'default',
dependencies: [
{
feature: 'some_parent',
enabled: true,
variants: ['a', 'b'],
},
],
children: [] as string[],
} as IFeatureToggle
}
feature={{
...feature,
dependencies: [
{
feature: 'some_parent',
enabled: true,
variants: ['variantA', 'variantB'],
},
],
}}
header={''}
/>,
);
await screen.findByText('2 variants');
const variants = await screen.findByText('2 variants');
userEvent.hover(variants);
await screen.findByText('variantA');
await screen.findByText('variantB');
});
test('show variant dependency', async () => {
render(
<FeatureOverviewSidePanelDetails
feature={{
...feature,
dependencies: [
{
feature: 'some_parent',
enabled: true,
variants: ['variantA'],
},
],
}}
header={''}
/>,
);
await screen.findByText('variantA');
});
test('show disabled dependency', async () => {
render(
<FeatureOverviewSidePanelDetails
feature={{
...feature,
dependencies: [
{
feature: 'some_parent',
enabled: false,
},
],
}}
header={''}
/>,
);
await screen.findByText('disabled');
});