kandev/apps/web/e2e/tests/workflow/workflow-step-proceed.spec.ts

import { test, expect } from "../../fixtures/test-base";
import { routeMainWebSocketWithPromptDrop } from "../../helpers/ws-drop";
import { SessionPage } from "../../pages/session-page";

test.describe("Manual proceed to next workflow step", () => {
  /**
   * Regression test: moving a task out of a plan-mode step must disable plan mode
   * and show the next step's auto-start prompt in chat.
   *
   * Workflow: Spec (auto_start_agent) -> Work (auto_start_agent) -> Done
   *
   * 1. Create task via API in Spec step — agent auto-starts and completes
   * 2. Navigate to session page, manually enable plan mode
   * 3. Click "proceed to next step" button (Work)
   * 4. Assert: plan mode is disabled (plan panel hidden, default input placeholder)
   * 5. Assert: stepper shows Work as current step
   * 6. Assert: Work step's auto-start prompt response is visible in chat
   */
  test("proceed from plan-mode step disables plan mode and shows next step prompt", async ({
    testPage,
    apiClient,
    seedData,
  }) => {
    const workflow = await apiClient.createWorkflow(
      seedData.workspaceId,
      "Proceed Plan Step Workflow",
    );

    const specStep = await apiClient.createWorkflowStep(workflow.id, "Spec", 0);
    const workStep = await apiClient.createWorkflowStep(workflow.id, "Work", 1);
    await apiClient.createWorkflowStep(workflow.id, "Done", 2);

    // Spec: auto-start agent (completes quickly so we can proceed)
    await apiClient.updateWorkflowStep(specStep.id, {
      prompt: 'e2e:message("spec done")\n{{task_prompt}}',
      events: {
        on_enter: [{ type: "auto_start_agent" }],
      },
    });

    // Work: auto-start agent with a response we can assert on
    await apiClient.updateWorkflowStep(workStep.id, {
      prompt: 'e2e:message("work step response")\n{{task_prompt}}',
      events: {
        on_enter: [{ type: "auto_start_agent" }],
      },
    });

    // Create task via API in Spec step — triggers auto_start_agent
    const task = await apiClient.createTask(seedData.workspaceId, "Plan Proceed Task", {
      workflow_id: workflow.id,
      workflow_step_id: specStep.id,
      agent_profile_id: seedData.agentProfileId,
      repository_ids: [seedData.repositoryId],
    });

    await testPage.goto(`/t/${task.id}`);
    const session = new SessionPage(testPage);
    await session.waitForLoad();

    // Wait for agent to complete its turn (idle input visible)
    await session.waitForChatIdle({ timeout: 30_000 });

    // Stepper shows Spec as current step
    await expect(session.stepperStep("Spec")).toHaveAttribute("aria-current", "step", {
      timeout: 10_000,
    });

    // The "proceed to next step" button should be visible (showing "Work")
    const proceedBtn = session.proceedNextStepButton();
    await expect(proceedBtn).toBeVisible({ timeout: 10_000 });

    // --- Enable plan mode manually (simulates being in a plan-mode workflow step) ---
    await session.togglePlanMode();
    await expect(session.planPanel).toBeVisible({ timeout: 15_000 });
    await expect(session.planModeInput()).toBeVisible({ timeout: 10_000 });

    // --- Click proceed to move to Work step ---
    await proceedBtn.click();

    // Plan mode should be disabled: plan panel hidden and input shows default placeholder
    await expect(session.planPanel).not.toBeVisible({ timeout: 15_000 });
    await expect(session.planModeInput()).not.toBeVisible({ timeout: 10_000 });

    // Stepper shows Work as current step
    await expect(session.stepperStep("Work")).toHaveAttribute("aria-current", "step", {
      timeout: 15_000,
    });

    // Work step auto-start prompt should be visible in chat (user message bubble)
    await expect(
      session.chat.getByText("work step response", { exact: false }).first(),
    ).toBeVisible({ timeout: 30_000 });

    // Session returns to idle in default (non-plan) mode
    await expect(session.idleInput()).toBeVisible({ timeout: 15_000 });
  });

  test("preserves selected model across context reset", async ({
    testPage,
    apiClient,
    seedData,
  }) => {
    const { agents } = await apiClient.listAgents();
    const agent = agents.find((item) => item.name === "mock-agent");
    if (!agent) {
      throw new Error("E2E mock agent is required for model-reset coverage");
    }
    const smartProfile = await apiClient.createAgentProfile(agent.id, "Reset Model Profile", {
      model: "mock-smart",
    });

    const workflow = await apiClient.createWorkflow(seedData.workspaceId, "Reset Model Workflow");
    const startStep = await apiClient.createWorkflowStep(workflow.id, "Start", 0);
    const resetStep = await apiClient.createWorkflowStep(workflow.id, "Reset", 1);

    await apiClient.updateWorkflowStep(startStep.id, {
      prompt: 'e2e:message("start complete")\n{{task_prompt}}',
      events: { on_enter: [{ type: "auto_start_agent" }] },
    });
    await apiClient.updateWorkflowStep(resetStep.id, {
      prompt: 'e2e:message("reset complete")\n{{task_prompt}}',
      events: {
        on_enter: [{ type: "reset_agent_context" }, { type: "auto_start_agent" }],
      },
    });

    const task = await apiClient.createTask(seedData.workspaceId, "Reset Model Task", {
      workflow_id: workflow.id,
      workflow_step_id: startStep.id,
      agent_profile_id: smartProfile.id,
      repository_ids: [seedData.repositoryId],
    });

    await testPage.goto(`/t/${task.id}`);
    const session = new SessionPage(testPage);
    await session.waitForLoad();
    await session.waitForChatIdle({ timeout: 30_000 });

    const modelTrigger = testPage.getByRole("button", { name: "Session model settings" });
    await expect(modelTrigger).toContainText("Mock Smart", { timeout: 15_000 });

    await session.proceedNextStepButton().click();
    await expect(session.stepperStep("Reset")).toHaveAttribute("aria-current", "step", {
      timeout: 15_000,
    });
    await session.waitForChatIdle({ timeout: 30_000 });
    await expect(modelTrigger).toContainText("Mock Smart", { timeout: 15_000 });

    await testPage.reload();
    await session.waitForLoad();
    await session.waitForChatIdle({ timeout: 30_000 });
    await expect(modelTrigger).toContainText("Mock Smart", { timeout: 15_000 });
  });

  test("shows next step auto-start prompt when its message-added notification is missed", async ({
    testPage,
    apiClient,
    seedData,
  }) => {
    test.setTimeout(120_000);

    const wsDrop = await routeMainWebSocketWithPromptDrop(testPage);
    const workflow = await apiClient.createWorkflow(
      seedData.workspaceId,
      "Proceed Message Gap Workflow",
    );

    const specStep = await apiClient.createWorkflowStep(workflow.id, "Spec", 0);
    const workStep = await apiClient.createWorkflowStep(workflow.id, "Work", 1);
    await apiClient.createWorkflowStep(workflow.id, "Done", 2);

    await apiClient.updateWorkflowStep(specStep.id, {
      prompt: 'e2e:message("spec done")\n{{task_prompt}}',
      events: {
        on_enter: [{ type: "auto_start_agent" }],
      },
    });

    const workPrompt = "/slow 30s";
    await apiClient.updateWorkflowStep(workStep.id, {
      prompt: `${workPrompt}\n{{task_prompt}}`,
      events: {
        on_enter: [{ type: "auto_start_agent" }],
      },
    });

    const task = await apiClient.createTask(seedData.workspaceId, "Proceed Message Gap Task", {
      workflow_id: workflow.id,
      workflow_step_id: specStep.id,
      agent_profile_id: seedData.agentProfileId,
      repository_ids: [seedData.repositoryId],
    });

    await testPage.goto(`/t/${task.id}`);
    const session = new SessionPage(testPage);
    await session.waitForLoad();
    await session.waitForChatIdle({ timeout: 30_000 });
    await expect(session.stepperStep("Spec")).toHaveAttribute("aria-current", "step", {
      timeout: 10_000,
    });

    const proceedBtn = session.proceedNextStepButton();
    await expect(proceedBtn).toBeVisible({ timeout: 10_000 });

    wsDrop.dropPrompt(workPrompt);
    await proceedBtn.click();

    await expect(session.stepperStep("Work")).toHaveAttribute("aria-current", "step", {
      timeout: 15_000,
    });
    await expect
      .poll(wsDrop.droppedCount, {
        message: "expected the test proxy to drop the workflow prompt's message-added frame",
        timeout: 10_000,
      })
      .toBeGreaterThan(0);
    await expect(
      session.chat.locator(".chat-message-list:visible").getByText(workPrompt, { exact: false }),
    ).toBeVisible({ timeout: 20_000 });
    expect(
      wsDrop.recoveryResponseCount(),
      "expected message backfill after the dropped workflow prompt notification",
    ).toBeGreaterThan(0);
  });

  /**
   * Regression test: the proceed button must re-enable after each step transition.
   * Previously, isMoving stayed true after clicking proceed because the button
   * reappeared (for the next step) before isMoving was reset.
   *
   * Workflow: Spec -> Work -> Done (all with auto_start_agent)
   */
  test("proceed button re-enables across multiple step transitions", async ({
    testPage,
    apiClient,
    seedData,
  }) => {
    test.setTimeout(120_000);

    const workflow = await apiClient.createWorkflow(
      seedData.workspaceId,
      "Multi Step Proceed Workflow",
    );

    const stepNames = ["Spec", "Work", "Done"];
    const steps: { id: string; name: string }[] = [];
    for (let i = 0; i < stepNames.length; i++) {
      const step = await apiClient.createWorkflowStep(workflow.id, stepNames[i], i);
      steps.push({ id: step.id, name: stepNames[i] });
    }

    // Configure all steps except Done with auto_start_agent and a fast prompt
    for (const step of steps.slice(0, -1)) {
      await apiClient.updateWorkflowStep(step.id, {
        prompt: `e2e:message("${step.name} done")\n{{task_prompt}}`,
        events: {
          on_enter: [{ type: "auto_start_agent" }],
        },
      });
    }

    // Create task in Spec step
    const task = await apiClient.createTask(seedData.workspaceId, "Multi Step Task", {
      workflow_id: workflow.id,
      workflow_step_id: steps[0].id,
      agent_profile_id: seedData.agentProfileId,
      repository_ids: [seedData.repositoryId],
    });

    await testPage.goto(`/t/${task.id}`);
    const session = new SessionPage(testPage);
    await session.waitForLoad();

    // Walk through each step transition: Spec -> Work -> Review -> QA -> Done
    for (let i = 0; i < steps.length - 1; i++) {
      const currentName = steps[i].name;
      const nextName = steps[i + 1].name;

      // Wait for agent to complete in current step
      await expect(session.idleInput()).toBeVisible({ timeout: 30_000 });

      // Stepper shows current step
      await expect(session.stepperStep(currentName)).toHaveAttribute("aria-current", "step", {
        timeout: 10_000,
      });

      // Proceed button is visible AND enabled (not disabled by stale isMoving)
      const proceedBtn = session.proceedNextStepButton();
      await expect(proceedBtn).toBeVisible({ timeout: 10_000 });
      await expect(proceedBtn).toBeEnabled({ timeout: 5_000 });

      // Click proceed
      await proceedBtn.click();

      // Stepper updates to next step
      await expect(session.stepperStep(nextName)).toHaveAttribute("aria-current", "step", {
        timeout: 15_000,
      });
    }

    // On Done step: proceed button should NOT be visible (final step)
    await expect(session.idleInput()).toBeVisible({ timeout: 30_000 });
    await expect(session.proceedNextStepButton()).not.toBeVisible({ timeout: 5_000 });
  });
});