spec/javascripts/import_projects/components/imported_project_table_row_spec.js


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

import Vue from 'vue';
import store from '~/import_projects/store';
import importedProjectTableRow from '~/import_projects/components/imported_project_table_row.vue';
import STATUS_MAP from '~/import_projects/constants';

describe('ImportedProjectTableRow', () => {
  let vm;
  const project = {
    id: 1,
    fullPath: 'fullPath',
    importStatus: 'finished',
    providerLink: 'providerLink',
    importSource: 'importSource',
  };

  function createComponent() {
    const ImportedProjectTableRow = Vue.extend(importedProjectTableRow);

    return new ImportedProjectTableRow({
      store,
      propsData: {
        project: {
          ...project,
        },
      },
    }).$mount();
  }

  afterEach(() => {
    vm.$destroy();
  });

  it('renders an imported project table row', () => {
    vm = createComponent();

    const providerLink = vm.$el.querySelector('.js-provider-link');
    const statusObject = STATUS_MAP[project.importStatus];

    expect(vm.$el.classList.contains('js-imported-project')).toBe(true);
    expect(providerLink.href).toMatch(project.providerLink);
    expect(providerLink.textContent).toMatch(project.importSource);
    expect(vm.$el.querySelector('.js-full-path').textContent).toMatch(project.fullPath);
    expect(vm.$el.querySelector(`.${statusObject.textClass}`).textContent).toMatch(
      statusObject.text,
    );

    expect(vm.$el.querySelector(`.ic-status_${statusObject.icon}`)).not.toBeNull();
    expect(vm.$el.querySelector('.js-go-to-project').href).toMatch(project.fullPath);
  });
});