@contractspec/example.agent-console 3.8.4 → 3.8.7

package/.turbo/turbo-build.log

@@ -3,15 +3,15 @@ $ bun run prebuild && bun run build:bundle && bun run build:types
 $ contractspec-bun-build prebuild
 $ contractspec-bun-build transpile
 [contractspec-bun-build] transpile target=bun root=src entries=73 noBundle=false
-Bundled 79 modules in 121ms
+Bundled 79 modules in 167ms
 
   ./agent.capability.js                    442 bytes  (entry point)
   tool/tool.test-spec.js                   1.38 KB    (entry point)
   shared/overlay-types.js                  8 bytes    (entry point)
   run/run.test-spec.js                     1.37 KB    (entry point)
   seeders/index.js                         0.64 KB    (entry point)
-  ./index.js                               233.57 KB  (entry point)
-  ui/index.js                              105.30 KB  (entry point)
+  ./index.js                               233.69 KB  (entry point)
+  ui/index.js                              105.42 KB  (entry point)
   ui/views/index.js                        27.89 KB   (entry point)
   ui/overlays/index.js                     1.46 KB    (entry point)
   ui/renderers/index.js                    21.0 KB    (entry point)
@@ -23,7 +23,7 @@ Bundled 79 modules in 121ms
   ui/views/AgentListView.js                5.35 KB    (entry point)
   ui/modals/index.js                       22.55 KB   (entry point)
   ui/overlays/demo-overlays.js             1.46 KB    (entry point)
-  ui/AgentDashboard.js                     89.18 KB   (entry point)
+  ui/AgentDashboard.js                     89.30 KB   (entry point)
   ui/modals/AgentActionsModal.js           12.32 KB   (entry point)
   ui/modals/CreateAgentModal.js            10.18 KB   (entry point)
   ui/AgentDashboard.visualizations.js      6.67 KB    (entry point)
@@ -80,15 +80,15 @@ Bundled 79 modules in 121ms
   agent/agent.enum.js                      467 bytes  (entry point)
 
 [contractspec-bun-build] transpile target=node root=src entries=73 noBundle=false
-Bundled 79 modules in 127ms
+Bundled 79 modules in 113ms
 
   ./agent.capability.js                    434 bytes  (entry point)
   tool/tool.test-spec.js                   1.38 KB    (entry point)
   shared/overlay-types.js                  0 KB       (entry point)
   run/run.test-spec.js                     1.36 KB    (entry point)
   seeders/index.js                         0.63 KB    (entry point)
-  ./index.js                               233.51 KB  (entry point)
-  ui/index.js                              105.25 KB  (entry point)
+  ./index.js                               233.63 KB  (entry point)
+  ui/index.js                              105.37 KB  (entry point)
   ui/views/index.js                        27.88 KB   (entry point)
   ui/overlays/index.js                     1.45 KB    (entry point)
   ui/renderers/index.js                    21.0 KB    (entry point)
@@ -100,7 +100,7 @@ Bundled 79 modules in 127ms
   ui/views/AgentListView.js                5.34 KB    (entry point)
   ui/modals/index.js                       22.53 KB   (entry point)
   ui/overlays/demo-overlays.js             1.45 KB    (entry point)
-  ui/AgentDashboard.js                     89.14 KB   (entry point)
+  ui/AgentDashboard.js                     89.26 KB   (entry point)
   ui/modals/AgentActionsModal.js           12.29 KB   (entry point)
   ui/modals/CreateAgentModal.js            10.17 KB   (entry point)
   ui/AgentDashboard.visualizations.js      6.66 KB    (entry point)
@@ -157,15 +157,15 @@ Bundled 79 modules in 127ms
   agent/agent.enum.js                      459 bytes  (entry point)
 
 [contractspec-bun-build] transpile target=browser root=src entries=73 noBundle=false
-Bundled 79 modules in 104ms
+Bundled 79 modules in 132ms
 
   ./agent.capability.js                    434 bytes  (entry point)
   tool/tool.test-spec.js                   1.38 KB    (entry point)
   shared/overlay-types.js                  0 KB       (entry point)
   run/run.test-spec.js                     1.36 KB    (entry point)
   seeders/index.js                         0.63 KB    (entry point)
