2020-01-01 13:55:28 +05:30
|
|
|
import { mount } from '@vue/test-utils';
|
2019-09-30 21:07:59 +05:30
|
|
|
import PaginatedList from '~/vue_shared/components/paginated_list.vue';
|
|
|
|
import { PREV, NEXT } from '~/vue_shared/components/pagination/constants';
|
|
|
|
|
|
|
|
describe('Pagination links component', () => {
|
|
|
|
let wrapper;
|
|
|
|
let glPaginatedList;
|
|
|
|
|
|
|
|
const template = `
|
2021-09-30 23:02:18 +05:30
|
|
|
<template #default="{ listItem }">
|
|
|
|
<div class="slot">
|
|
|
|
<span class="item">Item Name: {{ listItem.id }}</span>
|
|
|
|
</div>
|
|
|
|
</template>
|
2019-09-30 21:07:59 +05:30
|
|
|
`;
|
|
|
|
|
|
|
|
const props = {
|
|
|
|
prevText: PREV,
|
|
|
|
nextText: NEXT,
|
|
|
|
};
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
wrapper = mount(PaginatedList, {
|
|
|
|
scopedSlots: {
|
|
|
|
default: template,
|
|
|
|
},
|
|
|
|
propsData: {
|
|
|
|
list: [{ id: 'foo' }, { id: 'bar' }],
|
|
|
|
props,
|
|
|
|
},
|
|
|
|
});
|
|
|
|
|
|
|
|
[glPaginatedList] = wrapper.vm.$children;
|
|
|
|
});
|
|
|
|
|
|
|
|
afterEach(() => {
|
|
|
|
wrapper.destroy();
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('Paginated List Component', () => {
|
|
|
|
describe('props', () => {
|
|
|
|
// We test attrs and not props because we pass through to child component using v-bind:"$attrs"
|
|
|
|
it('should pass prevText to GitLab UI paginated list', () => {
|
|
|
|
expect(glPaginatedList.$attrs['prev-text']).toBe(props.prevText);
|
|
|
|
});
|
|
|
|
it('should pass nextText to GitLab UI paginated list', () => {
|
|
|
|
expect(glPaginatedList.$attrs['next-text']).toBe(props.nextText);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('rendering', () => {
|
|
|
|
it('it renders the gl-paginated-list', () => {
|
2020-11-24 15:15:51 +05:30
|
|
|
expect(wrapper.find('ul.list-group').exists()).toBe(true);
|
2019-09-30 21:07:59 +05:30
|
|
|
expect(wrapper.findAll('li.list-group-item').length).toBe(2);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|