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

description_spec.js « fields « components « show « issues « frontend « spec - gitlab.com/gitlab-org/gitlab-foss.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
blob: 83b927d369972013c9142809990a90568af2047f (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
import { shallowMount } from '@vue/test-utils';
import DescriptionField from '~/issues/show/components/fields/description.vue';
import eventHub from '~/issues/show/event_hub';
import MarkdownField from '~/vue_shared/components/markdown/field.vue';
import MarkdownEditor from '~/vue_shared/components/markdown/markdown_editor.vue';
import { mockTracking } from 'helpers/tracking_helper';

describe('Description field component', () => {
  let wrapper;
  let trackingSpy;

  const findMarkdownEditor = () => wrapper.findComponent(MarkdownEditor);
  const mountComponent = ({ description = 'test', contentEditorOnIssues = false } = {}) => {
    wrapper = shallowMount(DescriptionField, {
      attachTo: document.body,
      propsData: {
        markdownPreviewPath: '/',
        markdownDocsPath: '/',
        value: description,
      },
      provide: {
        glFeatures: {
          contentEditorOnIssues,
        },
      },
      stubs: {
        MarkdownField,
      },
    });
  };

  beforeEach(() => {
    trackingSpy = mockTracking(undefined, null, jest.spyOn);
    jest.spyOn(eventHub, '$emit');

    mountComponent({ contentEditorOnIssues: true });
  });

  it('passes feature flag to the MarkdownEditorComponent', () => {
    expect(findMarkdownEditor().props('enableContentEditor')).toBe(true);

    mountComponent({ contentEditorOnIssues: false });

    expect(findMarkdownEditor().props('enableContentEditor')).toBe(false);
  });

  it('uses the MarkdownEditor component to edit markdown', () => {
    expect(findMarkdownEditor().props()).toMatchObject({
      value: 'test',
      renderMarkdownPath: '/',
      autofocus: true,
      supportsQuickActions: true,
      markdownDocsPath: '/',
      enableAutocomplete: true,
    });
  });

  describe.each`
    testDescription                 | metaKey  | ctrlKey
    ${'when meta+enter is pressed'} | ${true}  | ${false}
    ${'when ctrl+enter is pressed'} | ${false} | ${true}
  `('$testDescription', ({ metaKey, ctrlKey }) => {
    beforeEach(() => {
      findMarkdownEditor().vm.$emit('keydown', {
        type: 'keydown',
        keyCode: 13,
        metaKey,
        ctrlKey,
      });
    });

    it('triggers update', () => {
      expect(eventHub.$emit).toHaveBeenCalledWith('update.issuable');
    });

    it('tracks event', () => {
      expect(trackingSpy).toHaveBeenCalledWith(undefined, 'save_markdown', {
        label: 'markdown_editor',
        property: 'Issue',
      });
    });
  });

  it('emits input event when MarkdownEditor emits input event', () => {
    const markdown = 'markdown';

    findMarkdownEditor().vm.$emit('input', markdown);

    expect(wrapper.emitted('input')).toEqual([[markdown]]);
  });
});