summaryrefslogtreecommitdiff
path: root/spec/frontend/vue_shared/components/incubation/pagination_spec.js
blob: a621e60c627dbe5237485cc60d2360dcc6da1592 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
import { GlKeysetPagination } from '@gitlab/ui';
import { mountExtended } from 'helpers/vue_test_utils_helper';
import Pagination from '~/vue_shared/components/incubation/pagination.vue';

describe('~/vue_shared/incubation/components/pagination.vue', () => {
  let wrapper;

  const pageInfo = {
    startCursor: 'eyJpZCI6IjE2In0',
    endCursor: 'eyJpZCI6IjIifQ',
    hasNextPage: true,
    hasPreviousPage: true,
  };

  const findPagination = () => wrapper.findComponent(GlKeysetPagination);

  const createWrapper = (pageInfoProp) => {
    wrapper = mountExtended(Pagination, {
      propsData: pageInfoProp,
    });
  };

  describe('when neither next nor previous page exists', () => {
    beforeEach(() => {
      const emptyPageInfo = { ...pageInfo, hasPreviousPage: false, hasNextPage: false };

      createWrapper(emptyPageInfo);
    });

    it('should not render pagination component', () => {
      expect(wrapper.html()).toBe('');
    });
  });

  describe('when Pagination is rendered for environment details page', () => {
    beforeEach(() => {
      createWrapper(pageInfo);
    });

    it('should pass correct props to keyset pagination', () => {
      expect(findPagination().exists()).toBe(true);
      expect(findPagination().props()).toEqual(expect.objectContaining(pageInfo));
    });

    describe.each([
      {
        testPageInfo: pageInfo,
        expectedAfter: `cursor=${pageInfo.endCursor}`,
        expectedBefore: `cursor=${pageInfo.startCursor}`,
      },
      {
        testPageInfo: { ...pageInfo, hasNextPage: true, hasPreviousPage: false },
        expectedAfter: `cursor=${pageInfo.endCursor}`,
        expectedBefore: '',
      },
      {
        testPageInfo: { ...pageInfo, hasNextPage: false, hasPreviousPage: true },
        expectedAfter: '',
        expectedBefore: `cursor=${pageInfo.startCursor}`,
      },
    ])(
      'button links generation for $testPageInfo',
      ({ testPageInfo, expectedAfter, expectedBefore }) => {
        beforeEach(() => {
          createWrapper(testPageInfo);
        });

        it(`should have button links defined as ${expectedAfter || 'empty'} and
        ${expectedBefore || 'empty'}`, () => {
          expect(findPagination().props().prevButtonLink).toContain(expectedBefore);
          expect(findPagination().props().nextButtonLink).toContain(expectedAfter);
        });
      },
    );
  });
});