Welcome to mirror list, hosted at ThFree Co, Russian Federation.

blob_header_default_actions_spec.js « components « blob « frontend « spec - gitlab.com/gitlab-org/gitlab-foss.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
blob: aa538facae2db52d7a6aab67367a378f7c4ed666 (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
125
126
127
128
129
130
131
132
133
import { GlButtonGroup, GlButton } from '@gitlab/ui';
import BlobHeaderActions from '~/blob/components/blob_header_default_actions.vue';
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
import {
  BTN_COPY_CONTENTS_TITLE,
  BTN_DOWNLOAD_TITLE,
  BTN_RAW_TITLE,
  RICH_BLOB_VIEWER,
} from '~/blob/components/constants';
import { Blob, mockEnvironmentName, mockEnvironmentPath } from './mock_data';

describe('Blob Header Default Actions', () => {
  let wrapper;
  let btnGroup;
  let buttons;

  const blobHash = 'foo-bar';

  function createComponent(propsData = {}) {
    wrapper = shallowMountExtended(BlobHeaderActions, {
      provide: {
        blobHash,
      },
      propsData: {
        rawPath: Blob.rawPath,
        ...propsData,
      },
    });
  }

  beforeEach(() => {
    createComponent();
    btnGroup = wrapper.find(GlButtonGroup);
    buttons = wrapper.findAll(GlButton);
  });

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

  describe('renders', () => {
    const findCopyButton = () => wrapper.findByTestId('copyContentsButton');
    const findViewRawButton = () => wrapper.findByTestId('viewRawButton');

    it('gl-button-group component', () => {
      expect(btnGroup.exists()).toBe(true);
    });

    it('exactly 3 buttons with predefined actions', () => {
      expect(buttons.length).toBe(3);
      [BTN_COPY_CONTENTS_TITLE, BTN_RAW_TITLE, BTN_DOWNLOAD_TITLE].forEach((title, i) => {
        expect(buttons.at(i).vm.$el.title).toBe(title);
      });
    });

    it('correct href attribute on RAW button', () => {
      expect(buttons.at(1).attributes('href')).toBe(Blob.rawPath);
    });

    it('correct href attribute on Download button', () => {
      expect(buttons.at(2).attributes('href')).toBe(`${Blob.rawPath}?inline=false`);
    });

    it('does not render "Copy file contents" button as disables if the viewer is Simple', () => {
      expect(buttons.at(0).attributes('disabled')).toBeUndefined();
    });

    it('renders "Copy file contents" button as disables if the viewer is Rich', () => {
      createComponent({
        activeViewer: RICH_BLOB_VIEWER,
      });
      buttons = wrapper.findAll(GlButton);

      expect(buttons.at(0).attributes('disabled')).toBeTruthy();
    });

    it('does not render the copy button if a rendering error is set', () => {
      createComponent({
        hasRenderError: true,
      });

      expect(findCopyButton().exists()).toBe(false);
    });

    it('does not render the copy and view raw button if isBinary is set to true', () => {
      createComponent({ isBinary: true });

      expect(findCopyButton().exists()).toBe(false);
      expect(findViewRawButton().exists()).toBe(false);
    });

    it('emits a copy event if overrideCopy is set to true', () => {
      createComponent({ overrideCopy: true });
      jest.spyOn(wrapper.vm, '$emit');
      findCopyButton().vm.$emit('click');

      expect(wrapper.vm.$emit).toHaveBeenCalledWith('copy');
    });
  });

  describe('view on environment button', () => {
    const findEnvironmentButton = () => wrapper.findByTestId('environment');

    it.each`
      environmentName        | environmentPath        | isVisible
      ${null}                | ${null}                | ${false}
      ${null}                | ${mockEnvironmentPath} | ${false}
      ${mockEnvironmentName} | ${null}                | ${false}
      ${mockEnvironmentName} | ${mockEnvironmentPath} | ${true}
    `(
      'when environmentName is $environmentName and environmentPath is $environmentPath',
      ({ environmentName, environmentPath, isVisible }) => {
        createComponent({ environmentName, environmentPath });

        expect(findEnvironmentButton().exists()).toBe(isVisible);
      },
    );

    it('renders the correct attributes', () => {
      createComponent({
        environmentName: mockEnvironmentName,
        environmentPath: mockEnvironmentPath,
      });

      expect(findEnvironmentButton().attributes()).toMatchObject({
        title: `View on ${mockEnvironmentName}`,
        href: mockEnvironmentPath,
      });

      expect(findEnvironmentButton().props('icon')).toBe('external-link');
    });
  });
});