Files
ComfyUI_frontend/tests-ui/tests/api.fetchApi.test.ts
Arjan Singh 8b7b580ed4 Cloud Auth Backport (#6195)
## Summary

Backports Firebase authentication with cloud environments.

Changes only work when developing for cloud environment locally.

## Changes

- Router guards to force unauthenticated users to sign in.
- Configure auth headers for REST and Websocket connections.
- Code implemented in a way that enables build tree-shaking based on
distribution
- Updates to build process to build cloud distribution and simplify
development workflow

## Review Focus

1. Idomatic Vue/codebase patterns.
2. Build logic (please double check that I integrated correctly with:
https://github.com/Comfy-Org/ComfyUI_frontend/blob/rh-test/vite.config.mts)

## Screenshots (if applicable)




https://github.com/user-attachments/assets/ee4ea3f7-afa6-4da0-ba43-d62ed8ba4e18





┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6195-Feat-cloud-auth-backport-2946d73d365081f395f5f2a89fb7d800)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Alexander Brown <drjkl@comfy.org>
Co-authored-by: GitHub Action <action@github.com>
2025-10-23 00:06:37 +00:00

172 lines
4.4 KiB
TypeScript

import { beforeEach, describe, expect, it, vi } from 'vitest'
import { api } from '@/scripts/api'
// Mock global fetch
vi.stubGlobal('fetch', vi.fn())
describe('api.fetchApi', () => {
beforeEach(() => {
vi.resetAllMocks()
// Reset api state
api.user = 'test-user'
})
describe('header handling', () => {
it('should add Comfy-User header with plain object headers', async () => {
const mockFetch = vi
.mocked(global.fetch)
.mockResolvedValue(new Response())
await api.fetchApi('/test', {
headers: {}
})
expect(mockFetch).toHaveBeenCalledWith(
expect.stringContaining('/test'),
expect.objectContaining({
headers: {
'Comfy-User': 'test-user'
}
})
)
})
it('should add Comfy-User header with Headers instance', async () => {
const mockFetch = vi
.mocked(global.fetch)
.mockResolvedValue(new Response())
const headers = new Headers()
await api.fetchApi('/test', { headers })
expect(mockFetch).toHaveBeenCalled()
const callHeaders = mockFetch.mock.calls[0][1]?.headers
expect(callHeaders).toEqual(headers)
})
it('should add Comfy-User header with array headers', async () => {
const mockFetch = vi
.mocked(global.fetch)
.mockResolvedValue(new Response())
const headers: [string, string][] = []
await api.fetchApi('/test', { headers })
expect(mockFetch).toHaveBeenCalled()
const callHeaders = mockFetch.mock.calls[0][1]?.headers
expect(callHeaders).toContainEqual(['Comfy-User', 'test-user'])
})
it('should preserve existing headers when adding Comfy-User', async () => {
const mockFetch = vi
.mocked(global.fetch)
.mockResolvedValue(new Response())
await api.fetchApi('/test', {
headers: {
'Content-Type': 'application/json',
'X-Custom': 'value'
}
})
expect(mockFetch).toHaveBeenCalledWith(
expect.stringContaining('/test'),
expect.objectContaining({
headers: {
'Content-Type': 'application/json',
'X-Custom': 'value',
'Comfy-User': 'test-user'
}
})
)
})
it('should not allow developer-specified headers to be overridden by options', async () => {
const mockFetch = vi
.mocked(global.fetch)
.mockResolvedValue(new Response())
await api.fetchApi('/test', {
headers: {
'Comfy-User': 'fennec-girl'
}
})
expect(mockFetch).toHaveBeenCalledWith(
expect.stringContaining('/test'),
expect.objectContaining({
headers: {
'Comfy-User': 'test-user'
}
})
)
})
})
describe('default options', () => {
it('should set cache to no-cache by default', async () => {
const mockFetch = vi
.mocked(global.fetch)
.mockResolvedValue(new Response())
await api.fetchApi('/test')
expect(mockFetch).toHaveBeenCalledWith(
expect.any(String),
expect.objectContaining({
cache: 'no-cache'
})
)
})
it('should include required headers even when no headers option is provided', async () => {
const mockFetch = vi
.mocked(global.fetch)
.mockResolvedValue(new Response())
await api.fetchApi('/test')
expect(mockFetch).toHaveBeenCalledWith(
expect.any(String),
expect.objectContaining({
headers: expect.objectContaining({
'Comfy-User': 'test-user'
})
})
)
})
it('should not override existing cache option', async () => {
const mockFetch = vi
.mocked(global.fetch)
.mockResolvedValue(new Response())
await api.fetchApi('/test', { cache: 'force-cache' })
expect(mockFetch).toHaveBeenCalledWith(
expect.any(String),
expect.objectContaining({
cache: 'force-cache'
})
)
})
})
describe('URL construction', () => {
it('should use apiURL for route construction', async () => {
const mockFetch = vi
.mocked(global.fetch)
.mockResolvedValue(new Response())
await api.fetchApi('/test/route')
expect(mockFetch).toHaveBeenCalledWith(
expect.stringContaining('/api/test/route'),
expect.any(Object)
)
})
})
})