import { createAppLocalVue } from '@/../tests/utils' // should be the first to implement default mocks
import App from '@/app/App.vue'
import mockProductDetail from '../components/ProductDetail'
import { shallowMount, mount } from '@vue/test-utils'
import { loggedInStore, loggedOutStore } from '@/../tests/factories/auth-store'
import flushPromises from 'flush-promises'
import { store as appStore } from '@/store'
import { ESHOP } from '@/config/url-prefix'
import Vue from 'vue'

describe('Eshop Product Detail - Routing', () => {
  let store, localVue, router, SecurityConfig

  beforeEach(async () => {
    jest.resetModules()
    jest.clearAllMocks()

    router = await require('@/router').default

    SecurityConfig = await require('@/config/security').default

    SecurityConfig.router = router

    localVue = createAppLocalVue()

    await flushPromises()
  })

  it('Should not render product details component when logged out', async () => {
    store = loggedOutStore()

    const wrapper = shallowMount(App, {
      localVue,
      router,
      store: store,
    })

    router.push(ESHOP + '/registration/kitting/123').catch(() => {})

    await flushPromises()

    expect(wrapper.vm.$route.path).not.toMatch(ESHOP)
  })

  it('Should render product details when logged in with props', async () => {
    store = loggedInStore(appStore)

    jest.mock('../components/ProductDetail', () => {
      mockProductDetail.mounted = () => {}
      return mockProductDetail
    })

    const wrapper = mount(App, {
      localVue,
      router,
      store: store,
      sync: false,
      stubs: {
        HeaderFluid: `<router-view />`,
      },
    })

    router.push(ESHOP + '/registration/kitting/123')

    await flushPromises()

    let productDetails = wrapper.find(mockProductDetail)
    expect(productDetails.exists()).toBe(true)
    expect(productDetails.props('saleType')).toBe('registration')
    expect(productDetails.props('productType')).toBe('kitting')
    expect(productDetails.props('pid')).toBe('123')
  })
})
