agent-orchestrator/tests/e2e/specs/phase-a-agent.test.ts

import { browser, expect } from '@wdio/globals';

// Phase A — Agent: Agent pane initial state + prompt submission + NEW agent tests.
// Shares a single Tauri app session with other phase-a-* spec files.

// ─── Helpers ──────────────────────────────────────────────────────────

async function waitForAgentStatus(status: string, timeout = 30_000): Promise<void> {
  await browser.waitUntil(
    async () => {
      const attr = await browser.execute(() => {
        const el = document.querySelector('[data-testid="agent-pane"]');
        return el?.getAttribute('data-agent-status') ?? 'idle';
      });
      return attr === status;
    },
    { timeout, timeoutMsg: `Agent did not reach status "${status}" within ${timeout}ms` },
  );
}

async function agentPaneExists(): Promise<boolean> {
  const el = await browser.$('[data-testid="agent-pane"]');
  return el.isExisting();
}

async function sendAgentPrompt(text: string): Promise<void> {
  const textarea = await browser.$('[data-testid="agent-prompt"]');
  await textarea.waitForDisplayed({ timeout: 5000 });
  await textarea.setValue(text);
  await browser.pause(200);
  const submitBtn = await browser.$('[data-testid="agent-submit"]');
  await browser.execute((el) => (el as HTMLElement).click(), submitBtn);
}

async function getAgentStatus(): Promise<string> {
  return browser.execute(() => {
    const el = document.querySelector('[data-testid="agent-pane"]');
    return el?.getAttribute('data-agent-status') ?? 'unknown';
  });
}

async function getMessageCount(): Promise<number> {
  return browser.execute(() => {
    const area = document.querySelector('[data-testid="agent-messages"]');
    return area ? area.children.length : 0;
  });
}

// ─── Scenario 3: Agent pane initial state ────────────────────────────

describe('Scenario 3 — Agent Pane Initial State', () => {
  it('should display agent pane in idle status', async () => {
    if (!(await agentPaneExists())) {
      await browser.execute(() => {
        const tab = document.querySelector('[data-testid="project-tabs"] .ptab');
        if (tab) (tab as HTMLElement).click();
      });
      await browser.pause(300);
    }
    const pane = await browser.$('[data-testid="agent-pane"]');
    await expect(pane).toBeExisting();
    expect(await getAgentStatus()).toBe('idle');
  });

  it('should show prompt textarea', async () => {
    const textarea = await browser.$('[data-testid="agent-prompt"]');
    await expect(textarea).toBeDisplayed();
  });

  it('should show submit button', async () => {
    const btn = await browser.$('[data-testid="agent-submit"]');
    await expect(btn).toBeExisting();
  });

  it('should have empty messages area initially', async () => {
    const msgArea = await browser.$('[data-testid="agent-messages"]');
    await expect(msgArea).toBeExisting();
    const msgCount = await browser.execute(() => {
      const area = document.querySelector('[data-testid="agent-messages"]');
      return area ? area.querySelectorAll('.message').length : 0;
    });
    expect(msgCount).toBe(0);
  });

  it('should show agent provider name or badge', async () => {
    const hasContent = await browser.execute(() => {
      const session = document.querySelector('[data-testid="agent-session"]');
      return session !== null && (session.textContent ?? '').length > 0;
    });
    expect(hasContent).toBe(true);
  });

  it('should show cost display area (when session exists) or prompt area', async () => {
    // status-strip only renders when session is non-null; before first query
    // the agent pane shows only the prompt area — both are valid states
    const state = await browser.execute(() => {
      const pane = document.querySelector('[data-testid="agent-pane"]');
      if (!pane) return 'no-pane';
      if (pane.querySelector('.status-strip')) return 'has-status';
      if (pane.querySelector('.done-bar')) return 'has-done';
      if (pane.querySelector('[data-testid="agent-prompt"]')) return 'has-prompt';
      return 'empty';
    });
    expect(['has-status', 'has-done', 'has-prompt']).toContain(state);
  });

  it('should show agent pane with prompt or status area', async () => {
    // Context meter only visible during running state; verify pane structure instead
    const hasPane = await browser.execute(() => {
      const pane = document.querySelector('[data-testid="agent-pane"]');
      return pane !== null;
    });
    expect(hasPane).toBe(true);
  });

  it('should have tool call/result collapsible sections area', async () => {
    const ready = await browser.execute(() => {
      const area = document.querySelector('[data-testid="agent-messages"]');
      return area !== null && area instanceof HTMLElement;
    });
    expect(ready).toBe(true);
  });
});

