# Browser Test Automation Workflow

This is YOUR workflow graph. You can customize it however you want!

Works with **Claude** or **Cursor** agents (configured in `.zibby.config.mjs`).

## Default Flow

```
preflight → execute_live → generate_script
```

The workflow generates a test title, executes the test live in a **browser** with AI assistance, and generates a Playwright script with stable selectors.

## Customization

### Add Custom Nodes

Create a new file in `nodes/`:

```javascript
// nodes/send-slack.js
export const sendSlackNode = {
  name: 'send_slack',
  agent: { type: 'openai', model: 'gpt-4o-mini' },
  prompt: (state) => `Send Slack notification...`,
  outputSchema: { success: { type: 'boolean', required: true } }
};
```

Then add it to your graph in `graph.js`:

```javascript
import { sendSlackNode } from './nodes/send-slack.js';

buildGraph() {
  const graph = new WorkflowGraph();
  // ... existing nodes
  graph.addNode('send_slack', sendSlackNode);
  graph.addEdge('verify_script', 'send_slack');
  return graph;
}
```

### Multi-Agent Configuration

Each node can use a different LLM:

```javascript
graph.addNode('generate_title', {
  agent: { type: 'claude', model: 'claude-sonnet-4' },
  prompt: (state) => `Generate title...`
});

graph.addNode('verify_script', {
  agent: { type: 'deepseek', model: 'deepseek-coder' }, // Cheap & fast
  prompt: (state) => `Run test...`
});

graph.addNode('update_jira', {
  agent: { type: 'ollama', model: 'llama3' }, // Local for privacy
  prompt: (state) => `Update Jira...`
});
```

### Skip Nodes

Comment out nodes you don't need:

```javascript
// graph.addNode('verify_script', verifyScriptNode);
graph.addEdge('generate_script', 'update_jira'); // Skip verification
```

### Parallel Execution

Run multiple nodes in parallel:

```javascript
graph.addParallelEdges('verify_script', [
  'send_slack',
  'update_jira',
  'log_datadog'
]);
```

## Configuration

Edit `.zibby.config.mjs` to set your default agent and optional per-node model overrides:

```javascript
export default {
  agent: {
    cursor: { model: 'auto' }, // or claude: { model: 'auto' }
    strictMode: false,
  },
  models: {
    default: 'auto',
    execute_live: 'auto',
    generate_script: 'auto',
  },
};
```

## Studio / Scripts tab (code discovery)

Runs write `generate_script/result.json` with a `scriptPath` (often under your repo `tests/`). After the graph finishes, **`BrowserTestResultHandler.ensureStudioCodegenMirror`** copies that file into the session folder under stable names so tools don’t need Studio running at generation time:

| File (under `.zibby/output/sessions/<sessionId>/generate_script/`) | Role |
|---------------------------------------------------------------------|------|
| `generated-test.spec.js` | Playwright (`.js`) |
| `playwright.spec.ts` | Playwright (`.ts` / `.tsx` source) |
| `test.selenium.py` | Selenium |

**Electron Studio** resolves these via `discoverCodegenArtifactsElectron` (after `session/codegen/`).

**Web Studio** (`VITE_STUDIO_API_ORIGIN`, e.g. `:3847`) should implement `GET /api/sessions/:id/codegen/playwright` (and `/selenium`) by reading, in order:

1. `sessions/<id>/codegen/` legacy JIT names (`test.spec.ts`, `generated-test.spec.js`, …)
2. **`sessions/<id>/generate_script/`** canonical names above
3. `scriptPath` from `generate_script/result.json` (resolve relative to session / `cwd` from session meta)

## Documentation

- [Full Graph Framework Design](../../docs/GRAPH_FRAMEWORK_DESIGN.md)
- [Multi-Agent Patterns](../../docs/FRAMEWORK_CONVERSATION_SUMMARY.md)

## Updates

To get latest template updates:

```bash
zibby update-graph --merge
```

This will merge bug fixes while preserving your customizations.
