spec/javascripts/components/banner/banner_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

import { mount } from '@vue/test-utils';
import Banner from '../../../../content/frontend/components/banner/banner.vue';

const propsData = { text: 'Some text', show: true };

describe('component: Banner', () => {
  let wrapper;

  beforeEach(() => {
    wrapper = mount(Banner, { propsData, });
  });

  it('renders a banner', () => {
    expect(wrapper.exists('.banner')).toBe(true);
  });

  it('renders the correct banner text', () => {
    const bannerText =  wrapper.find('span');
    expect(bannerText.text()).toEqual(propsData.text);
  });

  it('renders a close button', () => {
    expect(wrapper.exists('.btn-close')).toBe(true);
  });

  it('emits a toggle event on mount', () => {
    expect(wrapper.emitted('toggle')[0]).toEqual([true]);
  });

  it('emits a toggle event when the close button is clicked', () => {
    const closeBtn = wrapper.find('.btn-close');
    closeBtn.trigger('click');
    expect(wrapper.emitted('toggle')[1]).toEqual([false]);
  });
});