import { describe, it, expect, vi, beforeEach } from 'vitest'
import { mount, flushPromises } from '@vue/test-utils'
import axios from 'axios'
import AddUrl from '../AddUrl.vue'

vi.mock('axios')

describe('AddUrl', () => {
  beforeEach(() => {
    localStorage.setItem('user-token', 'test-token')
    localStorage.setItem('user-id', '7')
    vi.clearAllMocks()
  })

  it('posts the entered url and title and shows a success message', async () => {
    axios.post.mockResolvedValueOnce({ status: 201 })

    const wrapper = mount(AddUrl, { props: { show: true } })
    await wrapper.find('#url').setValue('https://example.test/feed.xml')
    await wrapper.find('#title').setValue('Example feed')
    await wrapper.find('form').trigger('submit')
    await flushPromises()

    expect(axios.post).toHaveBeenCalledWith(
      '/api/v1/article/add',
      { url: 'https://example.test/feed.xml', title: 'Example feed', user_id: 7 },
      expect.anything(),
    )
    expect(wrapper.text()).toContain('saved successfully')
  })

  it('surfaces the error message when the request fails', async () => {
    axios.post.mockRejectedValueOnce({ message: 'Network Error' })

    const wrapper = mount(AddUrl, { props: { show: true } })
    await wrapper.find('#url').setValue('https://example.test/feed.xml')
    await wrapper.find('#title').setValue('Example feed')
    await wrapper.find('form').trigger('submit')
    await flushPromises()

    expect(wrapper.text()).toContain('Network Error')
  })
})