import Vue from 'vue'
import { shallowMount } from '@vue/test-utils'
import RocketConfig from '@/views/rocket/config/index.vue'

jest.mock('@/components/data/PropsSourceSelectDrawer', () => ({
  name: 'PropsSourceSelectDrawer',
  render: h => h('div')
}))

jest.mock('@/api/rocket-config', () => ({
  listRocketConfigs: jest.fn(() => Promise.resolve({ body: [] })),
  updateRocketConfig: jest.fn(() => Promise.resolve({}))
}))

describe('RocketConfig edit dialog', () => {
  const originalSilent = Vue.config.silent

  beforeAll(() => {
    Vue.config.silent = true
  })

  afterAll(() => {
    Vue.config.silent = originalSilent
  })

  const createWrapper = () => shallowMount(RocketConfig, {
    mocks: {
      $t: key => key,
      $message: { warning: jest.fn() },
      $opsMessage: { success: jest.fn() }
    }
  })

  it('keeps the dialog above the mask and allows adding an empty reward', async() => {
    const wrapper = createWrapper()
    const dialog = wrapper.find('el-dialog')

    expect(dialog.attributes('append-to-body')).toBe('true')
    expect(dialog.attributes('modal-append-to-body')).toBe('true')

    wrapper.vm.dialogVisible = true
    wrapper.vm.addReward()
    await wrapper.vm.$nextTick()

    expect(wrapper.vm.dialogVisible).toBe(true)
    expect(wrapper.vm.form.rewardConfig).toHaveLength(1)
    expect(wrapper.vm.form.rewardConfig[0].type).toBe('GOLD')
    expect(wrapper.find('.rocket-dialog-content').exists()).toBe(true)
  })

  it('fills all internal reward fields from the prop drawer selection', async() => {
    const wrapper = createWrapper()
    wrapper.vm.form.rewardConfig.push({
      id: null,
      type: 'PROPS',
      content: '',
      name: '',
      quantity: 7,
      detailType: '',
      cover: '',
      sourceUrl: ''
    })

    wrapper.vm.openPropsDrawer(0)
    expect(wrapper.vm.propsDrawerVisible).toBe(true)
    expect(wrapper.vm.drawerPropsTypes).toContain('AVATAR_FRAME')

    wrapper.vm.selectPropsSource({
      id: '123456',
      type: 'AVATAR_FRAME',
      name: '星空头像框',
      cover: 'https://cdn.example.com/cover.png',
      sourceUrl: 'https://cdn.example.com/source.svga'
    })
    await wrapper.vm.$nextTick()

    expect(wrapper.vm.form.rewardConfig[0]).toEqual({
      id: '123456',
      type: 'PROPS',
      content: '123456',
      name: '星空头像框',
      quantity: 7,
      detailType: 'AVATAR_FRAME',
      cover: 'https://cdn.example.com/cover.png',
      sourceUrl: 'https://cdn.example.com/source.svga'
    })
    expect(wrapper.vm.propsDrawerVisible).toBe(false)
  })

  it('does not render manual resource metadata inputs for prop rewards', async() => {
    const wrapper = createWrapper()
    wrapper.vm.form.rewardConfig.push({
      id: '123456',
      type: 'PROPS',
      content: '123456',
      name: '星空头像框',
      quantity: 7,
      detailType: 'AVATAR_FRAME',
      cover: 'https://cdn.example.com/cover.png',
      sourceUrl: ''
    })
    await wrapper.vm.$nextTick()

    expect(wrapper.find('.selected-prop').exists()).toBe(true)
    expect(wrapper.text()).not.toContain('pages.rocketConfig.resourceId')
    expect(wrapper.text()).not.toContain('pages.rocketConfig.detailType')
    expect(wrapper.text()).not.toContain('pages.rocketConfig.cover')
  })
})