feat(FN-1125): add browser verification template coverage

- Map the workflow template icon key "globe" to the Globe icon in WorkflowStepManager
- Expand WorkflowStepManager tests to cover Browser Verification template rendering, icon display, and add-from-template behavior
- Update AGENTS.md workflow template documentation to include the new Browser Verification template and description

packages/dashboard/app/components/WorkflowStepManager.tsx

@@ -27,6 +27,7 @@ import {
   Shield,
   Zap,
   Eye,
+  Globe,
   LayoutGrid,
   BookOpen,
   Terminal,
@@ -95,6 +96,8 @@ function getTemplateIcon(iconName: string | undefined) {
       return Zap;
     case "eye":
       return Eye;
+    case "globe":
+      return Globe;
     default:
       return CheckCircle;
   }

packages/dashboard/app/components/__tests__/WorkflowStepManager.test.tsx

@@ -1,5 +1,5 @@
 import { describe, it, expect, vi, beforeEach } from "vitest";
-import { render, screen, fireEvent, waitFor } from "@testing-library/react";
+import { render, screen, fireEvent, waitFor, within } from "@testing-library/react";
 import { WorkflowStepManager } from "../WorkflowStepManager";
 import type { WorkflowStep } from "@fusion/core";
 
@@ -48,6 +48,32 @@ vi.mock("../../api", () => ({
     prompt: "AI-generated detailed prompt",
     workflowStep: { ...mockSteps[0], prompt: "AI-generated detailed prompt" },
   })),
+  fetchWorkflowStepTemplates: vi.fn(() => Promise.resolve({
+    templates: [
+      {
+        id: "browser-verification",
+        name: "Browser Verification",
+        description: "Verify web application functionality using browser automation",
+        prompt: "Test prompt",
+        category: "Quality",
+        icon: "globe",
+        toolMode: "coding",
+      },
+    ],
+  })),
+  createWorkflowStepFromTemplate: vi.fn(() => Promise.resolve({
+    id: "WS-010",
+    templateId: "browser-verification",
+    name: "Browser Verification",
+    description: "Verify web application functionality using browser automation",
+    mode: "prompt",
+    phase: "pre-merge",
+    prompt: "Test prompt",
+    toolMode: "coding",
+    enabled: true,
+    createdAt: "2026-01-01T00:00:00.000Z",
+    updatedAt: "2026-01-01T00:00:00.000Z",
+  })),
   fetchScripts: vi.fn(() => Promise.resolve({ test: "pnpm test", lint: "pnpm lint" })),
   fetchModels: vi.fn(() => Promise.resolve({
     models: [
@@ -104,6 +130,8 @@ import {
   updateWorkflowStep,
   deleteWorkflowStep,
   refineWorkflowStepPrompt,
+  fetchWorkflowStepTemplates,
+  createWorkflowStepFromTemplate,
   fetchModels,
 } from "../../api";
 import { fetchScripts } from "../../api";
@@ -596,6 +624,62 @@ describe("WorkflowStepManager", () => {
   });
 });
 
+describe("WorkflowStepManager templates tab", () => {
+  it("renders browser verification template", async () => {
+    vi.mocked(fetchWorkflowSteps).mockResolvedValueOnce([]);
+
+    render(<WorkflowStepManager isOpen={true} onClose={onClose} addToast={addToast} />);
+
+    await waitFor(() => {
+      expect(screen.getByTestId("tab-templates")).toBeInTheDocument();
+    });
+
+    fireEvent.click(screen.getByTestId("tab-templates"));
+
+    await waitFor(() => {
+      expect(screen.getByTestId("template-browser-verification")).toBeInTheDocument();
+      expect(screen.getByText("Browser Verification")).toBeInTheDocument();
+    });
+
+    expect(fetchWorkflowStepTemplates).toHaveBeenCalled();
+  });
+
+  it("displays the Globe icon for browser verification template", async () => {
+    vi.mocked(fetchWorkflowSteps).mockResolvedValueOnce([]);
+
+    render(<WorkflowStepManager isOpen={true} onClose={onClose} addToast={addToast} />);
+
+    await waitFor(() => {
+      expect(screen.getByTestId("tab-templates")).toBeInTheDocument();
+    });
+
+    fireEvent.click(screen.getByTestId("tab-templates"));
+
+    const templateCard = await screen.findByTestId("template-browser-verification");
+    expect(templateCard.querySelector(".lucide-globe")).toBeInTheDocument();
+  });
+
+  it("can add browser verification template as a workflow step", async () => {
+    vi.mocked(fetchWorkflowSteps).mockResolvedValue([]);
+
+    render(<WorkflowStepManager isOpen={true} onClose={onClose} addToast={addToast} />);
+
+    await waitFor(() => {
+      expect(screen.getByTestId("tab-templates")).toBeInTheDocument();
+    });
+
+    fireEvent.click(screen.getByTestId("tab-templates"));
+
+    const templateCard = await screen.findByTestId("template-browser-verification");
+    fireEvent.click(within(templateCard).getByTestId("add-template-browser-verification"));
+
+    await waitFor(() => {
+      expect(createWorkflowStepFromTemplate).toHaveBeenCalledWith("browser-verification", undefined);
+      expect(addToast).toHaveBeenCalledWith("Added Browser Verification workflow step", "success");
+    });
+  });
+});
+
 describe("WorkflowStepManager theme class structure", () => {
   it("uses wfm-body class for modal body", async () => {
     vi.mocked(fetchWorkflowSteps).mockResolvedValueOnce([]);