claude rework

vue/src/components/modal/__tests__/AddUrl.spec.js

@@ -0,0 +1,43 @@
+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')
+  })
+})