summaryrefslogtreecommitdiff
path: root/spec/frontend/repository/components/breadcrumbs_spec.js
blob: 0733cffe4f41a882982463044d3f928699e2471a (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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
import { GlDropdown } from '@gitlab/ui';
import { shallowMount, RouterLinkStub } from '@vue/test-utils';
import Breadcrumbs from '~/repository/components/breadcrumbs.vue';
import UploadBlobModal from '~/repository/components/upload_blob_modal.vue';

const defaultMockRoute = {
  name: 'blobPath',
};

describe('Repository breadcrumbs component', () => {
  let wrapper;

  const factory = (currentPath, extraProps = {}, mockRoute = {}) => {
    const $apollo = {
      queries: {
        userPermissions: {
          loading: true,
        },
      },
    };

    wrapper = shallowMount(Breadcrumbs, {
      propsData: {
        currentPath,
        ...extraProps,
      },
      stubs: {
        RouterLink: RouterLinkStub,
      },
      mocks: {
        $route: {
          defaultMockRoute,
          ...mockRoute,
        },
        $apollo,
      },
    });
  };

  const findUploadBlobModal = () => wrapper.find(UploadBlobModal);

  afterEach(() => {
    wrapper.destroy();
  });

  it.each`
    path                        | linkCount
    ${'/'}                      | ${1}
    ${'app'}                    | ${2}
    ${'app/assets'}             | ${3}
    ${'app/assets/javascripts'} | ${4}
  `('renders $linkCount links for path $path', ({ path, linkCount }) => {
    factory(path);

    expect(wrapper.findAll(RouterLinkStub).length).toEqual(linkCount);
  });

  it('escapes hash in directory path', () => {
    factory('app/assets/javascripts#');

    expect(wrapper.findAll(RouterLinkStub).at(3).props('to')).toEqual(
      '/-/tree/app/assets/javascripts%23',
    );
  });

  it('renders last link as active', () => {
    factory('app/assets');

    expect(wrapper.findAll(RouterLinkStub).at(2).attributes('aria-current')).toEqual('page');
  });

  it('does not render add to tree dropdown when permissions are false', async () => {
    factory('/', { canCollaborate: false });

    wrapper.setData({ userPermissions: { forkProject: false, createMergeRequestIn: false } });

    await wrapper.vm.$nextTick();

    expect(wrapper.find(GlDropdown).exists()).toBe(false);
  });

  it.each`
    routeName            | isRendered
    ${'blobPath'}        | ${false}
    ${'blobPathDecoded'} | ${false}
    ${'treePath'}        | ${true}
    ${'treePathDecoded'} | ${true}
    ${'projectRoot'}     | ${true}
  `(
    'does render add to tree dropdown $isRendered when route is $routeName',
    ({ routeName, isRendered }) => {
      factory('app/assets/javascripts.js', { canCollaborate: true }, { name: routeName });
      expect(wrapper.find(GlDropdown).exists()).toBe(isRendered);
    },
  );

  it('renders add to tree dropdown when permissions are true', async () => {
    factory('/', { canCollaborate: true });

    wrapper.setData({ userPermissions: { forkProject: true, createMergeRequestIn: true } });

    await wrapper.vm.$nextTick();

    expect(wrapper.find(GlDropdown).exists()).toBe(true);
  });

  describe('renders the upload blob modal', () => {
    beforeEach(() => {
      factory('/', { canEditTree: true });
    });

    it('does not render the modal while loading', () => {
      expect(findUploadBlobModal().exists()).toBe(false);
    });

    it('renders the modal once loaded', async () => {
      wrapper.setData({ $apollo: { queries: { userPermissions: { loading: false } } } });

      await wrapper.vm.$nextTick();

      expect(findUploadBlobModal().exists()).toBe(true);
    });
  });
});