adds test to ensure page size option dropdown is removed is no page size option is passed in.

This commit is contained in:
Alex Corey
2019-03-13 11:30:35 -04:00
parent bbb31eb478
commit 91e4679311
3 changed files with 25 additions and 15 deletions

View File

@@ -137,20 +137,6 @@ describe('<Pagination />', () => {
); );
let itemCount = pagination.find('.awx-pagination__item-count'); let itemCount = pagination.find('.awx-pagination__item-count');
expect(itemCount.text()).toEqual('Items 1 5 of 7'); expect(itemCount.text()).toEqual('Items 1 5 of 7');
pagination = mount(
<I18nProvider>
<Pagination
count={7}
page={1}
pageCount={1}
page_size={10}
pageSizeOptions={[5, 10, 25, 50]}
onSetPage={onSetPage}
/>
</I18nProvider>
);
itemCount = pagination.find('.awx-pagination__item-count');
expect(itemCount.text()).toEqual('Items 1 7 of 7');
pagination = mount( pagination = mount(
<I18nProvider> <I18nProvider>
@@ -340,4 +326,24 @@ describe('<Pagination />', () => {
paginationElem.update(); paginationElem.update();
expect(paginationElem.state().value).toBe(2); expect(paginationElem.state().value).toBe(2);
}); });
test('when showPageSizeOptions is passed as false there should not be a dropdown in the DOM', () => {
const pageSizeDropdownSelector = '.awx-pagination__page-size-selection';
const onSetPage = jest.fn();
pagination = mount(
<I18nProvider>
<Pagination
count={21}
page={1}
pageCount={5}
page_size={5}
showPageSizeOptions={false}
onSetPage={onSetPage}
/>
</I18nProvider>
);
const pageSizeDropdown = pagination.find(pageSizeDropdownSelector);
expect(pageSizeDropdown.length).toBe(0);
});
}); });

View File

@@ -225,6 +225,7 @@ class Lookup extends React.Component {
page_size={page_size} page_size={page_size}
onSetPage={this.onSetPage} onSetPage={this.onSetPage}
pageSizeOptions={null} pageSizeOptions={null}
showPageSizeOptions={false}
style={paginationStyling} style={paginationStyling}
/> />
</Fragment> </Fragment>

View File

@@ -105,6 +105,7 @@ class Pagination extends Component {
pageCount, pageCount,
page_size, page_size,
pageSizeOptions, pageSizeOptions,
showPageSizeOptions,
style style
} = this.props; } = this.props;
const { value, isOpen } = this.state; const { value, isOpen } = this.state;
@@ -128,7 +129,7 @@ class Pagination extends Component {
<I18n> <I18n>
{({ i18n }) => ( {({ i18n }) => (
<div className="awx-pagination" style={style}> <div className="awx-pagination" style={style}>
{opts && ( {showPageSizeOptions && (
<div className="awx-pagination__page-size-selection"> <div className="awx-pagination__page-size-selection">
<Trans>Items Per Page</Trans> <Trans>Items Per Page</Trans>
<Dropdown <Dropdown
@@ -236,12 +237,14 @@ Pagination.propTypes = {
pageCount: PropTypes.number, pageCount: PropTypes.number,
pageSizeOptions: PropTypes.arrayOf(PropTypes.number), pageSizeOptions: PropTypes.arrayOf(PropTypes.number),
page_size: PropTypes.number.isRequired, page_size: PropTypes.number.isRequired,
showPageSizeOptions: PropTypes.bool
}; };
Pagination.defaultProps = { Pagination.defaultProps = {
count: null, count: null,
pageCount: null, pageCount: null,
pageSizeOptions: [5, 10, 25, 50], pageSizeOptions: [5, 10, 25, 50],
showPageSizeOptions: true
}; };
export default Pagination; export default Pagination;