Skip to content

Commit

Permalink
test: manage variant dependency UI (#6756)
Browse files Browse the repository at this point in the history
  • Loading branch information
@kwasniew
kwasniew committed Apr 2, 2024
1 parent 317a204 commit d5b7369
Show file tree
Hide file tree
Showing 2 changed files with 139 additions and 42 deletions.
66 changes: 64 additions & 2 deletions frontend/src/component/feature/Dependencies/AddDependencyDialogue.test.tsx
View file
Expand Up @@ -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();

Expand Down Expand Up @@ -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 = () => {
Expand Down Expand Up @@ -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'
Expand All @@ -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.
Expand All @@ -111,30 +135,61 @@ 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);

await screen.findByText('Client SDK support for feature dependencies');

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;
Expand All @@ -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: [] },
},
]);
});
});
115 changes: 75 additions & 40 deletions ...verviewSidePanel/FeatureOverviewSidePanelDetails/FeatureOverviewSidePanelDetails.test.tsx
View file
Expand Up @@ -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';

Expand Down Expand Up @@ -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={''}
/>
</>,
Expand Down Expand Up @@ -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={''}
/>
</>,
Expand Down Expand Up @@ -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={''}
/>,
{
Expand Down Expand Up @@ -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');
});

0 comments on commit d5b7369

Please sign in to comment.