import { createLocalVue, mount } from '@vue/test-utils'
import MyConfirm from '@vue2-client/base-client/components/common/XBadge'
import Plugins from '@vue2-client/base-client/plugins'
import Antd from 'ant-design-vue'
import { it, describe, expect, beforeAll, jest } from '@jest/globals'

const localVue = createLocalVue()

// 此处与index.js保持一致，保证antd的组件和appdata可以正常载入
localVue.use(Antd)
localVue.use(Plugins)

describe('MyConfirm', () => {
  beforeAll(() => {
    // mock localStorage的数据
    const getItemSpy = jest.spyOn(window.localStorage.__proto__, 'getItem')
    getItemSpy.mockImplementation((key) => {
      if (key === process.env.VUE_APP_BADGE_KEY) {
        return JSON.stringify({
          badgeStyleMap: {
            red: {
              status: 'red',
              text: '红色(Red)'
            },
            blue: {
              status: 'blue',
              text: '蓝色(Blue)'
            }
          }
        })
      }
    })
  })
  // 测试用例：正确渲染组件
  it('renders correctly', () => {
    const wrapper = mount(MyConfirm, {
      localVue: localVue,
      // 组件必要的传参
      propsData: {
        badgeKey: 'badgeStyleMap',
        value: 'red'
      }
    })
    console.debug('返回的组件html：' + wrapper.html())
    expect(wrapper.exists()).toBe(true)
  })
})
