mirror of
https://github.com/ansible/awx.git
synced 2026-01-16 12:20:45 -03:30
update pagination tests
This commit is contained in:
parent
e48c734925
commit
11583dbff0
@ -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>
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
@ -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
|
||||
onToggle={this.onTogglePageSize}>
|
||||
<DropdownToggle className="togglePageSize" 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">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user