rufloui 0.3.2 → 0.3.35

package/src/frontend/__tests__/api.test.ts

@@ -0,0 +1,375 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+
+vi.mock('../store', () => ({
+  useStore: { getState: () => ({ addLog: vi.fn() }) },
+}))
+
+const mockFetch = vi.fn()
+vi.stubGlobal('fetch', mockFetch)
+
+// Import after mocks are set up
+const { api } = await import('../api')
+
+beforeEach(() => {
+  mockFetch.mockReset()
+  mockFetch.mockResolvedValue({
+    ok: true,
+    json: () => Promise.resolve({ status: 'ok' }),
+  })
+})
+
+describe('api.system', () => {
+  it('health() calls GET /api/system/health', async () => {
+    await api.system.health()
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/system/health',
+      expect.objectContaining({ headers: { 'Content-Type': 'application/json' } }),
+    )
+  })
+
+  it('info() calls GET /api/system/info', async () => {
+    await api.system.info()
+    expect(mockFetch).toHaveBeenCalledWith('/api/system/info', expect.any(Object))
+  })
+})
+
+describe('api.agents', () => {
+  it('spawn() sends POST with type and name', async () => {
+    await api.agents.spawn({ type: 'coder', name: 'my-coder' })
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/agents/spawn',
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ type: 'coder', name: 'my-coder' }),
+      }),
+    )
+  })
+
+  it('list() calls GET /api/agents', async () => {
+    await api.agents.list()
+    expect(mockFetch).toHaveBeenCalledWith('/api/agents', expect.any(Object))
+  })
+
+  it('terminate() sends POST to agent endpoint', async () => {
+    await api.agents.terminate('agent-123')
+    expect(mockFetch).toHaveBeenCalledWith('/api/agents/agent-123/terminate', expect.objectContaining({ method: 'POST' }))
+  })
+})
+
+describe('api.tasks', () => {
+  it('create() sends POST with task data', async () => {
+    await api.tasks.create({ title: 'My task', description: 'Do stuff', priority: 'high' })
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/tasks',
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ title: 'My task', description: 'Do stuff', priority: 'high' }),
+      }),
+    )
+  })
+
+  it('list() calls GET /api/tasks', async () => {
+    await api.tasks.list()
+    expect(mockFetch).toHaveBeenCalledWith('/api/tasks', expect.any(Object))
+  })
+})
+
+describe('api.memory', () => {
+  it('store() sends POST with key-value data', async () => {
+    await api.memory.store({ key: 'k', value: 'v', namespace: 'ns', tags: ['t1'] })
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/memory',
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ key: 'k', value: 'v', namespace: 'ns', tags: ['t1'] }),
+      }),
+    )
+  })
+
+  it('search() sends POST with query', async () => {
+    await api.memory.search('hello', 'ns', 10)
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/memory/search',
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ query: 'hello', namespace: 'ns', limit: 10 }),
+      }),
+    )
+  })
+})
+
+describe('api.swarm', () => {
+  it('init() sends POST with topology options', async () => {
+    await api.swarm.init({ topology: 'mesh', maxAgents: 8 })
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/swarm/init',
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ topology: 'mesh', maxAgents: 8 }),
+      }),
+    )
+  })
+
+  it('status() calls GET /api/swarm/status', async () => {
+    await api.swarm.status()
+    expect(mockFetch).toHaveBeenCalledWith('/api/swarm/status', expect.any(Object))
+  })
+
+  it('shutdown() sends POST /api/swarm/shutdown', async () => {
+    await api.swarm.shutdown()
+    expect(mockFetch).toHaveBeenCalledWith('/api/swarm/shutdown', expect.objectContaining({ method: 'POST' }))
+  })
+})
+
+describe('api.sessions', () => {
+  it('list() calls GET /api/sessions', async () => {
+    await api.sessions.list()
+    expect(mockFetch).toHaveBeenCalledWith('/api/sessions', expect.any(Object))
+  })
+
+  it('save() sends POST with name', async () => {
+    await api.sessions.save('my-session')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/sessions/save',
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ name: 'my-session' }),
+      }),
+    )
+  })
+
+  it('restore() sends POST to session endpoint', async () => {
+    await api.sessions.restore('sess-1')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/sessions/sess-1/restore',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+
+  it('delete() sends DELETE to session endpoint', async () => {
+    await api.sessions.delete('sess-1')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/sessions/sess-1',
+      expect.objectContaining({ method: 'DELETE' }),
+    )
+  })
+})
+
+describe('api.webhooks', () => {
+  it('getGitHubConfig() calls GET', async () => {
+    await api.webhooks.getGitHubConfig()
+    expect(mockFetch).toHaveBeenCalledWith('/api/webhooks/github/config', expect.any(Object))
+  })
+
+  it('setGitHubConfig() sends PUT with config', async () => {
+    await api.webhooks.setGitHubConfig({ enabled: true, repos: ['a/b'] })
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/webhooks/github/config',
+      expect.objectContaining({
+        method: 'PUT',
+        body: JSON.stringify({ enabled: true, repos: ['a/b'] }),
+      }),
+    )
+  })
+
+  it('getGitHubEvents() calls GET', async () => {
+    await api.webhooks.getGitHubEvents()
+    expect(mockFetch).toHaveBeenCalledWith('/api/webhooks/github/events', expect.any(Object))
+  })
+
+  it('testGitHub() sends POST', async () => {
+    await api.webhooks.testGitHub()
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/webhooks/github/test',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+
+  it('getGitLabConfig() calls GET', async () => {
+    await api.webhooks.getGitLabConfig()
+    expect(mockFetch).toHaveBeenCalledWith('/api/webhooks/gitlab/config', expect.any(Object))
+  })
+
+  it('testGitLab() sends POST', async () => {
+    await api.webhooks.testGitLab()
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/webhooks/gitlab/test',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+})
+
+describe('api.workflows', () => {
+  it('list() calls GET /api/workflows', async () => {
+    await api.workflows.list()
+    expect(mockFetch).toHaveBeenCalledWith('/api/workflows', expect.any(Object))
+  })
+
+  it('create() sends POST with name and steps', async () => {
+    await api.workflows.create({ name: 'ci', steps: [{ action: 'test' }] })
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/workflows',
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ name: 'ci', steps: [{ action: 'test' }] }),
+      }),
+    )
+  })
+
+  it('execute() sends POST to workflow execute', async () => {
+    await api.workflows.execute('wf-1')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/workflows/wf-1/execute',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+
+  it('cancel() sends POST to workflow cancel', async () => {
+    await api.workflows.cancel('wf-1')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/workflows/wf-1/cancel',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+
+  it('delete() sends DELETE', async () => {
+    await api.workflows.delete('wf-1')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/workflows/wf-1',
+      expect.objectContaining({ method: 'DELETE' }),
+    )
+  })
+})
+
+describe('api.config', () => {
+  it('list() calls GET /api/config', async () => {
+    await api.config.list()
+    expect(mockFetch).toHaveBeenCalledWith('/api/config', expect.any(Object))
+  })
+
+  it('set() sends PUT with value', async () => {
+    await api.config.set('theme', 'dark')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/config/theme',
+      expect.objectContaining({
+        method: 'PUT',
+        body: JSON.stringify({ value: 'dark' }),
+      }),
+    )
+  })
+
+  it('reset() sends POST', async () => {
+    await api.config.reset()
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/config/reset',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+})
+
+describe('api.performance', () => {
+  it('metrics() calls GET', async () => {
+    await api.performance.metrics()
+    expect(mockFetch).toHaveBeenCalledWith('/api/performance/metrics', expect.any(Object))
+  })
+
+  it('benchmark() sends POST', async () => {
+    await api.performance.benchmark({ type: 'full' })
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/performance/benchmark',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+})
+
+describe('api.agents — extended', () => {
+  it('terminateAll() sends POST /api/agents/terminate-all', async () => {
+    await api.agents.terminateAll()
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/agents/terminate-all',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+
+  it('status() calls GET /api/agents/:id/status', async () => {
+    await api.agents.status('a1')
+    expect(mockFetch).toHaveBeenCalledWith('/api/agents/a1/status', expect.any(Object))
+  })
+})
+
+describe('api.tasks — extended', () => {
+  it('assign() sends POST with agentId', async () => {
+    await api.tasks.assign('t1', 'a1')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/tasks/t1/assign',
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ agentId: 'a1' }),
+      }),
+    )
+  })
+
+  it('complete() sends POST with result', async () => {
+    await api.tasks.complete('t1', 'done')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/tasks/t1/complete',
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ result: 'done' }),
+      }),
+    )
+  })
+
+  it('cancel() sends POST', async () => {
+    await api.tasks.cancel('t1')
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/tasks/t1/cancel',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+
+  it('output() calls GET with tail param', async () => {
+    await api.tasks.output('t1', 100)
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/tasks/t1/output?tail=100',
+      expect.any(Object),
+    )
+  })
+
+  it('cleanCompleted() sends POST', async () => {
+    await api.tasks.cleanCompleted()
+    expect(mockFetch).toHaveBeenCalledWith(
+      '/api/tasks/clean-completed',
+      expect.objectContaining({ method: 'POST' }),
+    )
+  })
+})
+
+describe('error handling', () => {
+  it('throws on non-OK response', async () => {
+    mockFetch.mockResolvedValueOnce({
+      ok: false,
+      statusText: 'Internal Server Error',
+      json: () => Promise.resolve({ error: 'something broke' }),
+    })
+    await expect(api.system.health()).rejects.toThrow('something broke')
+  })
+
+  it('throws with statusText when json parse fails', async () => {
+    mockFetch.mockResolvedValueOnce({
+      ok: false,
+      statusText: 'Bad Gateway',
+      json: () => Promise.reject(new Error('parse error')),
+    })
+    await expect(api.system.info()).rejects.toThrow('Bad Gateway')
+  })
+
+  it('throws timeout error when request takes too long', async () => {
+    // Simulate an AbortError
+    const abortError = new DOMException('The operation was aborted', 'AbortError')
+    mockFetch.mockRejectedValueOnce(abortError)
+    // The request function catches AbortError and rethrows with a message
+    // But since our mock bypasses the controller, we test the DOMException directly
+    await expect(api.system.info()).rejects.toThrow()
+  })
+})

package/src/frontend/__tests__/components.test.tsx

@@ -0,0 +1,195 @@
+import { describe, it, expect, vi } from 'vitest'
+import { render, screen, fireEvent } from '@testing-library/react'
+import { Button } from '../components/ui/Button'
+import { Card } from '../components/ui/Card'
+import { StatusBadge } from '../components/ui/StatusBadge'
+
+// ── Button ──────────────────────────────────────────────────────────────
+
+describe('Button', () => {
+  it('renders children text', () => {
+    render(<Button>Click me</Button>)
+    expect(screen.getByText('Click me')).toBeInTheDocument()
+  })
+
+  it('calls onClick when clicked', () => {
+    const onClick = vi.fn()
+    render(<Button onClick={onClick}>Go</Button>)
+    fireEvent.click(screen.getByText('Go'))
+    expect(onClick).toHaveBeenCalledTimes(1)
+  })
+
+  it('does not call onClick when disabled', () => {
+    const onClick = vi.fn()
+    render(<Button onClick={onClick} disabled>Go</Button>)
+    fireEvent.click(screen.getByText('Go'))
+    expect(onClick).not.toHaveBeenCalled()
+  })
+
+  it('does not call onClick when loading', () => {
+    const onClick = vi.fn()
+    render(<Button onClick={onClick} loading>Go</Button>)
+    fireEvent.click(screen.getByText('Go'))
+    expect(onClick).not.toHaveBeenCalled()
+  })
+
+  it('has disabled attribute when disabled', () => {
+    render(<Button disabled>Go</Button>)
+    expect(screen.getByRole('button')).toBeDisabled()
+  })
+
+  it('has disabled attribute when loading', () => {
+    render(<Button loading>Go</Button>)
+    expect(screen.getByRole('button')).toBeDisabled()
+  })
+
+  it('renders with different variants', () => {
+    const { rerender } = render(<Button variant="primary">P</Button>)
+    expect(screen.getByText('P')).toBeInTheDocument()
+    rerender(<Button variant="danger">D</Button>)
+    expect(screen.getByText('D')).toBeInTheDocument()
+    rerender(<Button variant="ghost">G</Button>)
+    expect(screen.getByText('G')).toBeInTheDocument()
+  })
+
+  it('renders with different sizes', () => {
+    const { rerender } = render(<Button size="sm">S</Button>)
+    expect(screen.getByText('S')).toBeInTheDocument()
+    rerender(<Button size="md">M</Button>)
+    expect(screen.getByText('M')).toBeInTheDocument()
+  })
+})
+
+// ── Card ────────────────────────────────────────────────────────────────
+
+describe('Card', () => {
+  it('renders children', () => {
+    render(<Card>Card content</Card>)
+    expect(screen.getByText('Card content')).toBeInTheDocument()
+  })
+
+  it('renders title when provided', () => {
+    render(<Card title="My Card">Body</Card>)
+    expect(screen.getByText('My Card')).toBeInTheDocument()
+  })
+
+  it('renders actions when provided', () => {
+    render(<Card actions={<button>Action</button>}>Body</Card>)
+    expect(screen.getByText('Action')).toBeInTheDocument()
+  })
+
+  it('renders both title and actions', () => {
+    render(<Card title="Title" actions={<span>Act</span>}>Body</Card>)
+    expect(screen.getByText('Title')).toBeInTheDocument()
+    expect(screen.getByText('Act')).toBeInTheDocument()
+  })
+
+  it('does not render header when no title or actions', () => {
+    const { container } = render(<Card>Just body</Card>)
+    // Header has the borderBottom style, body doesn't — check there's only one child div
+    const cardDiv = container.firstChild as HTMLElement
+    expect(cardDiv.children).toHaveLength(1) // only the body div
+  })
+})
+
+// ── StatusBadge ─────────────────────────────────────────────────────────
+
+describe('StatusBadge', () => {
+  it('renders status text', () => {
+    render(<StatusBadge status="active" />)
+    expect(screen.getByText('active')).toBeInTheDocument()
+  })
+
+  it('renders different statuses', () => {
+    const { rerender } = render(<StatusBadge status="running" />)
+    expect(screen.getByText('running')).toBeInTheDocument()
+    rerender(<StatusBadge status="error" />)
+    expect(screen.getByText('error')).toBeInTheDocument()
+    rerender(<StatusBadge status="completed" />)
+    expect(screen.getByText('completed')).toBeInTheDocument()
+  })
+
+  it('shows unknown when status is empty', () => {
+    render(<StatusBadge status="" />)
+    expect(screen.getByText('unknown')).toBeInTheDocument()
+  })
+
+  it('renders a dot element', () => {
+    const { container } = render(<StatusBadge status="idle" />)
+    const spans = container.querySelectorAll('span')
+    // Outer container span > dot span + label span
+    expect(spans.length).toBeGreaterThanOrEqual(3)
+  })
+
+  it('renders with sm size', () => {
+    render(<StatusBadge status="active" size="sm" />)
+    expect(screen.getByText('active')).toBeInTheDocument()
+  })
+
+  it('applies correct color for each known status', () => {
+    const statuses = ['active', 'running', 'healthy', 'idle', 'pending', 'saved', 'error', 'failed', 'unhealthy', 'completed', 'paused', 'draft']
+    for (const status of statuses) {
+      const { unmount } = render(<StatusBadge status={status} />)
+      expect(screen.getByText(status)).toBeInTheDocument()
+      unmount()
+    }
+  })
+
+  it('handles null-ish status gracefully', () => {
+    render(<StatusBadge status={undefined as unknown as string} />)
+    expect(screen.getByText('unknown')).toBeInTheDocument()
+  })
+})
+
+// ── Button — hover behavior ────────────────────────────────────────────
+
+describe('Button — hover behavior', () => {
+  it('changes opacity on mouseEnter and mouseLeave', () => {
+    render(<Button>Hover me</Button>)
+    const btn = screen.getByRole('button')
+    fireEvent.mouseEnter(btn)
+    expect(btn.style.opacity).toBe('0.85')
+    fireEvent.mouseLeave(btn)
+    expect(btn.style.opacity).toBe('1')
+  })
+
+  it('does not change opacity on hover when disabled', () => {
+    render(<Button disabled>No hover</Button>)
+    const btn = screen.getByRole('button')
+    fireEvent.mouseEnter(btn)
+    // opacity should not change (stays at disabled state)
+    expect(btn.style.opacity).not.toBe('0.85')
+  })
+})
+
+// ── Button — custom style ──────────────────────────────────────────────
+
+describe('Button — custom style', () => {
+  it('merges custom style prop', () => {
+    render(<Button style={{ marginTop: 10 }}>Styled</Button>)
+    const btn = screen.getByRole('button')
+    expect(btn.style.marginTop).toBe('10px')
+  })
+})
+
+// ── Card — edge cases ──────────────────────────────────────────────────
+
+describe('Card — edge cases', () => {
+  it('renders with only actions (no title)', () => {
+    render(<Card actions={<button>Act</button>}>Body</Card>)
+    expect(screen.getByText('Act')).toBeInTheDocument()
+    expect(screen.getByText('Body')).toBeInTheDocument()
+  })
+
+  it('renders with complex children', () => {
+    render(
+      <Card title="Complex">
+        <div data-testid="inner">
+          <span>Nested content</span>
+        </div>
+      </Card>
+    )
+    expect(screen.getByTestId('inner')).toBeInTheDocument()
+    expect(screen.getByText('Nested content')).toBeInTheDocument()
+  })
+})