spec/javascripts/vue_shared/components/callout_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

import Vue from 'vue';
import callout from '~/vue_shared/components/callout.vue';
import createComponent from 'spec/helpers/vue_mount_component_helper';

describe('Callout Component', () => {
  let CalloutComponent;
  let vm;
  const exampleMessage = 'This is a callout message!';

  beforeEach(() => {
    CalloutComponent = Vue.extend(callout);
  });

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

  it('should render the appropriate variant of callout', () => {
    vm = createComponent(CalloutComponent, {
      category: 'info',
      message: exampleMessage,
    });

    expect(vm.$el.getAttribute('class')).toEqual('bs-callout bs-callout-info');

    expect(vm.$el.tagName).toEqual('DIV');
  });

  it('should render accessibility attributes', () => {
    vm = createComponent(CalloutComponent, {
      message: exampleMessage,
    });

    expect(vm.$el.getAttribute('role')).toEqual('alert');
    expect(vm.$el.getAttribute('aria-live')).toEqual('assertive');
  });

  it('should render the provided message', () => {
    vm = createComponent(CalloutComponent, {
      message: exampleMessage,
    });

    expect(vm.$el.innerHTML.trim()).toEqual(exampleMessage);
  });
});