// ─── Scenario 7: Agent prompt interaction (requires Claude CLI) ──────

describe('Scenario 7 — Agent Prompt Submission', () => {
  it('should accept text in prompt textarea', async () => {
    const textarea = await browser.$('[data-testid="agent-prompt"]');
    await textarea.waitForDisplayed({ timeout: 5000 });
    await textarea.setValue('Say hello');
    await browser.pause(200);
    expect(await textarea.getValue()).toBe('Say hello');
    await textarea.clearValue();
  });

  it('should enable submit button when prompt has text', async () => {
    const textarea = await browser.$('[data-testid="agent-prompt"]');
    await textarea.setValue('Test prompt');
    await browser.pause(200);
    const isDisabled = await browser.execute(() => {
      const btn = document.querySelector('[data-testid="agent-submit"]');
      return btn ? (btn as HTMLButtonElement).disabled : true;
    });
    expect(isDisabled).toBe(false);
    await textarea.clearValue();
  });

  it('should show stop button during agent execution (if Claude available)', async function () {
    await sendAgentPrompt('Reply with exactly: AGOR_TEST_OK');
    try { await waitForAgentStatus('running', 15_000); } catch {
      console.log('Agent did not start — Claude CLI may not be available. Skipping.');
      this.skip(); return;
    }
    const status = await getAgentStatus();
    if (status === 'running') {
      const stopBtn = await browser.$('[data-testid="agent-stop"]');
      await expect(stopBtn).toBeDisplayed();
    }
    try {
      await browser.waitUntil(
        async () => ['idle', 'done'].includes(await getAgentStatus()),
        { timeout: 40_000 },
      );
    } catch {
      console.log('Agent did not complete within 40s — skipping completion checks.');
      this.skip(); return;
    }
    expect(await getMessageCount()).toBeGreaterThan(0);
  });

  it('should show agent status transitions (idle -> running -> idle)', async function () {
    expect(await getAgentStatus()).toBe('idle');
    await sendAgentPrompt('Reply with one word: OK');
    try { await waitForAgentStatus('running', 15_000); } catch {
      console.log('Agent did not start — skipping status transition test.');
      this.skip(); return;
    }
    expect(await getAgentStatus()).toBe('running');
    // Agent may report 'idle' or 'done' after completion
    try {
      await browser.waitUntil(
        async () => ['idle', 'done'].includes(await getAgentStatus()),
        { timeout: 40_000 },
      );
    } catch { this.skip(); return; }
    expect(['idle', 'done']).toContain(await getAgentStatus());
  });

  it('should show message count increasing during execution', async function () {
    const countBefore = await getMessageCount();
    await sendAgentPrompt('Reply with exactly: AGOR_MSG_COUNT_TEST');
    try { await waitForAgentStatus('running', 15_000); } catch {
      this.skip(); return;
    }
    try { await waitForAgentStatus('idle', 40_000); } catch {
      this.skip(); return;
    }
    expect(await getMessageCount()).toBeGreaterThan(countBefore);
  });

  it('should disable prompt input while agent is running', async function () {
    await sendAgentPrompt('Reply with exactly: AGOR_DISABLE_TEST');
    try { await waitForAgentStatus('running', 15_000); } catch {
      this.skip(); return;
    }
    const uiState = await browser.execute(() => {
      const textarea = document.querySelector('[data-testid="agent-prompt"]') as HTMLTextAreaElement | null;
      const stopBtn = document.querySelector('[data-testid="agent-stop"]');
      return {
        textareaDisabled: textarea?.disabled ?? false,
        stopBtnVisible: stopBtn !== null && (stopBtn as HTMLElement).offsetParent !== null,
      };
    });
    expect(uiState.textareaDisabled || uiState.stopBtnVisible).toBe(true);
    try { await waitForAgentStatus('idle', 40_000); } catch {
      await browser.execute(() => {
        const btn = document.querySelector('[data-testid="agent-stop"]');
        if (btn) (btn as HTMLElement).click();
      });
      await browser.pause(2000);
    }
  });
});