import Vue from 'vue';
import '../../utils/polyfills';
import NavBarItemPlugin, { MNavBarItem } from './nav-bar-item';

const SELECTED_CSS: string = 'm--is-selected';

let navbaritem: MNavBarItem;

describe('navbar-item', () => {
    beforeEach(() => {
        Vue.use(NavBarItemPlugin);
        navbaritem = new MNavBarItem().$mount();
    });

    it('skin prop', () => {
        expect(navbaritem.$el.classList.contains(SELECTED_CSS)).toBeFalsy();

        navbaritem.selected = true;
        Vue.nextTick(() => {
            expect(navbaritem.$el.classList.contains(SELECTED_CSS)).toBeTruthy();

            navbaritem.selected = false;
            Vue.nextTick(() => {
                expect(navbaritem.$el.classList.contains(SELECTED_CSS)).toBeFalsy();
            });
        });
    });

    it('click event', () => {
        let clickSpy = jasmine.createSpy('clickSpy');
        let vm = new Vue({
            template: `
                <m-nav-bar-item @click="onClick($event)"></m-nav-bar-item>
            `,
            methods: {
                onClick: clickSpy
            }
        }).$mount();

        let element = vm.$el;
        console.log(vm.$el);

        if (element) {
            (element as any).click();
        }

        Vue.nextTick(() => {
            expect(clickSpy).toHaveBeenCalled();
        });
    });

});

import Vue from 'vue';
import '../../utils/polyfills';
import NavBarItemPlugin, { MNavBarItem } from './nav-bar-item';

const SELECTED_CSS: string = 'm--is-selected';

let navbaritem: MNavBarItem;

describe('navbar-item', () => {
    beforeEach(() => {
        Vue.use(NavBarItemPlugin);
        navbaritem = new MNavBarItem().$mount();
    });

    it('selected prop', () => {
        expect(navbaritem.$el.classList.contains(SELECTED_CSS)).toBeFalsy();

        navbaritem.selected = true;
        Vue.nextTick(() => {
            expect(navbaritem.$el.classList.contains(SELECTED_CSS)).toBeTruthy();

            navbaritem.selected = false;
            Vue.nextTick(() => {
                expect(navbaritem.$el.classList.contains(SELECTED_CSS)).toBeFalsy();
            });
        });
    });

    it('click event', () => {
        let clickSpy = jasmine.createSpy('clickSpy');
        let vm = new Vue({
            template: `
                <m-nav-bar-item @click="onClick($event)"></m-nav-bar-item>
            `,
            methods: {
                onClick: clickSpy
            }
        }).$mount();

        let element = vm.$el;
        console.log(vm.$el);

        if (element) {
            (element as any).click();
        }

        Vue.nextTick(() => {
            expect(clickSpy).toHaveBeenCalled();
        });
    });

});

Change test name in nav-bar-item
Change test name in nav-bar-item

