update HostList tests for hooks

This commit is contained in:
Keith Grant
2020-02-20 11:49:12 -08:00
parent 9aef57003a
commit 03aaf93cef
3 changed files with 108 additions and 107 deletions

View File

@@ -17,7 +17,7 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
} }
username="jane" username="jane"
> >
<_default <AlertModal
actions={ actions={
Array [ Array [
<Unknown <Unknown
@@ -648,6 +648,6 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
</ModalContent> </ModalContent>
</Portal> </Portal>
</Modal> </Modal>
</_default> </AlertModal>
</DeleteRoleConfirmationModal> </DeleteRoleConfirmationModal>
`; `;

View File

@@ -177,5 +177,4 @@ function HostList({ i18n }) {
); );
} }
export { HostList as _HostList };
export default withI18n()(HostList); export default withI18n()(HostList);

View File

@@ -2,9 +2,8 @@ import React from 'react';
import { act } from 'react-dom/test-utils'; import { act } from 'react-dom/test-utils';
import { HostsAPI } from '@api'; import { HostsAPI } from '@api';
import { mountWithContexts, waitForElement } from '@testUtils/enzymeHelpers'; import { mountWithContexts, waitForElement } from '@testUtils/enzymeHelpers';
import { sleep } from '@testUtils/testUtils';
import HostList, { _HostList } from './HostList'; import HostList from './HostList';
jest.mock('@api'); jest.mock('@api');
@@ -111,91 +110,99 @@ describe('<HostList />', () => {
}); });
}); });
test.only('Hosts are retrieved from the api and the components finishes loading', async () => { test('Hosts are retrieved from the api and the components finishes loading', async () => {
let wrapper; let wrapper;
await act(async () => { await act(async () => {
wrapper = mountWithContexts(<HostList />); wrapper = mountWithContexts(<HostList />);
}); });
await waitForLoaded(wrapper); await waitForLoaded(wrapper);
expect(HostsAPI.read).toHaveBeenCalled(); expect(HostsAPI.read).toHaveBeenCalled();
expect(wrapper.find('HostListItem')).toHaveLength(3); expect(wrapper.find('HostListItem')).toHaveLength(3);
}); });
test('handleSelect is called when a host list item is selected', async () => { test('should select single item', async () => {
const handleSelect = jest.spyOn(_HostList.prototype, 'handleSelect'); let wrapper;
const wrapper = mountWithContexts(<HostList />); await act(async () => {
await waitForElement( wrapper = mountWithContexts(<HostList />);
wrapper, });
'HostList', await waitForLoaded(wrapper);
el => el.state('hasContentLoading') === false
); act(() => {
await wrapper wrapper
.find('input#select-host-1') .find('input#select-host-1')
.closest('DataListCheck') .closest('DataListCheck')
.props() .invoke('onChange')();
.onChange(); });
expect(handleSelect).toBeCalled(); wrapper.update();
await waitForElement( expect(
wrapper, wrapper
'HostList', .find('HostListItem')
el => el.state('selected').length === 1 .first()
); .prop('isSelected')
).toEqual(true);
}); });
test('handleSelectAll is called when select all checkbox is clicked', async () => { test('should select all items', async () => {
const handleSelectAll = jest.spyOn(_HostList.prototype, 'handleSelectAll'); let wrapper;
const wrapper = mountWithContexts(<HostList />); await act(async () => {
await waitForElement( wrapper = mountWithContexts(<HostList />);
wrapper, });
'HostList', await waitForLoaded(wrapper);
el => el.state('hasContentLoading') === false
); act(() => {
wrapper wrapper.find('DataListToolbar').invoke('onSelectAll')(true);
.find('Checkbox#select-all') });
.props() wrapper.update();
.onChange(true);
expect(handleSelectAll).toBeCalled(); wrapper.find('HostListItem').forEach(item => {
await waitForElement( expect(item.prop('isSelected')).toEqual(true);
wrapper, });
'HostList',
el => el.state('selected').length === 3
);
}); });
test('delete button is disabled if user does not have delete capabilities on a selected host', async () => { test('delete button is disabled if user does not have delete capabilities on a selected host', async () => {
const wrapper = mountWithContexts(<HostList />); let wrapper;
wrapper.find('HostList').setState({ await act(async () => {
hosts: mockHosts, wrapper = mountWithContexts(<HostList />);
itemCount: 3,
isInitialized: true,
selected: mockHosts.slice(0, 1),
}); });
await waitForElement( await waitForLoaded(wrapper);
wrapper,
'ToolbarDeleteButton * button', act(() => {
el => el.getDOMNode().disabled === false wrapper
); .find('HostListItem')
wrapper.find('HostList').setState({ .at(2)
selected: mockHosts, .invoke('onSelect')();
}); });
await waitForElement( expect(wrapper.find('ToolbarDeleteButton button').prop('disabled')).toEqual(
wrapper, true
'ToolbarDeleteButton * button',
el => el.getDOMNode().disabled === true
); );
}); });
test('api is called to delete hosts for each selected host.', () => { test('api is called to delete hosts for each selected host.', async () => {
HostsAPI.destroy = jest.fn(); HostsAPI.destroy = jest.fn();
const wrapper = mountWithContexts(<HostList />); let wrapper;
wrapper.find('HostList').setState({ await act(async () => {
hosts: mockHosts, wrapper = mountWithContexts(<HostList />);
itemCount: 2, });
isInitialized: true, await waitForLoaded(wrapper);
isModalOpen: true,
selected: mockHosts.slice(0, 2), await act(async () => {
wrapper
.find('HostListItem')
.at(0)
.invoke('onSelect')();
});
wrapper.update();
await act(async () => {
wrapper
.find('HostListItem')
.at(1)
.invoke('onSelect')();
});
wrapper.update();
await act(async () => {
wrapper.find('ToolbarDeleteButton').invoke('onDelete')();
}); });
wrapper.find('ToolbarDeleteButton').prop('onDelete')();
expect(HostsAPI.destroy).toHaveBeenCalledTimes(2); expect(HostsAPI.destroy).toHaveBeenCalledTimes(2);
}); });
@@ -211,40 +218,40 @@ describe('<HostList />', () => {
}, },
}) })
); );
const wrapper = mountWithContexts(<HostList />); let wrapper;
wrapper.find('HostList').setState({ await act(async () => {
hosts: mockHosts, wrapper = mountWithContexts(<HostList />);
itemCount: 1, });
isInitialized: true, await waitForLoaded(wrapper);
isModalOpen: true,
selected: mockHosts.slice(0, 1), await act(async () => {
wrapper
.find('HostListItem')
.at(0)
.invoke('onSelect')();
}); });
wrapper.find('ToolbarDeleteButton').prop('onDelete')();
await sleep(0);
wrapper.update(); wrapper.update();
await waitForElement( await act(async () => {
wrapper, wrapper.find('ToolbarDeleteButton').invoke('onDelete')();
'Modal', });
el => el.props().isOpen === true && el.props().title === 'Error!' wrapper.update();
);
const modal = wrapper.find('Modal');
expect(modal).toHaveLength(1);
expect(modal.prop('title')).toEqual('Error!');
}); });
test('Add button shown for users without ability to POST', async () => { test('should show Add button according to permissions', async () => {
const wrapper = mountWithContexts(<HostList />); let wrapper;
await waitForElement( await act(async () => {
wrapper, wrapper = mountWithContexts(<HostList />);
'HostList', });
el => el.state('hasContentLoading') === true await waitForLoaded(wrapper);
);
await waitForElement(
wrapper,
'HostList',
el => el.state('hasContentLoading') === false
);
expect(wrapper.find('ToolbarAddButton').length).toBe(1); expect(wrapper.find('ToolbarAddButton').length).toBe(1);
}); });
test('Add button hidden for users without ability to POST', async () => { test('should hide Add button according to permissions', async () => {
HostsAPI.readOptions.mockResolvedValue({ HostsAPI.readOptions.mockResolvedValue({
data: { data: {
actions: { actions: {
@@ -252,17 +259,12 @@ describe('<HostList />', () => {
}, },
}, },
}); });
const wrapper = mountWithContexts(<HostList />); let wrapper;
await waitForElement( await act(async () => {
wrapper, wrapper = mountWithContexts(<HostList />);
'HostList', });
el => el.state('hasContentLoading') === true await waitForLoaded(wrapper);
);
await waitForElement(
wrapper,
'HostList',
el => el.state('hasContentLoading') === false
);
expect(wrapper.find('ToolbarAddButton').length).toBe(0); expect(wrapper.find('ToolbarAddButton').length).toBe(0);
}); });
}); });