How to mock API calls in Vue tests?

Question

Accepted Answer

**Mocking** — fake API responses.

```typescript
import { describe, it, expect, vi } from "vitest"
import { mount } from "@vue/test-utils"
import UserProfile from "./UserProfile.vue"

describe("UserProfile", () => {
    it("loads user data", async () => {
        // Mock fetch
        vi.spyOn(global, "fetch").mockResolvedValue({
            json: () => Promise.resolve({ name: "John" })
        })
        
        const wrapper = mount(UserProfile, {
            props: { userId: 1 }
        })
        
        await wrapper.vm.$nextTick()
        
        expect(wrapper.text()).toContain("John")
        expect(fetch).toHaveBeenCalledWith("/api/users/1")
    })
})
```

Vue.js: How to mock API calls in Vue tests?