From fe0ad302455c3bbc14902800fdcc3186d3caf9de Mon Sep 17 00:00:00 2001 From: "Keith J. Grant" Date: Mon, 26 Apr 2021 15:50:58 -0700 Subject: [PATCH] fix inventory access/hosts lists tests --- .../components/PaginatedTable/ActionsTd.jsx | 8 +- .../ResourceAccessList.test.jsx | 6 +- .../ResourceAccessListItem.test.jsx | 12 ++- .../InventoryHosts/InventoryHostItem.jsx | 4 +- .../InventoryHosts/InventoryHostItem.test.jsx | 32 +++++--- .../InventoryHosts/InventoryHostList.test.jsx | 76 +++++++++++++------ 6 files changed, 89 insertions(+), 49 deletions(-) diff --git a/awx/ui_next/src/components/PaginatedTable/ActionsTd.jsx b/awx/ui_next/src/components/PaginatedTable/ActionsTd.jsx index 617f7cd51a..b620ca2fda 100644 --- a/awx/ui_next/src/components/PaginatedTable/ActionsTd.jsx +++ b/awx/ui_next/src/components/PaginatedTable/ActionsTd.jsx @@ -30,9 +30,11 @@ export default function ActionsTd({ children, gridColumns, ...props }) { > {React.Children.map(children, (child, i) => - React.cloneElement(child, { - column: i + 1, - }) + child + ? React.cloneElement(child, { + column: i + 1, + }) + : null )} diff --git a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.test.jsx b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.test.jsx index 4a2b92d124..6bcbc2b391 100644 --- a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.test.jsx +++ b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.test.jsx @@ -137,10 +137,6 @@ describe('', () => { jest.clearAllMocks(); }); - test('initially renders successfully', () => { - expect(wrapper.find('PaginatedDataList')).toHaveLength(1); - }); - test('should fetch and display access records on mount', async () => { await waitForElement(wrapper, 'ContentLoading', el => el.length === 0); expect(OrganizationsAPI.readAccessList).toHaveBeenCalled(); @@ -203,7 +199,7 @@ describe('', () => { await waitForElement(wrapper, 'ContentLoading', el => el.length === 0); expect( - wrapper.find('PaginatedDataList').prop('toolbarSearchColumns') + wrapper.find('PaginatedTable').prop('toolbarSearchColumns') ).toStrictEqual([ { isDefault: true, key: 'username__icontains', name: 'Username' }, { key: 'first_name__icontains', name: 'First Name' }, diff --git a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.test.jsx b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.test.jsx index d6eaee2c73..43673ac576 100644 --- a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.test.jsx +++ b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessListItem.test.jsx @@ -38,10 +38,14 @@ describe('', () => { await act(async () => { wrapper = mountWithContexts( - {}} - /> + + + {}} + /> + +
); }); diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx index 5b821f80f6..50795f7955 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx @@ -37,7 +37,7 @@ function InventoryHostItem({ - {host.summary_fields.user_capabilities?.edit && ( + {host.summary_fields.user_capabilities?.edit ? ( - )} + ) : null} ); diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.test.jsx index a135aae9e6..ce047cdaea 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.test.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.test.jsx @@ -31,12 +31,16 @@ describe('', () => { beforeEach(() => { wrapper = mountWithContexts( - {}} - host={mockHost} - /> + + + {}} + host={mockHost} + /> + +
); }); @@ -52,12 +56,16 @@ describe('', () => { const copyMockHost = Object.assign({}, mockHost); copyMockHost.summary_fields.user_capabilities.edit = false; wrapper = mountWithContexts( - {}} - host={copyMockHost} - /> + + + {}} + host={copyMockHost} + /> + +
); expect(wrapper.find('PencilAltIcon').exists()).toBeFalsy(); }); diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx index 71f1b2eee3..3dc9292200 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx @@ -103,10 +103,6 @@ describe('', () => { jest.resetAllMocks(); }); - test('initially renders successfully', () => { - expect(wrapper.find('InventoryHostList').length).toBe(1); - }); - test('should fetch hosts from api and render them in the list', async () => { expect(InventoriesAPI.readHosts).toHaveBeenCalled(); expect(wrapper.find('InventoryHostItem').length).toBe(3); @@ -114,49 +110,66 @@ describe('', () => { test('should check and uncheck the row item', async () => { expect( - wrapper.find('DataListCheck[id="select-host-1"]').props().checked + wrapper + .find('.pf-c-table__check') + .first() + .find('input') + .props().checked ).toBe(false); await act(async () => { - wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')( - true - ); + wrapper + .find('.pf-c-table__check') + .first() + .find('input') + .invoke('onChange')(true); }); wrapper.update(); expect( - wrapper.find('DataListCheck[id="select-host-1"]').props().checked + wrapper + .find('.pf-c-table__check') + .first() + .find('input') + .props().checked ).toBe(true); await act(async () => { - wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')( - false - ); + wrapper + .find('.pf-c-table__check') + .first() + .find('input') + .invoke('onChange')(false); }); wrapper.update(); expect( - wrapper.find('DataListCheck[id="select-host-1"]').props().checked + wrapper + .find('.pf-c-table__check') + .first() + .find('input') + .props().checked ).toBe(false); }); test('should check all row items when select all is checked', async () => { - wrapper.find('DataListCheck').forEach(el => { - expect(el.props().checked).toBe(false); + expect.assertions(9); + wrapper.find('.pf-c-table__check').forEach(el => { + expect(el.find('input').props().checked).toBe(false); }); await act(async () => { wrapper.find('Checkbox#select-all').invoke('onChange')(true); }); wrapper.update(); - wrapper.find('DataListCheck').forEach(el => { - expect(el.props().checked).toBe(true); + wrapper.find('.pf-c-table__check').forEach(el => { + expect(el.find('input').props().checked).toBe(true); }); await act(async () => { wrapper.find('Checkbox#select-all').invoke('onChange')(false); }); wrapper.update(); - wrapper.find('DataListCheck').forEach(el => { - expect(el.props().checked).toBe(false); + wrapper.find('.pf-c-table__check').forEach(el => { + expect(el.find('input').props().checked).toBe(false); }); }); @@ -196,7 +209,12 @@ describe('', () => { test('delete button is disabled if user does not have delete capabilities on a selected host', async () => { await act(async () => { - wrapper.find('DataListCheck[id="select-host-3"]').invoke('onChange')(); + // wrapper.find('DataListCheck[id="select-host-3"]').invoke('onChange')(); + wrapper + .find('.pf-c-table__check') + .at(2) + .find('input') + .invoke('onChange')(); }); wrapper.update(); expect(wrapper.find('ToolbarDeleteButton button').props().disabled).toBe( @@ -207,7 +225,11 @@ describe('', () => { test('should call api delete hosts for each selected host', async () => { HostsAPI.destroy = jest.fn(); await act(async () => { - wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')(); + wrapper + .find('.pf-c-table__check') + .first() + .find('input') + .invoke('onChange')(); }); wrapper.update(); await act(async () => { @@ -230,7 +252,11 @@ describe('', () => { }) ); await act(async () => { - wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')(); + wrapper + .find('.pf-c-table__check') + .first() + .find('input') + .invoke('onChange')(); }); wrapper.update(); await act(async () => { @@ -252,7 +278,11 @@ describe('', () => { Promise.reject(new Error()) ); await act(async () => { - wrapper.find('DataListCheck[id="select-host-1"]').invoke('onChange')(); + wrapper + .find('.pf-c-table__check') + .first() + .find('input') + .invoke('onChange')(); }); wrapper.update(); await act(async () => {