-  ./index.js                               233.51 KB  (entry point)
-  ui/index.js                              105.25 KB  (entry point)
+  ./index.js                               233.63 KB  (entry point)
+  ui/index.js                              105.37 KB  (entry point)
   ui/views/index.js                        27.88 KB   (entry point)
   ui/overlays/index.js                     1.45 KB    (entry point)
   ui/renderers/index.js                    21.0 KB    (entry point)
@@ -177,7 +177,7 @@ Bundled 79 modules in 104ms
   ui/views/AgentListView.js                5.34 KB    (entry point)
   ui/modals/index.js                       22.53 KB   (entry point)
   ui/overlays/demo-overlays.js             1.45 KB    (entry point)
-  ui/AgentDashboard.js                     89.14 KB   (entry point)
+  ui/AgentDashboard.js                     89.26 KB   (entry point)
   ui/modals/AgentActionsModal.js           12.29 KB   (entry point)
   ui/modals/CreateAgentModal.js            10.17 KB   (entry point)
   ui/AgentDashboard.visualizations.js      6.66 KB    (entry point)

package/CHANGELOG.md

@@ -1,5 +1,46 @@
 # @contractspec/example.agent-console
 
+## 3.8.7
+
+### Patch Changes
+
+- cce2b13: Fix the agent console smoke test by awaiting async button handlers, splitting the flow into smaller smoke cases, and wiring dashboard mutation refreshes so the visible agents and runs tabs update after create and execute actions. Also make the harness lab browser smoke tests skip when Chromium cannot launch in this environment and apply explicit timeouts for the browser evaluation paths.
+- cce2b13: Add first-class Workflow DevKit support for `WorkflowSpec`, including new runtime metadata, stricter validation for Workflow-backed workflows, a dedicated Workflow DevKit integration package, CLI artifact generation, and Workflow-aware chat route helpers exposed from `@contractspec/module.ai-chat/core/workflow` so standard chat imports do not pull Workflow-only runtime assets into non-Workflow builds.
+
+  Also harden supporting runtime surfaces by reusing Playwright browser instances in the harness runtime, mapping design-system button `onPress` handlers correctly to DOM clicks, and switching the workspace git adapter to argument-safe subprocess calls while tightening slow test coverage around those flows.
+
+- Updated dependencies [cce2b13]
+  - @contractspec/lib.presentation-runtime-core@3.9.3
+  - @contractspec/lib.example-shared-ui@6.0.15
+  - @contractspec/lib.runtime-sandbox@2.7.12
+  - @contractspec/lib.contracts-spec@5.0.3
+  - @contractspec/lib.design-system@3.8.8
+  - @contractspec/lib.schema@3.7.12
+
+## 3.8.6
+
+### Patch Changes
+
+- chore: stability & release
+- Updated dependencies
+- Updated dependencies [dd6e074]
+  - @contractspec/lib.presentation-runtime-core@3.9.2
+  - @contractspec/lib.example-shared-ui@6.0.14
+  - @contractspec/lib.runtime-sandbox@2.7.11
+  - @contractspec/lib.contracts-spec@5.0.2
+  - @contractspec/lib.design-system@3.8.7
+  - @contractspec/lib.schema@3.7.11
+
+## 3.8.5
+
+### Patch Changes
+
+- Updated dependencies [dd6e074]
+  - @contractspec/lib.contracts-spec@5.0.1
+  - @contractspec/lib.design-system@3.8.6
+  - @contractspec/lib.example-shared-ui@6.0.13
+  - @contractspec/lib.presentation-runtime-core@3.9.1
+
 ## 3.8.4
 
 ### Patch Changes

package/dist/browser/index.js

