import Vue from 'vue'
import Vuex from 'vuex'
import Router from 'vue-router'
import VueProgressBar from 'vue-progressbar'
import {
  shallowMount
} from '@vue/test-utils'

import storeMock from './mocks/store-mock'
import routerMock from './mocks/router-mock'

import App from '@/App.vue'

const options = {
  color: '#6c4197',
  failedColor: 'rgb(242, 19, 93)',
  thickness: '2px',
  transition: {
    speed: '1.5s',
    opacity: '0.6s',
    termination: 300
  },
  autoRevert: true,
  location: 'top',
  inverse: false
}

Vue.use(Vuex)
Vue.use(Router)
Vue.use(VueProgressBar, options)

Vue.prototype.$auth = {
  check: jest.fn(),
  ready: jest.fn(),
  parseMeta: jest.fn()
}

Vue.prototype.$Progress = {
  start: jest.fn(),
  finish: jest.fn()
}

Vue.prototype.$i18n = {
  locale: jest.fn()
}

describe('App.vue', () => {
  const router = new Router(routerMock)
  const store = new Vuex.Store(storeMock)

  it('should have just two divs in the component', () => {
    const wrapper = shallowMount(App, {
      router,
      store
    })

    expect(wrapper.findAll('div')).toHaveLength(1)
  })
})
