stub api in org add/edit tests

This commit is contained in:
Keith Grant
2019-03-25 11:56:29 -04:00
parent 7bd8234edf
commit f0c94c7e9c
2 changed files with 52 additions and 42 deletions

View File

@@ -7,6 +7,8 @@ import APIClient from '../../../../../src/api';
import OrganizationEdit from '../../../../../src/pages/Organizations/screens/Organization/OrganizationEdit'; import OrganizationEdit from '../../../../../src/pages/Organizations/screens/Organization/OrganizationEdit';
describe('<OrganizationEdit />', () => { describe('<OrganizationEdit />', () => {
let api;
const mockData = { const mockData = {
name: 'Foo', name: 'Foo',
description: 'Bar', description: 'Bar',
@@ -17,12 +19,18 @@ describe('<OrganizationEdit />', () => {
} }
}; };
beforeEach(() => {
api = {
getInstanceGroups: jest.fn(),
};
});
test('should request related instance groups from api', () => { test('should request related instance groups from api', () => {
const mockInstanceGroups = [ const mockInstanceGroups = [
{ name: 'One', id: 1 }, { name: 'One', id: 1 },
{ name: 'Two', id: 2 } { name: 'Two', id: 2 }
]; ];
const getOrganizationInstanceGroups = jest.fn(() => ( api.getOrganizationInstanceGroups = jest.fn(() => (
Promise.resolve({ data: { results: mockInstanceGroups } }) Promise.resolve({ data: { results: mockInstanceGroups } })
)); ));
mount( mount(
@@ -30,16 +38,14 @@ describe('<OrganizationEdit />', () => {
<MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}> <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
<OrganizationEdit <OrganizationEdit
match={{ params: { id: '1' } }} match={{ params: { id: '1' } }}
api={{ api={api}
getOrganizationInstanceGroups
}}
organization={mockData} organization={mockData}
/> />
</MemoryRouter> </MemoryRouter>
</I18nProvider> </I18nProvider>
).find('OrganizationEdit'); ).find('OrganizationEdit');
expect(getOrganizationInstanceGroups).toHaveBeenCalledTimes(1); expect(api.getOrganizationInstanceGroups).toHaveBeenCalledTimes(1);
}); });
test('componentDidMount should set instanceGroups to state', async () => { test('componentDidMount should set instanceGroups to state', async () => {
@@ -47,7 +53,7 @@ describe('<OrganizationEdit />', () => {
{ name: 'One', id: 1 }, { name: 'One', id: 1 },
{ name: 'Two', id: 2 } { name: 'Two', id: 2 }
]; ];
const getOrganizationInstanceGroups = jest.fn(() => ( api.getOrganizationInstanceGroups = jest.fn(() => (
Promise.resolve({ data: { results: mockInstanceGroups } }) Promise.resolve({ data: { results: mockInstanceGroups } })
)); ));
const wrapper = mount( const wrapper = mount(
@@ -60,7 +66,7 @@ describe('<OrganizationEdit />', () => {
params: { id: '1' } params: { id: '1' }
}} }}
organization={mockData} organization={mockData}
api={{ getOrganizationInstanceGroups }} api={api}
/> />
</MemoryRouter> </MemoryRouter>
</I18nProvider> </I18nProvider>
@@ -69,8 +75,8 @@ describe('<OrganizationEdit />', () => {
await wrapper.instance().componentDidMount(); await wrapper.instance().componentDidMount();
expect(wrapper.state().form.instanceGroups.value).toEqual(mockInstanceGroups); expect(wrapper.state().form.instanceGroups.value).toEqual(mockInstanceGroups);
}); });
test('onLookupSave successfully sets instanceGroups state', () => { test('onLookupSave successfully sets instanceGroups state', () => {
const api = jest.fn();
const wrapper = mount( const wrapper = mount(
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
@@ -96,8 +102,9 @@ describe('<OrganizationEdit />', () => {
} }
]); ]);
}); });
test('calls "onFieldChange" when input values change', () => { test('calls "onFieldChange" when input values change', () => {
const api = new APIClient(); // const api = new APIClient();
const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'onFieldChange'); const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'onFieldChange');
const wrapper = mount( const wrapper = mount(
<MemoryRouter> <MemoryRouter>
@@ -116,8 +123,8 @@ describe('<OrganizationEdit />', () => {
wrapper.instance().onFieldChange('bar', { target: { name: 'description' } }); wrapper.instance().onFieldChange('bar', { target: { name: 'description' } });
expect(spy).toHaveBeenCalledTimes(2); expect(spy).toHaveBeenCalledTimes(2);
}); });
test('AnsibleSelect component renders if there are virtual environments', () => { test('AnsibleSelect component renders if there are virtual environments', () => {
const api = jest.fn();
const config = { const config = {
custom_virtualenvs: ['foo', 'bar'], custom_virtualenvs: ['foo', 'bar'],
}; };
@@ -141,8 +148,8 @@ describe('<OrganizationEdit />', () => {
expect(wrapper.find('FormSelect')).toHaveLength(1); expect(wrapper.find('FormSelect')).toHaveLength(1);
expect(wrapper.find('FormSelectOption')).toHaveLength(2); expect(wrapper.find('FormSelectOption')).toHaveLength(2);
}); });
test('calls onSubmit when Save button is clicked', () => { test('calls onSubmit when Save button is clicked', () => {
const api = jest.fn();
const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'onSubmit'); const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'onSubmit');
const wrapper = mount( const wrapper = mount(
<MemoryRouter> <MemoryRouter>
@@ -163,12 +170,13 @@ describe('<OrganizationEdit />', () => {
wrapper.find('button[aria-label="Save"]').prop('onClick')(); wrapper.find('button[aria-label="Save"]').prop('onClick')();
expect(spy).toBeCalled(); expect(spy).toBeCalled();
}); });
test('onSubmit associates and disassociates instance groups', async () => { test('onSubmit associates and disassociates instance groups', async () => {
const mockInstanceGroups = [ const mockInstanceGroups = [
{ name: 'One', id: 1 }, { name: 'One', id: 1 },
{ name: 'Two', id: 2 } { name: 'Two', id: 2 }
]; ];
const getOrganizationInstanceGroupsFn = jest.fn(() => ( api.getOrganizationInstanceGroups = jest.fn(() => (
Promise.resolve({ data: { results: mockInstanceGroups } }) Promise.resolve({ data: { results: mockInstanceGroups } })
)); ));
const mockDataForm = { const mockDataForm = {
@@ -176,15 +184,9 @@ describe('<OrganizationEdit />', () => {
description: 'Bar', description: 'Bar',
custom_virtualenv: 'Fizz', custom_virtualenv: 'Fizz',
}; };
const updateOrganizationDetailsFn = jest.fn().mockResolvedValue(1, mockDataForm); api.updateOrganizationDetails = jest.fn().mockResolvedValue(1, mockDataForm);
const associateInstanceGroupFn = jest.fn().mockResolvedValue('done'); api.associateInstanceGroup = jest.fn().mockResolvedValue('done');
const disassociateInstanceGroupFn = jest.fn().mockResolvedValue('done'); api.disassociate = jest.fn().mockResolvedValue('done');
const api = {
getOrganizationInstanceGroups: getOrganizationInstanceGroupsFn,
updateOrganizationDetails: updateOrganizationDetailsFn,
associateInstanceGroup: associateInstanceGroupFn,
disassociate: disassociateInstanceGroupFn
};
const wrapper = mount( const wrapper = mount(
<I18nProvider> <I18nProvider>
<MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}> <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
@@ -209,18 +211,17 @@ describe('<OrganizationEdit />', () => {
], 'instanceGroups'); ], 'instanceGroups');
await wrapper.instance().onSubmit(); await wrapper.instance().onSubmit();
expect(updateOrganizationDetailsFn).toHaveBeenCalledWith(1, mockDataForm); expect(api.updateOrganizationDetails).toHaveBeenCalledWith(1, mockDataForm);
expect(associateInstanceGroupFn).toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 3); expect(api.associateInstanceGroup).toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 3);
expect(associateInstanceGroupFn).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 1); expect(api.associateInstanceGroup).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 1);
expect(associateInstanceGroupFn).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 2); expect(api.associateInstanceGroup).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 2);
expect(disassociateInstanceGroupFn).toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 2); expect(api.disassociate).toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 2);
expect(disassociateInstanceGroupFn).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 1); expect(api.disassociate).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 1);
expect(disassociateInstanceGroupFn).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 3); expect(api.disassociate).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 3);
}); });
test('calls "onCancel" when Cancel button is clicked', () => { test('calls "onCancel" when Cancel button is clicked', () => {
const api = jest.fn();
const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'onCancel'); const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'onCancel');
const wrapper = mount( const wrapper = mount(
<MemoryRouter> <MemoryRouter>

View File

@@ -6,11 +6,20 @@ import { ConfigContext } from '../../../../src/context';
import OrganizationAdd from '../../../../src/pages/Organizations/screens/OrganizationAdd'; import OrganizationAdd from '../../../../src/pages/Organizations/screens/OrganizationAdd';
describe('<OrganizationAdd />', () => { describe('<OrganizationAdd />', () => {
let api;
beforeEach(() => {
api = {
getInstanceGroups: jest.fn(),
};
});
test('initially renders succesfully', () => { test('initially renders succesfully', () => {
mount( mount(
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
<OrganizationAdd <OrganizationAdd
api={api}
match={{ path: '/organizations/add', url: '/organizations/add' }} match={{ path: '/organizations/add', url: '/organizations/add' }}
location={{ search: '', pathname: '/organizations/add' }} location={{ search: '', pathname: '/organizations/add' }}
/> />
@@ -25,6 +34,7 @@ describe('<OrganizationAdd />', () => {
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
<OrganizationAdd <OrganizationAdd
api={api}
match={{ path: '/organizations/add', url: '/organizations/add' }} match={{ path: '/organizations/add', url: '/organizations/add' }}
location={{ search: '', pathname: '/organizations/add' }} location={{ search: '', pathname: '/organizations/add' }}
/> />
@@ -43,6 +53,7 @@ describe('<OrganizationAdd />', () => {
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
<OrganizationAdd <OrganizationAdd
api={api}
match={{ path: '/organizations/add', url: '/organizations/add' }} match={{ path: '/organizations/add', url: '/organizations/add' }}
location={{ search: '', pathname: '/organizations/add' }} location={{ search: '', pathname: '/organizations/add' }}
/> />
@@ -60,6 +71,7 @@ describe('<OrganizationAdd />', () => {
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
<OrganizationAdd <OrganizationAdd
api={api}
match={{ path: '/organizations/add', url: '/organizations/add' }} match={{ path: '/organizations/add', url: '/organizations/add' }}
location={{ search: '', pathname: '/organizations/add' }} location={{ search: '', pathname: '/organizations/add' }}
/> />
@@ -76,6 +88,7 @@ describe('<OrganizationAdd />', () => {
<MemoryRouter initialEntries={['/organizations/add']} initialIndex={0}> <MemoryRouter initialEntries={['/organizations/add']} initialIndex={0}>
<I18nProvider> <I18nProvider>
<OrganizationAdd <OrganizationAdd
api={api}
match={{ path: '/organizations/add', url: '/organizations/add' }} match={{ path: '/organizations/add', url: '/organizations/add' }}
location={{ search: '', pathname: '/organizations/add' }} location={{ search: '', pathname: '/organizations/add' }}
/> />
@@ -93,7 +106,7 @@ describe('<OrganizationAdd />', () => {
test('Successful form submission triggers redirect', (done) => { test('Successful form submission triggers redirect', (done) => {
const onSuccess = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onSuccess'); const onSuccess = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onSuccess');
const mockedResp = { data: { id: 1, related: { instance_groups: '/bar' } } }; const mockedResp = { data: { id: 1, related: { instance_groups: '/bar' } } };
const api = { createOrganization: jest.fn().mockResolvedValue(mockedResp), associateInstanceGroup: jest.fn().mockResolvedValue('done') }; api.createOrganization = jest.fn().mockResolvedValue(mockedResp); api.associateInstanceGroup = jest.fn().mockResolvedValue('done');
const wrapper = mount( const wrapper = mount(
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
@@ -113,7 +126,7 @@ describe('<OrganizationAdd />', () => {
const wrapper = mount( const wrapper = mount(
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
<OrganizationAdd api={{}} /> <OrganizationAdd api={api} />
</I18nProvider> </I18nProvider>
</MemoryRouter> </MemoryRouter>
).find('OrganizationAdd'); ).find('OrganizationAdd');
@@ -135,7 +148,7 @@ describe('<OrganizationAdd />', () => {
const wrapper = mount( const wrapper = mount(
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
<OrganizationAdd api={{}} /> <OrganizationAdd api={api} />
</I18nProvider> </I18nProvider>
</MemoryRouter> </MemoryRouter>
).find('OrganizationAdd'); ).find('OrganizationAdd');
@@ -144,7 +157,7 @@ describe('<OrganizationAdd />', () => {
}); });
test('onSubmit posts instance groups from selectedInstanceGroups', async () => { test('onSubmit posts instance groups from selectedInstanceGroups', async () => {
const createOrganizationFn = jest.fn().mockResolvedValue({ api.createOrganization = jest.fn().mockResolvedValue({
data: { data: {
id: 1, id: 1,
name: 'mock org', name: 'mock org',
@@ -153,11 +166,7 @@ describe('<OrganizationAdd />', () => {
} }
} }
}); });
const associateInstanceGroupFn = jest.fn().mockResolvedValue('done'); api.associateInstanceGroup = jest.fn().mockResolvedValue('done');
const api = {
createOrganization: createOrganizationFn,
associateInstanceGroup: associateInstanceGroupFn
};
const wrapper = mount( const wrapper = mount(
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
@@ -173,12 +182,12 @@ describe('<OrganizationAdd />', () => {
}] }]
}); });
await wrapper.instance().onSubmit(); await wrapper.instance().onSubmit();
expect(createOrganizationFn).toHaveBeenCalledWith({ expect(api.createOrganization).toHaveBeenCalledWith({
custom_virtualenv: '', custom_virtualenv: '',
description: '', description: '',
name: 'mock org' name: 'mock org'
}); });
expect(associateInstanceGroupFn).toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 1); expect(api.associateInstanceGroup).toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 1);
}); });
test('AnsibleSelect component renders if there are virtual environments', () => { test('AnsibleSelect component renders if there are virtual environments', () => {
@@ -189,7 +198,7 @@ describe('<OrganizationAdd />', () => {
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
<ConfigContext.Provider value={config}> <ConfigContext.Provider value={config}>
<OrganizationAdd api={{}} /> <OrganizationAdd api={api} />
</ConfigContext.Provider> </ConfigContext.Provider>
</I18nProvider> </I18nProvider>
</MemoryRouter> </MemoryRouter>
@@ -206,7 +215,7 @@ describe('<OrganizationAdd />', () => {
<MemoryRouter> <MemoryRouter>
<I18nProvider> <I18nProvider>
<ConfigContext.Provider value={config}> <ConfigContext.Provider value={config}>
<OrganizationAdd api={{}} /> <OrganizationAdd api={api} />
</ConfigContext.Provider> </ConfigContext.Provider>
</I18nProvider> </I18nProvider>
</MemoryRouter> </MemoryRouter>