@@ -5669,12 +5669,14 @@ function AgentDashboard() {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState8(false);
   const [selectedAgent, setSelectedAgent] = useState8(null);
   const [isAgentActionsOpen, setIsAgentActionsOpen] = useState8(false);
+  const [refreshVersion, setRefreshVersion] = useState8(0);
   const { data: runData, metrics, refetch: refetchRuns } = useRunList();
   const { refetch: refetchAgents } = useAgentList();
   const mutations = useAgentMutations({
     onSuccess: () => {
       refetchAgents();
       refetchRuns();
+      setRefreshVersion((current) => current + 1);
     }
   });
   const handleAgentClick = useCallback5((agent) => {
@@ -5772,10 +5774,10 @@ function AgentDashboard() {
         className: "min-h-[400px]",
         role: "tabpanel",
         children: [
-          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, undefined, false, undefined, this),
+          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, refreshVersion, false, undefined, this),
           activeTab === "agents" && /* @__PURE__ */ jsxDEV9(AgentListViewWithActions, {
             onAgentClick: handleAgentClick
-          }, undefined, false, undefined, this),
+          }, refreshVersion, false, undefined, this),
           activeTab === "tools" && /* @__PURE__ */ jsxDEV9(ToolRegistryView, {}, undefined, false, undefined, this),
           activeTab === "metrics" && /* @__PURE__ */ jsxDEV9(MetricsView, {
             metrics

package/dist/browser/ui/AgentDashboard.js

@@ -2035,12 +2035,14 @@ function AgentDashboard() {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState8(false);
   const [selectedAgent, setSelectedAgent] = useState8(null);
   const [isAgentActionsOpen, setIsAgentActionsOpen] = useState8(false);
+  const [refreshVersion, setRefreshVersion] = useState8(0);
   const { data: runData, metrics, refetch: refetchRuns } = useRunList();
   const { refetch: refetchAgents } = useAgentList();
   const mutations = useAgentMutations({
     onSuccess: () => {
       refetchAgents();
       refetchRuns();
+      setRefreshVersion((current) => current + 1);
     }
   });
   const handleAgentClick = useCallback5((agent) => {
@@ -2138,10 +2140,10 @@ function AgentDashboard() {
         className: "min-h-[400px]",
         role: "tabpanel",
         children: [
-          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, undefined, false, undefined, this),
+          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, refreshVersion, false, undefined, this),
           activeTab === "agents" && /* @__PURE__ */ jsxDEV9(AgentListViewWithActions, {
             onAgentClick: handleAgentClick
-          }, undefined, false, undefined, this),
+          }, refreshVersion, false, undefined, this),
           activeTab === "tools" && /* @__PURE__ */ jsxDEV9(ToolRegistryView, {}, undefined, false, undefined, this),
           activeTab === "metrics" && /* @__PURE__ */ jsxDEV9(MetricsView, {
             metrics

package/dist/browser/ui/index.js

@@ -2035,12 +2035,14 @@ function AgentDashboard() {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState8(false);
   const [selectedAgent, setSelectedAgent] = useState8(null);
   const [isAgentActionsOpen, setIsAgentActionsOpen] = useState8(false);
+  const [refreshVersion, setRefreshVersion] = useState8(0);
   const { data: runData, metrics, refetch: refetchRuns } = useRunList();
   const { refetch: refetchAgents } = useAgentList();
   const mutations = useAgentMutations({
     onSuccess: () => {
       refetchAgents();
       refetchRuns();
+      setRefreshVersion((current) => current + 1);
     }
   });
   const handleAgentClick = useCallback5((agent) => {
@@ -2138,10 +2140,10 @@ function AgentDashboard() {
         className: "min-h-[400px]",
         role: "tabpanel",
         children: [
-          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, undefined, false, undefined, this),
+          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, refreshVersion, false, undefined, this),
           activeTab === "agents" && /* @__PURE__ */ jsxDEV9(AgentListViewWithActions, {
             onAgentClick: handleAgentClick
-          }, undefined, false, undefined, this),
+          }, refreshVersion, false, undefined, this),
           activeTab === "tools" && /* @__PURE__ */ jsxDEV9(ToolRegistryView, {}, undefined, false, undefined, this),
           activeTab === "metrics" && /* @__PURE__ */ jsxDEV9(MetricsView, {
             metrics

package/dist/index.js

@@ -5670,12 +5670,14 @@ function AgentDashboard() {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState8(false);
   const [selectedAgent, setSelectedAgent] = useState8(null);
   const [isAgentActionsOpen, setIsAgentActionsOpen] = useState8(false);
+  const [refreshVersion, setRefreshVersion] = useState8(0);
   const { data: runData, metrics, refetch: refetchRuns } = useRunList();
   const { refetch: refetchAgents } = useAgentList();
   const mutations = useAgentMutations({
     onSuccess: () => {
       refetchAgents();
       refetchRuns();
+      setRefreshVersion((current) => current + 1);
     }
   });
   const handleAgentClick = useCallback5((agent) => {
@@ -5773,10 +5775,10 @@ function AgentDashboard() {
         className: "min-h-[400px]",
         role: "tabpanel",
         children: [
-          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, undefined, false, undefined, this),
+          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, refreshVersion, false, undefined, this),
           activeTab === "agents" && /* @__PURE__ */ jsxDEV9(AgentListViewWithActions, {
             onAgentClick: handleAgentClick
-          }, undefined, false, undefined, this),
+          }, refreshVersion, false, undefined, this),
           activeTab === "tools" && /* @__PURE__ */ jsxDEV9(ToolRegistryView, {}, undefined, false, undefined, this),
           activeTab === "metrics" && /* @__PURE__ */ jsxDEV9(MetricsView, {
             metrics

package/dist/node/index.js

@@ -5669,12 +5669,14 @@ function AgentDashboard() {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState8(false);
   const [selectedAgent, setSelectedAgent] = useState8(null);
   const [isAgentActionsOpen, setIsAgentActionsOpen] = useState8(false);
+  const [refreshVersion, setRefreshVersion] = useState8(0);
   const { data: runData, metrics, refetch: refetchRuns } = useRunList();
   const { refetch: refetchAgents } = useAgentList();
   const mutations = useAgentMutations({
     onSuccess: () => {
       refetchAgents();
       refetchRuns();
+      setRefreshVersion((current) => current + 1);
     }
   });
   const handleAgentClick = useCallback5((agent) => {
@@ -5772,10 +5774,10 @@ function AgentDashboard() {
         className: "min-h-[400px]",
         role: "tabpanel",
         children: [
-          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, undefined, false, undefined, this),
+          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, refreshVersion, false, undefined, this),
           activeTab === "agents" && /* @__PURE__ */ jsxDEV9(AgentListViewWithActions, {
             onAgentClick: handleAgentClick
-          }, undefined, false, undefined, this),
+          }, refreshVersion, false, undefined, this),
           activeTab === "tools" && /* @__PURE__ */ jsxDEV9(ToolRegistryView, {}, undefined, false, undefined, this),
           activeTab === "metrics" && /* @__PURE__ */ jsxDEV9(MetricsView, {
             metrics

package/dist/node/ui/AgentDashboard.js

@@ -2035,12 +2035,14 @@ function AgentDashboard() {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState8(false);
   const [selectedAgent, setSelectedAgent] = useState8(null);
   const [isAgentActionsOpen, setIsAgentActionsOpen] = useState8(false);
+  const [refreshVersion, setRefreshVersion] = useState8(0);
   const { data: runData, metrics, refetch: refetchRuns } = useRunList();
   const { refetch: refetchAgents } = useAgentList();
   const mutations = useAgentMutations({
     onSuccess: () => {
       refetchAgents();
       refetchRuns();
+      setRefreshVersion((current) => current + 1);
     }
   });
   const handleAgentClick = useCallback5((agent) => {
@@ -2138,10 +2140,10 @@ function AgentDashboard() {
         className: "min-h-[400px]",
         role: "tabpanel",
         children: [
-          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, undefined, false, undefined, this),
+          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, refreshVersion, false, undefined, this),
           activeTab === "agents" && /* @__PURE__ */ jsxDEV9(AgentListViewWithActions, {
             onAgentClick: handleAgentClick
-          }, undefined, false, undefined, this),
+          }, refreshVersion, false, undefined, this),
           activeTab === "tools" && /* @__PURE__ */ jsxDEV9(ToolRegistryView, {}, undefined, false, undefined, this),
           activeTab === "metrics" && /* @__PURE__ */ jsxDEV9(MetricsView, {
             metrics

package/dist/node/ui/index.js

@@ -2035,12 +2035,14 @@ function AgentDashboard() {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState8(false);
   const [selectedAgent, setSelectedAgent] = useState8(null);
   const [isAgentActionsOpen, setIsAgentActionsOpen] = useState8(false);
+  const [refreshVersion, setRefreshVersion] = useState8(0);
   const { data: runData, metrics, refetch: refetchRuns } = useRunList();
   const { refetch: refetchAgents } = useAgentList();
   const mutations = useAgentMutations({
     onSuccess: () => {
       refetchAgents();
       refetchRuns();
+      setRefreshVersion((current) => current + 1);
     }
   });
   const handleAgentClick = useCallback5((agent) => {
@@ -2138,10 +2140,10 @@ function AgentDashboard() {
         className: "min-h-[400px]",
         role: "tabpanel",
         children: [
-          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, undefined, false, undefined, this),
+          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, refreshVersion, false, undefined, this),
           activeTab === "agents" && /* @__PURE__ */ jsxDEV9(AgentListViewWithActions, {
             onAgentClick: handleAgentClick
-          }, undefined, false, undefined, this),
+          }, refreshVersion, false, undefined, this),
           activeTab === "tools" && /* @__PURE__ */ jsxDEV9(ToolRegistryView, {}, undefined, false, undefined, this),
           activeTab === "metrics" && /* @__PURE__ */ jsxDEV9(MetricsView, {
             metrics

package/dist/ui/AgentDashboard.js

@@ -2036,12 +2036,14 @@ function AgentDashboard() {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState8(false);
   const [selectedAgent, setSelectedAgent] = useState8(null);
   const [isAgentActionsOpen, setIsAgentActionsOpen] = useState8(false);
+  const [refreshVersion, setRefreshVersion] = useState8(0);
   const { data: runData, metrics, refetch: refetchRuns } = useRunList();
   const { refetch: refetchAgents } = useAgentList();
   const mutations = useAgentMutations({
     onSuccess: () => {
       refetchAgents();
       refetchRuns();
+      setRefreshVersion((current) => current + 1);
     }
   });
   const handleAgentClick = useCallback5((agent) => {
@@ -2139,10 +2141,10 @@ function AgentDashboard() {
         className: "min-h-[400px]",
         role: "tabpanel",
         children: [
-          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, undefined, false, undefined, this),
+          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, refreshVersion, false, undefined, this),
           activeTab === "agents" && /* @__PURE__ */ jsxDEV9(AgentListViewWithActions, {
             onAgentClick: handleAgentClick
-          }, undefined, false, undefined, this),
+          }, refreshVersion, false, undefined, this),
           activeTab === "tools" && /* @__PURE__ */ jsxDEV9(ToolRegistryView, {}, undefined, false, undefined, this),
           activeTab === "metrics" && /* @__PURE__ */ jsxDEV9(MetricsView, {
             metrics

package/dist/ui/index.js

@@ -2036,12 +2036,14 @@ function AgentDashboard() {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState8(false);
   const [selectedAgent, setSelectedAgent] = useState8(null);
   const [isAgentActionsOpen, setIsAgentActionsOpen] = useState8(false);
+  const [refreshVersion, setRefreshVersion] = useState8(0);
   const { data: runData, metrics, refetch: refetchRuns } = useRunList();
   const { refetch: refetchAgents } = useAgentList();
   const mutations = useAgentMutations({
     onSuccess: () => {
       refetchAgents();
       refetchRuns();
+      setRefreshVersion((current) => current + 1);
     }
   });
   const handleAgentClick = useCallback5((agent) => {
@@ -2139,10 +2141,10 @@ function AgentDashboard() {
         className: "min-h-[400px]",
         role: "tabpanel",
         children: [
-          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, undefined, false, undefined, this),
+          activeTab === "runs" && /* @__PURE__ */ jsxDEV9(RunListView, {}, refreshVersion, false, undefined, this),
           activeTab === "agents" && /* @__PURE__ */ jsxDEV9(AgentListViewWithActions, {
             onAgentClick: handleAgentClick
-          }, undefined, false, undefined, this),
+          }, refreshVersion, false, undefined, this),
           activeTab === "tools" && /* @__PURE__ */ jsxDEV9(ToolRegistryView, {}, undefined, false, undefined, this),
           activeTab === "metrics" && /* @__PURE__ */ jsxDEV9(MetricsView, {
             metrics

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contractspec/example.agent-console",
-  "version": "3.8.4",
+  "version": "3.8.7",
   "description": "Agent Console example - AI agent orchestration with tools, runs, and logs",
   "type": "module",
   "types": "./dist/index.d.ts",
@@ -535,22 +535,22 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@contractspec/lib.schema": "3.7.10",
-    "@contractspec/lib.contracts-spec": "5.0.0",
-    "@contractspec/lib.example-shared-ui": "6.0.12",
-    "@contractspec/lib.design-system": "3.8.5",
-    "@contractspec/lib.runtime-sandbox": "2.7.10",
+    "@contractspec/lib.schema": "3.7.12",
+    "@contractspec/lib.contracts-spec": "5.0.3",
+    "@contractspec/lib.example-shared-ui": "6.0.15",
+    "@contractspec/lib.design-system": "3.8.8",
+    "@contractspec/lib.runtime-sandbox": "2.7.12",
     "react": "19.2.0",
     "react-dom": "19.2.0",
-    "@contractspec/lib.presentation-runtime-core": "3.9.0"
+    "@contractspec/lib.presentation-runtime-core": "3.9.3"
   },
   "devDependencies": {
-    "@contractspec/lib.harness": "0.2.5",
-    "@contractspec/tool.bun": "3.7.9",
-    "@contractspec/tool.typescript": "3.7.9",
+    "@contractspec/lib.harness": "0.2.8",
+    "@contractspec/tool.bun": "3.7.11",
+    "@contractspec/tool.typescript": "3.7.11",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.2",
-    "happy-dom": "^20.8.4",
+    "happy-dom": "^20.8.8",
     "typescript": "^5.9.3"
   },
   "publishConfig": {

package/src/ui/AgentDashboard.sandbox.test.tsx

@@ -15,6 +15,8 @@ import {
 import { AgentDashboard } from './AgentDashboard';
 
 const PROJECT_ID = 'agent-console-sandbox-smoke';
+const DASHBOARD_TEST_TIMEOUT_MS = 10_000;
+const MUTATION_TEST_TIMEOUT_MS = 15_000;
 const TEMPLATE: TemplateDefinition = {
 	id: 'agent-console',
 	name: 'Agent Console',
@@ -121,6 +123,13 @@ async function waitFor(assertion: () => boolean, timeoutMs = 3000) {
 	throw new Error('Timed out waiting for dashboard state.');
 }
 
+async function waitForTextToDisappear(text: string, timeoutMs = 3000) {
+	await waitFor(
+		() => document.body.textContent?.includes(text) !== true,
+		timeoutMs
+	);
+}
+
 function findButton(container: HTMLElement, label: string) {
 	return [...container.getElementsByTagName('button')].find((element) =>
 		element.textContent?.includes(label)
@@ -162,11 +171,13 @@ async function click(element: Element | null | undefined) {
 	);
 	await act(async () => {
 		if (typeof onPress === 'function') {
-			onPress();
+			await Promise.resolve(onPress());
 			return;
 		}
 		if (typeof onClick === 'function') {
-			onClick(new MouseEvent('click', { bubbles: true }));
+			await Promise.resolve(
+				onClick(new MouseEvent('click', { bubbles: true }))
+			);
 			return;
 		}
 		if ('click' in element && typeof element.click === 'function') {
@@ -211,102 +222,131 @@ async function fill(selector: string, value: string) {
 }
 
 describe('AgentDashboard sandbox smoke', () => {
-	it('loads seeded state, renders tabs, creates an agent, and executes a run', async () => {
-		const { container, root } = await renderDashboard();
-		await waitFor(
-			() => container.textContent?.includes('AI Agent Console') === true
-		);
-		await waitFor(
-			() =>
-				container.textContent?.includes(
-					'Affichage de 1 à 3 sur 5 résultats'
-				) === true
-		);
+	it(
+		'loads seeded state and renders the dashboard tabs',
+		async () => {
+			const { container, root } = await renderDashboard();
 
-		expect(container.textContent).toContain('Runs');
-		expect(container.textContent).toContain('Agents');
-		expect(container.textContent).toContain('Tools');
-		expect(container.textContent).toContain('Metrics');
-		expect(container.textContent).toContain('Run History');
+			await waitFor(
+				() => container.textContent?.includes('AI Agent Console') === true
+			);
+			await waitFor(
+				() =>
+					container.textContent?.includes(
+						'Affichage de 1 à 3 sur 5 résultats'
+					) === true
+			);
 
-		await click(findButton(container, 'Tools'));
-		await waitFor(
-			() => container.textContent?.includes('Total Tools') === true
-		);
-		await click(findButton(container, 'Metrics'));
-		await waitFor(
-			() => container.textContent?.includes('Usage Analytics') === true
-		);
-		await click(findButton(container, 'Agents'));
-		await waitFor(() => container.textContent?.includes('Total: 4') === true);
+			expect(container.textContent).toContain('Runs');
+			expect(container.textContent).toContain('Agents');
+			expect(container.textContent).toContain('Tools');
+			expect(container.textContent).toContain('Metrics');
+			expect(container.textContent).toContain('Run History');
 
-		await click(findButton(container, 'New Agent'));
-		await waitFor(
-			() => document.body.textContent?.includes('Create New Agent') === true
-		);
-		await fill('#agent-name', 'Paris Meetup UI Agent');
-		await fill(
-			'#agent-description',
-			'Smoke test agent for the sandbox walkthrough.'
-		);
-		await click(findButton(document.body, 'Create Agent'));
-		await click(findButton(container, 'Runs'));
-		await waitFor(
-			() =>
-				container.textContent?.includes(
-					'Affichage de 1 à 3 sur 5 résultats'
-				) === true
-		);
-		await click(findButton(container, 'Agents'));
-		await waitFor(
-			() => container.textContent?.includes('Paris Meetup UI Agent') === true
-		);
-		await waitFor(() => container.textContent?.includes('Total: 5') === true);
+			await click(findButton(container, 'Tools'));
+			await waitFor(
+				() => container.textContent?.includes('Total Tools') === true
+			);
+			await click(findButton(container, 'Metrics'));
+			await waitFor(
+				() => container.textContent?.includes('Usage Analytics') === true
+			);
+			await click(findButton(container, 'Runs'));
+			await waitFor(
+				() => container.textContent?.includes('Run History') === true
+			);
 
-		const agentCard = findAgentCard(container, 'Paris Meetup UI Agent');
-		await click(agentCard);
-		await waitFor(
-			() => document.body.textContent?.includes('Activate Agent') === true
-		);
-		await click(findButton(document.body, 'Activate Agent'));
-		await click(findButton(container, 'Runs'));
-		await waitFor(
-			() => container.textContent?.includes('Run History') === true
-		);
-		await click(findButton(container, 'Agents'));
-		await waitFor(
-			() =>
-				findAgentCard(
-					container,
-					'Paris Meetup UI Agent'
-				)?.textContent?.includes('ACTIVE') === true
-		);
+			await act(async () => {
+				root.unmount();
+			});
+		},
+		DASHBOARD_TEST_TIMEOUT_MS
+	);
 
-		const activeAgentCard = findAgentCard(container, 'Paris Meetup UI Agent');
-		await click(activeAgentCard);
-		await waitFor(
-			() => document.body.textContent?.includes('Execute Agent') === true
-		);
-		await click(findButton(document.body, 'Execute Agent'));
-		await waitFor(
-			() => document.body.textContent?.includes('Message *') === true
-		);
-		await fill('#execute-message', 'Summarize the meetup smoke test.');
-		await click(findButton(document.body, 'Execute'));
+	it(
+		'creates an agent, activates it, and executes a run',
+		async () => {
+			const { container, root } = await renderDashboard();
 
-		await click(findButton(container, 'Runs'));
-		await waitFor(
-			() =>
-				container.textContent?.includes(
-					'Affichage de 1 à 3 sur 6 résultats'
-				) === true
-		);
-		await waitFor(
-			() => container.textContent?.includes('Paris Meetup UI Agent') === true
-		);
+			await waitFor(
+				() => container.textContent?.includes('AI Agent Console') === true
+			);
+			await waitFor(
+				() =>
+					container.textContent?.includes(
+						'Affichage de 1 à 3 sur 5 résultats'
+					) === true
+			);
 
-		await act(async () => {
-			root.unmount();
-		});
-	});
+			await click(findButton(container, 'Agents'));
+			await waitFor(() => container.textContent?.includes('Total: 4') === true);
+
+			await click(findButton(container, 'New Agent'));
+			await waitFor(
+				() => document.body.textContent?.includes('Create New Agent') === true
+			);
+			await fill('#agent-name', 'Paris Meetup UI Agent');
+			await fill(
+				'#agent-description',
+				'Smoke test agent for the sandbox walkthrough.'
+			);
+			await click(findButton(document.body, 'Create Agent'));
+			await waitForTextToDisappear('Create New Agent');
+			await waitFor(
+				() => container.textContent?.includes('Paris Meetup UI Agent') === true,
+				7000
+			);
+			await waitFor(
+				() => container.textContent?.includes('Total: 5') === true,
+				7000
+			);
+
+			const agentCard = findAgentCard(container, 'Paris Meetup UI Agent');
+			await click(agentCard);
+			await waitFor(
+				() => document.body.textContent?.includes('Activate Agent') === true
+			);
+			await click(findButton(document.body, 'Activate Agent'));
+			await waitForTextToDisappear('Activate Agent');
+			await waitFor(
+				() =>
+					findAgentCard(
+						container,
+						'Paris Meetup UI Agent'
+					)?.textContent?.includes('ACTIVE') === true,
+				7000
+			);
+
+			const activeAgentCard = findAgentCard(container, 'Paris Meetup UI Agent');
+			await click(activeAgentCard);
+			await waitFor(
+				() => document.body.textContent?.includes('Execute Agent') === true
+			);
+			await click(findButton(document.body, 'Execute Agent'));
+			await waitFor(
+				() => document.body.textContent?.includes('Message *') === true
+			);
+			await fill('#execute-message', 'Summarize the meetup smoke test.');
+			await click(findButton(document.body, 'Execute'));
+			await waitForTextToDisappear('Message *');
+
+			await click(findButton(container, 'Runs'));
+			await waitFor(
+				() =>
+					container.textContent?.includes(
+						'Affichage de 1 à 3 sur 6 résultats'
+					) === true,
+				7000
+			);
+			await waitFor(
+				() => container.textContent?.includes('Paris Meetup UI Agent') === true,
+				7000
+			);
+
+			await act(async () => {
+				root.unmount();
+			});
+		},
+		MUTATION_TEST_TIMEOUT_MS
+	);
 });

package/src/ui/AgentDashboard.tsx

@@ -34,6 +34,7 @@ export function AgentDashboard() {
 	const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
 	const [selectedAgent, setSelectedAgent] = useState<Agent | null>(null);
 	const [isAgentActionsOpen, setIsAgentActionsOpen] = useState(false);
+	const [refreshVersion, setRefreshVersion] = useState(0);
 
 	const { data: runData, metrics, refetch: refetchRuns } = useRunList();
 	const { refetch: refetchAgents } = useAgentList();
@@ -42,6 +43,7 @@ export function AgentDashboard() {
 		onSuccess: () => {
 			refetchAgents();
 			refetchRuns();
+			setRefreshVersion((current) => current + 1);
 		},
 	});
 
@@ -141,9 +143,12 @@ export function AgentDashboard() {
 
 			{/* Tab Content */}
 			<div className="min-h-[400px]" role="tabpanel">
-				{activeTab === 'runs' && <RunListView />}
+				{activeTab === 'runs' && <RunListView key={refreshVersion} />}
 				{activeTab === 'agents' && (
-					<AgentListViewWithActions onAgentClick={handleAgentClick} />
+					<AgentListViewWithActions
+						key={refreshVersion}
+						onAgentClick={handleAgentClick}
+					/>
 				)}
 				{activeTab === 'tools' && <ToolRegistryView />}
 				{activeTab === 'metrics' && <MetricsView metrics={metrics} />}