BigW Consortium Gitlab

ci_icon_spec.js 3.31 KB
Newer Older
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
import Vue from 'vue';
import ciIcon from '~/vue_shared/components/ci_icon.vue';

describe('CI Icon component', () => {
  let CiIcon;
  beforeEach(() => {
    CiIcon = Vue.extend(ciIcon);
  });

  it('should render a span element with an svg', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_success',
        },
      },
    }).$mount();

    expect(component.$el.tagName).toEqual('SPAN');
    expect(component.$el.querySelector('span > svg')).toBeDefined();
  });

  it('should render a success status', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_success',
28
          group: 'success',
29 30 31 32 33 34 35 36 37 38 39 40
        },
      },
    }).$mount();

    expect(component.$el.classList.contains('ci-status-icon-success')).toEqual(true);
  });

  it('should render a failed status', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_failed',
41
          group: 'failed',
42 43 44 45 46 47 48 49 50 51 52 53
        },
      },
    }).$mount();

    expect(component.$el.classList.contains('ci-status-icon-failed')).toEqual(true);
  });

  it('should render success with warnings status', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_warning',
54
          group: 'warning',
55 56 57 58 59 60 61 62 63 64 65 66
        },
      },
    }).$mount();

    expect(component.$el.classList.contains('ci-status-icon-warning')).toEqual(true);
  });

  it('should render pending status', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_pending',
67
          group: 'pending',
68 69 70 71 72 73 74 75 76 77 78 79
        },
      },
    }).$mount();

    expect(component.$el.classList.contains('ci-status-icon-pending')).toEqual(true);
  });

  it('should render running status', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_running',
80
          group: 'running',
81 82 83 84 85 86 87 88 89 90 91 92
        },
      },
    }).$mount();

    expect(component.$el.classList.contains('ci-status-icon-running')).toEqual(true);
  });

  it('should render created status', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_created',
93
          group: 'created',
94 95 96 97 98 99 100 101 102 103 104 105
        },
      },
    }).$mount();

    expect(component.$el.classList.contains('ci-status-icon-created')).toEqual(true);
  });

  it('should render skipped status', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_skipped',
106
          group: 'skipped',
107 108 109 110 111 112 113 114 115 116 117 118
        },
      },
    }).$mount();

    expect(component.$el.classList.contains('ci-status-icon-skipped')).toEqual(true);
  });

  it('should render canceled status', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_canceled',
119
          group: 'canceled',
120 121 122 123 124 125 126 127 128 129 130 131
        },
      },
    }).$mount();

    expect(component.$el.classList.contains('ci-status-icon-canceled')).toEqual(true);
  });

  it('should render status for manual action', () => {
    const component = new CiIcon({
      propsData: {
        status: {
          icon: 'icon_status_manual',
132
          group: 'manual',
133 134 135 136 137 138 139
        },
      },
    }).$mount();

    expect(component.$el.classList.contains('ci-status-icon-manual')).toEqual(true);
  });
});