update pagination tests

__tests__/components/Pagination.test.jsx

@@ -72,4 +72,97 @@ describe('<Pagination />', () => {
     expect(onSetPage).toHaveBeenCalledTimes(2);
     expect(onSetPage).toBeCalledWith(1, 5);
   });
+
+  test('previous button does not work on page 1', () => {
+    const previous = 'button[aria-label="First"]';
+    const onSetPage = jest.fn();
+
+    pagination = mount(
+      <I18nProvider>
+        <Pagination
+          count={21}
+          page={1}
+          pageCount={5}
+          page_size={5}
+          pageSizeOptions={[5, 10, 25, 50]}
+          onSetPage={onSetPage}
+        />
+      </I18nProvider>
+    );
+    pagination.find(previous).simulate('click');
+    expect(onSetPage).toHaveBeenCalledTimes(0);
+  });
+
+  test('changing pageSize works', () => {
+    const pageSizeDropdownToggleSelector = 'DropdownToggle DropdownToggle[className="togglePageSize"]';
+    const pageSizeDropdownItemsSelector = 'DropdownItem';
+    const onSetPage = jest.fn();
+
+    pagination = mount(
+      <I18nProvider>
+        <Pagination
+          count={21}
+          page={1}
+          pageCount={5}
+          page_size={5}
+          pageSizeOptions={[5, 10, 25, 50]}
+          onSetPage={onSetPage}
+        />
+      </I18nProvider>
+    );
+    const pageSizeDropdownToggle = pagination.find(pageSizeDropdownToggleSelector);
+    expect(pageSizeDropdownToggle.length).toBe(1);
+    pageSizeDropdownToggle.at(0).simulate('click');
+
+    const pageSizeDropdownItems = pagination.find(pageSizeDropdownItemsSelector);
+    expect(pageSizeDropdownItems.length).toBe(3);
+    pageSizeDropdownItems.at(1).simulate('click');
+  });
+
+  test('submit a new page by typing in input works', () => {
+    const textInputSelector = '.pf-l-split__item.pf-m-main .pf-c-form-control';
+    const submitFormSelector = '.pf-l-split__item.pf-m-main form';
+
+    const onSetPage = jest.fn();
+
+    pagination = mount(
+      <I18nProvider>
+        <Pagination
+          count={21}
+          page={1}
+          pageCount={5}
+          page_size={5}
+          pageSizeOptions={[5, 10, 25, 50]}
+          onSetPage={onSetPage}
+        />
+      </I18nProvider>
+    );
+    const textInput = pagination.find(textInputSelector);
+    expect(textInput.length).toBe(1);
+    textInput.simulate('change');
+    pagination.setProps({ page: 2 });
+
+    const submitForm = pagination.find(submitFormSelector);
+    expect(submitForm.length).toBe(1);
+    submitForm.simulate('submit');
+    pagination.setState({ value: 'invalid' });
+    submitForm.simulate('submit');
+  });
+
+  test('text input page change is disabled when only 1 page', () => {
+    const onSetPage = jest.fn();
+
+    pagination = mount(
+      <I18nProvider>
+        <Pagination
+          count={4}
+          page={1}
+          pageCount={1}
+          page_size={5}
+          pageSizeOptions={[5, 10, 25, 50]}
+          onSetPage={onSetPage}
+        />
+        </I18nProvider>
+    );
+  });
 });

src/components/Pagination/Pagination.jsx

@@ -7,14 +7,9 @@ import {
   DropdownDirection,
   DropdownItem,
   DropdownToggle,
-  Form,
-  FormGroup,
   Level,
   LevelItem,
   TextInput,
-  Toolbar,
-  ToolbarGroup,
-  ToolbarItem,
   Split,
   SplitItem,
 } from '@patternfly/react-core';
@@ -32,7 +27,7 @@ class Pagination extends Component {
     const { page } = this.props;
 
     if (prevProps.page !== page) {
-      this.setState({ value: page });
+      this.onPageChange(page);
     }
   }
 
@@ -51,13 +46,13 @@ class Pagination extends Component {
 
     if (isValid) {
       onSetPage(value, page_size);
-    } else{
+    } else {
       this.setState({ value: page });
     }
   };
 
   onFirst = () => {
-    const { onSetPage, page_size} = this.props;
+    const { onSetPage, page_size } = this.props;
 
     onSetPage(1, page_size);
   };
@@ -67,7 +62,7 @@ class Pagination extends Component {
     const previousPage = page - 1;
 
     if (previousPage >= 1) {
-      onSetPage(previousPage, page_size)
+      onSetPage(previousPage, page_size);
     }
   };
 
@@ -76,7 +71,7 @@ class Pagination extends Component {
     const nextPage = page + 1;
 
     if (nextPage <= pageCount) {
-      onSetPage(nextPage, page_size)
+      onSetPage(nextPage, page_size);
     }
   };
 
@@ -139,18 +134,18 @@ class Pagination extends Component {
                   direction={up}
                   isOpen={isOpen}
                   toggle={(
-                    <DropdownToggle
+                    <DropdownToggle className="togglePageSize" onToggle={this.onTogglePageSize}>
-                      onToggle={this.onTogglePageSize}>
                       { page_size }
                     </DropdownToggle>
-                  )}>
+                  )}
+                >
                   {opts.map(option => (
                     <DropdownItem key={option} component="button">
                       { option }
                     </DropdownItem>
                   ))}
                 </Dropdown>
-                <Trans>Per Page</Trans>
+                <Trans> Per Page</Trans>
               </LevelItem>
               <LevelItem>
                 <Split gutter="md" className="pf-u-display-flex pf-u-align-items-center">