2022-08-27 11:52:29 +05:30
|
|
|
import { GlKeysetPagination } from '@gitlab/ui';
|
|
|
|
import { shallowMount } from '@vue/test-utils';
|
2021-09-04 01:27:46 +05:30
|
|
|
import RunnerPagination from '~/runner/components/runner_pagination.vue';
|
|
|
|
|
|
|
|
const mockStartCursor = 'START_CURSOR';
|
|
|
|
const mockEndCursor = 'END_CURSOR';
|
|
|
|
|
|
|
|
describe('RunnerPagination', () => {
|
|
|
|
let wrapper;
|
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
const findPagination = () => wrapper.findComponent(GlKeysetPagination);
|
2021-09-04 01:27:46 +05:30
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
const createComponent = (propsData = {}) => {
|
|
|
|
wrapper = shallowMount(RunnerPagination, {
|
|
|
|
propsData,
|
2021-09-04 01:27:46 +05:30
|
|
|
});
|
|
|
|
};
|
|
|
|
|
|
|
|
afterEach(() => {
|
|
|
|
wrapper.destroy();
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('When in between pages', () => {
|
2022-08-27 11:52:29 +05:30
|
|
|
const mockPageInfo = {
|
|
|
|
startCursor: mockStartCursor,
|
|
|
|
endCursor: mockEndCursor,
|
|
|
|
hasPreviousPage: true,
|
|
|
|
hasNextPage: true,
|
|
|
|
};
|
|
|
|
|
2021-09-04 01:27:46 +05:30
|
|
|
beforeEach(() => {
|
|
|
|
createComponent({
|
2022-08-27 11:52:29 +05:30
|
|
|
pageInfo: mockPageInfo,
|
2021-09-04 01:27:46 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
it('Contains the current page information', () => {
|
2022-08-27 11:52:29 +05:30
|
|
|
expect(findPagination().props()).toMatchObject(mockPageInfo);
|
2021-09-04 01:27:46 +05:30
|
|
|
});
|
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
it('Goes to the prev page', () => {
|
|
|
|
findPagination().vm.$emit('prev');
|
2021-09-04 01:27:46 +05:30
|
|
|
|
|
|
|
expect(wrapper.emitted('input')[0]).toEqual([
|
|
|
|
{
|
2022-08-27 11:52:29 +05:30
|
|
|
before: mockStartCursor,
|
2021-09-04 01:27:46 +05:30
|
|
|
},
|
|
|
|
]);
|
|
|
|
});
|
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
it('Goes to the next page', () => {
|
|
|
|
findPagination().vm.$emit('next');
|
2021-09-04 01:27:46 +05:30
|
|
|
|
|
|
|
expect(wrapper.emitted('input')[0]).toEqual([
|
|
|
|
{
|
2022-08-27 11:52:29 +05:30
|
|
|
after: mockEndCursor,
|
2021-09-04 01:27:46 +05:30
|
|
|
},
|
|
|
|
]);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
describe.each`
|
|
|
|
page | hasPreviousPage | hasNextPage
|
|
|
|
${'first'} | ${false} | ${true}
|
|
|
|
${'last'} | ${true} | ${false}
|
|
|
|
`('When on the $page page', ({ page, hasPreviousPage, hasNextPage }) => {
|
|
|
|
const mockPageInfo = {
|
|
|
|
startCursor: mockStartCursor,
|
|
|
|
endCursor: mockEndCursor,
|
|
|
|
hasPreviousPage,
|
|
|
|
hasNextPage,
|
|
|
|
};
|
|
|
|
|
2021-09-04 01:27:46 +05:30
|
|
|
beforeEach(() => {
|
|
|
|
createComponent({
|
2022-08-27 11:52:29 +05:30
|
|
|
pageInfo: mockPageInfo,
|
2021-09-04 01:27:46 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
it(`Contains the ${page} page information`, () => {
|
|
|
|
expect(findPagination().props()).toMatchObject(mockPageInfo);
|
2021-09-04 01:27:46 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
describe('When no other pages', () => {
|
2021-09-04 01:27:46 +05:30
|
|
|
beforeEach(() => {
|
|
|
|
createComponent({
|
2022-08-27 11:52:29 +05:30
|
|
|
pageInfo: {
|
|
|
|
hasPreviousPage: false,
|
|
|
|
hasNextPage: false,
|
|
|
|
},
|
2021-09-04 01:27:46 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
it('is not shown', () => {
|
|
|
|
expect(findPagination().exists()).toBe(false);
|
2021-09-04 01:27:46 +05:30
|
|
|
});
|
2022-08-27 11:52:29 +05:30
|
|
|
});
|
2021-09-04 01:27:46 +05:30
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
describe('When adding more attributes', () => {
|
|
|
|
beforeEach(() => {
|
|
|
|
createComponent({
|
|
|
|
pageInfo: {
|
|
|
|
hasPreviousPage: true,
|
|
|
|
hasNextPage: false,
|
|
|
|
},
|
|
|
|
disabled: true,
|
|
|
|
});
|
2021-09-04 01:27:46 +05:30
|
|
|
});
|
|
|
|
|
2022-08-27 11:52:29 +05:30
|
|
|
it('attributes are passed', () => {
|
|
|
|
expect(findPagination().props('disabled')).toBe(true);
|
2021-09-04 01:27:46 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|