mirror of
https://github.com/ansible/awx.git
synced 2024-11-01 08:21:15 +03:00
update datelisttoolbar test
This commit is contained in:
parent
e25dcb2448
commit
e48c734925
@ -58,6 +58,11 @@ describe('<DataListToolbar />', () => {
|
||||
});
|
||||
|
||||
test('dropdown items sortable columns work', () => {
|
||||
const sortDropdownToggleSelector = '.pf-l-toolbar__group.sortDropdownGroup .pf-l-toolbar__item button';
|
||||
const sortDropdownItemsSelector = '.pf-l-toolbar__group.sortDropdownGroup button.pf-c-dropdown__menu-item';
|
||||
const searchDropdownToggleSelector = '.pf-c-dropdown.searchKeyDropdown .pf-c-dropdown__toggle';
|
||||
const searchDropdownItemsSelector = '.pf-c-dropdown.searchKeyDropdown button.pf-c-dropdown__menu-item';
|
||||
|
||||
const multipleColumns = [
|
||||
{ name: 'Foo', key: 'foo', isSortable: true },
|
||||
{ name: 'Bar', key: 'bar', isSortable: true },
|
||||
@ -68,7 +73,9 @@ describe('<DataListToolbar />', () => {
|
||||
const onSearch = jest.fn();
|
||||
const onSort = jest.fn();
|
||||
const onSelectAll = jest.fn();
|
||||
|
||||
toolbar = mount(
|
||||
<I18nProvider>
|
||||
<DataListToolbar
|
||||
isAllSelected={false}
|
||||
sortedColumnKey="foo"
|
||||
@ -78,17 +85,21 @@ describe('<DataListToolbar />', () => {
|
||||
onSort={onSort}
|
||||
onSelectAll={onSelectAll}
|
||||
/>
|
||||
</I18nProvider>
|
||||
);
|
||||
const sortdropdownToggle = toolbar.find('.pf-l-toolbar__group.sortDropdownGroup .pf-l-toolbar__item button');
|
||||
expect(sortdropdownToggle.length).toBe(2);
|
||||
sortdropdownToggle.at(1).simulate('click');
|
||||
sortdropdownToggle.at(0).simulate('click');
|
||||
const sortDropdownToggle = toolbar.find(sortDropdownToggleSelector);
|
||||
expect(sortDropdownToggle.length).toBe(2);
|
||||
sortDropdownToggle.at(1).simulate('click');
|
||||
sortDropdownToggle.at(0).simulate('click');
|
||||
toolbar.update();
|
||||
const sortDropdownItems = toolbar.find('.pf-l-toolbar__group.sortDropdownGroup button.pf-c-dropdown__menu-item');
|
||||
|
||||
const sortDropdownItems = toolbar.find(sortDropdownItemsSelector);
|
||||
expect(sortDropdownItems.length).toBe(2);
|
||||
|
||||
const mockedSortEvent = { target: { innerText: 'Bar' } };
|
||||
sortDropdownItems.at(0).simulate('click', mockedSortEvent);
|
||||
toolbar = mount(
|
||||
<I18nProvider>
|
||||
<DataListToolbar
|
||||
isAllSelected={false}
|
||||
sortedColumnKey="foo"
|
||||
@ -98,35 +109,49 @@ describe('<DataListToolbar />', () => {
|
||||
onSort={onSort}
|
||||
onSelectAll={onSelectAll}
|
||||
/>
|
||||
</I18nProvider>
|
||||
);
|
||||
toolbar.update();
|
||||
const sortdropdownToggleDescending = toolbar.find('.pf-l-toolbar__group.sortDropdownGroup .pf-l-toolbar__item button');
|
||||
expect(sortdropdownToggleDescending.length).toBe(2);
|
||||
sortdropdownToggleDescending.at(1).simulate('click');
|
||||
sortdropdownToggleDescending.at(0).simulate('click');
|
||||
|
||||
const sortDropdownToggleDescending = toolbar.find(sortDropdownToggleSelector);
|
||||
expect(sortDropdownToggleDescending.length).toBe(2);
|
||||
sortDropdownToggleDescending.at(1).simulate('click');
|
||||
sortDropdownToggleDescending.at(0).simulate('click');
|
||||
toolbar.update();
|
||||
const sortDropdownItemsDescending = toolbar.find('.pf-l-toolbar__group.sortDropdownGroup button.pf-c-dropdown__menu-item');
|
||||
|
||||
const sortDropdownItemsDescending = toolbar.find(sortDropdownItemsSelector);
|
||||
expect(sortDropdownItemsDescending.length).toBe(2);
|
||||
|
||||
const mockedSortEventDescending = { target: { innerText: 'Bar' } };
|
||||
sortDropdownItems.at(0).simulate('click', mockedSortEventDescending);
|
||||
toolbar.update();
|
||||
const searchDropdownToggle = toolbar.find('.pf-c-dropdown.searchKeyDropdown button.pf-c-dropdown__toggle');
|
||||
|
||||
const searchDropdownToggle = toolbar.find(searchDropdownToggleSelector);
|
||||
expect(searchDropdownToggle.length).toBe(1);
|
||||
searchDropdownToggle.at(0).simulate('click');
|
||||
toolbar.update();
|
||||
const searchDropdownItems = toolbar.find('.pf-c-dropdown.searchKeyDropdown button.pf-c-dropdown__menu-item');
|
||||
|
||||
const searchDropdownItems = toolbar.find(searchDropdownItemsSelector);
|
||||
expect(searchDropdownItems.length).toBe(3);
|
||||
|
||||
const mockedSearchEvent = { target: { innerText: 'Bar' } };
|
||||
searchDropdownItems.at(0).simulate('click', mockedSearchEvent);
|
||||
});
|
||||
|
||||
test('it displays correct sort icon', () => {
|
||||
const downNumericIconSelector = 'SortNumericDownIcon';
|
||||
const upNumericIconSelector = 'SortNumericUpIcon';
|
||||
const downAlphaIconSelector = 'SortAlphaDownIcon';
|
||||
const upAlphaIconSelector = 'SortAlphaUpIcon';
|
||||
|
||||
const numericColumns = [{ name: 'ID', key: 'id', isSortable: true, isNumeric: true }];
|
||||
const alphaColumns = [{ name: 'Name', key: 'name', isSortable: true, isNumeric: false }];
|
||||
const onSearch = jest.fn();
|
||||
const onSort = jest.fn();
|
||||
const onSelectAll = jest.fn();
|
||||
|
||||
toolbar = mount(
|
||||
<I18nProvider>
|
||||
<DataListToolbar
|
||||
isAllSelected={false}
|
||||
sortedColumnKey="id"
|
||||
@ -136,10 +161,14 @@ describe('<DataListToolbar />', () => {
|
||||
onSort={onSort}
|
||||
onSelectAll={onSelectAll}
|
||||
/>
|
||||
</I18nProvider>
|
||||
);
|
||||
const downNumericIcon = toolbar.find('SortNumericDownIcon');
|
||||
|
||||
const downNumericIcon = toolbar.find(downNumericIconSelector);
|
||||
expect(downNumericIcon.length).toBe(1);
|
||||
|
||||
toolbar = mount(
|
||||
<I18nProvider>
|
||||
<DataListToolbar
|
||||
isAllSelected={false}
|
||||
sortedColumnKey="id"
|
||||
@ -149,10 +178,14 @@ describe('<DataListToolbar />', () => {
|
||||
onSort={onSort}
|
||||
onSelectAll={onSelectAll}
|
||||
/>
|
||||
</I18nProvider>
|
||||
);
|
||||
const upNumericIcon = toolbar.find('SortNumericUpIcon');
|
||||
|
||||
const upNumericIcon = toolbar.find(upNumericIconSelector);
|
||||
expect(upNumericIcon.length).toBe(1);
|
||||
|
||||
toolbar = mount(
|
||||
<I18nProvider>
|
||||
<DataListToolbar
|
||||
isAllSelected={false}
|
||||
sortedColumnKey="name"
|
||||
@ -162,10 +195,14 @@ describe('<DataListToolbar />', () => {
|
||||
onSort={onSort}
|
||||
onSelectAll={onSelectAll}
|
||||
/>
|
||||
</I18nProvider>
|
||||
);
|
||||
const downAlphaIcon = toolbar.find('SortAlphaDownIcon');
|
||||
|
||||
const downAlphaIcon = toolbar.find(downAlphaIconSelector);
|
||||
expect(downAlphaIcon.length).toBe(1);
|
||||
|
||||
toolbar = mount(
|
||||
<I18nProvider>
|
||||
<DataListToolbar
|
||||
isAllSelected={false}
|
||||
sortedColumnKey="name"
|
||||
@ -175,8 +212,10 @@ describe('<DataListToolbar />', () => {
|
||||
onSort={onSort}
|
||||
onSelectAll={onSelectAll}
|
||||
/>
|
||||
</I18nProvider>
|
||||
);
|
||||
const upAlphaIcon = toolbar.find('SortAlphaUpIcon');
|
||||
|
||||
const upAlphaIcon = toolbar.find(upAlphaIconSelector);
|
||||
expect(upAlphaIcon.length).toBe(1);
|
||||
});
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user