From 23065c72e804077bc9d0a26bbd20ead38a09c3ce Mon Sep 17 00:00:00 2001 From: Cee Chen Date: Fri, 14 Jul 2023 09:26:47 -0700 Subject: [PATCH] [tests][cleanup] De-dupe EuiTablePagination and PaginationBar tests - PaginationBar should not be testing props that are basic pass-throughs - EuiTablePagination should (the whole point of unit tests) + add test for PaginationBar logic that's actually there (onPageChange) - Move said missing tests to EuiTablePagination and improve tests to use specific assertions instead of noisy snapshots --- .../pagination_bar.test.tsx.snap | 67 -- .../basic_table/pagination_bar.test.tsx | 88 +-- .../table_pagination.test.tsx.snap | 635 ++++++++---------- .../table_pagination.test.tsx | 42 +- 4 files changed, 346 insertions(+), 486 deletions(-) diff --git a/src/components/basic_table/__snapshots__/pagination_bar.test.tsx.snap b/src/components/basic_table/__snapshots__/pagination_bar.test.tsx.snap index 2366e0d0f51a..5afd7642a419 100644 --- a/src/components/basic_table/__snapshots__/pagination_bar.test.tsx.snap +++ b/src/components/basic_table/__snapshots__/pagination_bar.test.tsx.snap @@ -1,72 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`PaginationBar render - custom page size options 1`] = ` -
- - -
-`; - -exports[`PaginationBar render - hiding per page options 1`] = ` -
- - -
-`; - -exports[`PaginationBar render - show all pageSize 1`] = ` -
- - -
-`; - exports[`PaginationBar renders 1`] = `
{ - it('renders', () => { - const props = { - ...requiredProps, - pagination: { - pageIndex: 0, - pageSize: 5, - totalItemCount: 0, - }, - onPageSizeChange: () => {}, - onPageChange: () => {}, - }; + const props = { + ...requiredProps, + pagination: { + pageIndex: 0, + pageSize: 5, + totalItemCount: 0, + }, + onPageSizeChange: () => {}, + onPageChange: () => {}, + }; + it('renders', () => { const { container } = render(); expect(container.firstChild).toMatchSnapshot(); }); - test('render - custom page size options', () => { - const props = { - pagination: { - pageIndex: 0, - pageSize: 5, - totalItemCount: 0, - pageSizeOptions: [1, 2, 3], - }, - onPageSizeChange: () => {}, - onPageChange: () => {}, - }; - - const component = shallow(); - - expect(component).toMatchSnapshot(); - }); - - test('render - hiding per page options', () => { - const props = { - pagination: { - pageIndex: 0, - pageSize: 5, - totalItemCount: 0, - showPerPageOptions: false, - }, - onPageSizeChange: () => {}, - onPageChange: () => {}, - }; - - const component = shallow(); - - expect(component).toMatchSnapshot(); - }); - - test('render - show all pageSize', () => { - const props = { - pagination: { - pageIndex: 0, - pageSize: 0, - pageSizeOptions: [1, 5, 0], - totalItemCount: 5, - }, - onPageSizeChange: () => {}, - onPageChange: () => {}, - }; - - const component = shallow(); - - expect(component).toMatchSnapshot(); + it('calls onPageChange with the correct off-by-one offset', () => { + const onPageChange = jest.fn(); + const { getByLabelText } = render( + + ); + + fireEvent.click(getByLabelText('Page 2 of 2')); + expect(onPageChange).toHaveBeenCalledWith(1); }); }); diff --git a/src/components/table/table_pagination/__snapshots__/table_pagination.test.tsx.snap b/src/components/table/table_pagination/__snapshots__/table_pagination.test.tsx.snap index 5b43a3ccdc7c..0186f4897931 100644 --- a/src/components/table/table_pagination/__snapshots__/table_pagination.test.tsx.snap +++ b/src/components/table/table_pagination/__snapshots__/table_pagination.test.tsx.snap @@ -1,398 +1,329 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`EuiTablePagination hides the per page options 1`] = ` -
-
-
- -
-
-`; - -exports[`EuiTablePagination renders 1`] = ` -
-
-
+ +
+
+
- -
-
-
-
- + +
+
- -`; - -exports[`EuiTablePagination renders a "show all" itemsPerPage option 1`] = ` -
+
+
+
-
-
+ `; diff --git a/src/components/table/table_pagination/table_pagination.test.tsx b/src/components/table/table_pagination/table_pagination.test.tsx index a11a049f00d5..42ad1c6b9df7 100644 --- a/src/components/table/table_pagination/table_pagination.test.tsx +++ b/src/components/table/table_pagination/table_pagination.test.tsx @@ -23,15 +23,43 @@ describe('EuiTablePagination', () => { }; it('renders', () => { - const { container } = render( + const { getByTestSubject, baseElement } = render( ); - expect(container.firstChild).toMatchSnapshot(); + fireEvent.click(getByTestSubject('tablePaginationPopoverButton')); + expect(baseElement).toMatchSnapshot(); + }); + + it('renders custom items per page / page sizes', () => { + const { getByText } = render( + + ); + + expect(getByText('Rows per page: 10')).toBeTruthy(); + }); + + it('renders custom items per page size options', () => { + const { getByTestSubject } = render( + + ); + + fireEvent.click(getByTestSubject('tablePaginationPopoverButton')); + expect(getByTestSubject('tablePagination-1-rows')).toBeTruthy(); + expect(getByTestSubject('tablePagination-2-rows')).toBeTruthy(); + expect(getByTestSubject('tablePagination-3-rows')).toBeTruthy(); }); it('hides the per page options', () => { - const { container } = render( + const { queryByTestSubject } = render( { /> ); - expect(container.firstChild).toMatchSnapshot(); + expect(queryByTestSubject('tablePaginationPopoverButton')).toBe(null); }); it('renders a "show all" itemsPerPage option', () => { - const { container } = render( + const { getByText, getByTestSubject } = render( { /> ); - expect(container.firstChild).toMatchSnapshot(); + expect(getByText('Showing all rows')).toBeTruthy(); + fireEvent.click(getByTestSubject('tablePaginationPopoverButton')); + expect(getByText('Show all rows')).toBeTruthy(); }); describe('configurable defaults', () => {