Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions .github/copilot-instructions.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,13 +43,13 @@ Once all sub-tasks of a parent are validated:
## End of Sprint — MANDATORY DELIVERABLE
The mission ends **ONLY** when these two conditions are met:
1. The last parent ticket is marked as **"Done"** on Jira.
2. **Report Writing**: You must create a new summary file in `docs/sprints/SPRINTX.md` (replace X with the sprint number).
2. **Report Writing**: You must leave a final sprint summary in the pull request description or final chat update.

The report must follow the project's standardized structure:
The summary must cover:
- **Objective**: Reminder of the sprint's goals.
- **Key Accomplishments**: Detailed list of features or fixes delivered.
- **Technical Choices**: Justification for structural choices.
- **Validation**: Evidence of correct operation (tests, builds, checks).
- **Jira Tickets Completed**: Exhaustive list of closed tickets.

Once the file is created and committed, provide a global summary in the chat with the link to the branch and the new report.
Once the work is committed, provide a global summary in the chat with the branch link and the delivery summary.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ React-Sentinel keeps the CLI binary name `react-sentinel`, but the public npm pa
- [docs/agent-runtime-ux.md](docs/agent-runtime-ux.md) — trigger heuristics, mode choice, and example agent prompts
- [docs/adoption-checklist.md](docs/adoption-checklist.md) — onboarding checklist and validation scenarios
- [docs/local-ports.md](docs/local-ports.md) — legitimate local URLs, ports, and CDP endpoints used in docs and tests
- [docs/public-readiness-audit.md](docs/public-readiness-audit.md) — Sprint 15 audit of public-repo cleanup decisions
- [docs/agent-pack.md](docs/agent-pack.md) — Claude Code agent-pack layout and managed files
- [docs/workflows.md](docs/workflows.md) — deep workflow reference for Attach, Replay, Sandbox, and MCP wiring
- [docs/local-diagnostics-checklist.md](docs/local-diagnostics-checklist.md) — troubleshooting

Expand Down
32 changes: 13 additions & 19 deletions assets/agent-pack/README.md
Original file line number Diff line number Diff line change
@@ -1,28 +1,22 @@
# React-Sentinel Agent Pack

This pack is the local integration bundle that React-Sentinel installs for AI coding agents.
This pack installs **Claude Code-ready project files** for React runtime debugging.

## Primary target
## Installed layout

- **Primary:** Claude Code project-local integration
- **Also included as documentation profiles:** generic MCP, Gemini CLI, Copilot

## Contents

- `commands/` - ready-to-reuse prompt commands for React debugging
- `skills/` - reusable operating rules for when and how to call React-Sentinel
- `docs/` - heuristics and compatibility notes that stay local to the project
- `profiles/` - per-agent integration notes and limits
- `manifest.json` - machine-readable ownership record for update and uninstall
- `.claude/commands/` - ready-to-use slash commands
- `.claude/skills/react-sentinel-debug/SKILL.md` - reusable runtime-debugging skill
- `.claude/agents/` - optional specialized agent instructions
- `.claude/docs/` - supporting heuristics and compatibility notes
- `.claude/.react-sentinel-manifest.json` - ownership record for update and uninstall
- `.mcp.json` - React-Sentinel MCP server entry for Claude Code

## Core commands

1. `debug-react` - start with server/session status, then inspect runtime, console, network, and component state.
2. `reproduce-bug` - build a reproducible Replay or Attach scenario before changing code.
3. `validate-fix` - turn the bug into assertions and use validation or sandbox tools to prove the fix.

## Managed MCP config
1. `debug-react` - inspect runtime state, console, network, and React component data.
2. `reproduce-bug` - reproduce a browser issue in Replay or Attach before editing code.
3. `validate-fix` - convert the bug into checks and validate the fix before finishing.

The pack expects React-Sentinel to manage one MCP server entry in the project config file, usually `.mcp.json` for Claude Code.
## Compatibility

The Markdown assets in this folder are intentionally client-agnostic so they can be copied or adapted outside Claude Code when needed.
Claude Code is the primary target because the installed files follow Claude Code's native command, skill, and agent layout directly. Other MCP clients can still reuse the transport config and the markdown guidance manually.
30 changes: 30 additions & 0 deletions assets/agent-pack/agents/react-sentinel-runtime-debugger.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
---
name: react-sentinel-runtime-debugger
description: Specialized React-Sentinel agent for runtime bug reproduction, browser inspection, and fix validation in Claude Code.
tools: Read, Grep, Glob, Bash
model: sonnet
---

# React-Sentinel Runtime Debugger

You are the runtime-debugging specialist for React-Sentinel tasks.

## Use this agent when

- the user reports a React UI bug that must be reproduced in the browser;
- runtime state, props, hooks, network activity, or console output matter;
- or a proposed fix must be validated with browser assertions before completion.

## Workflow

1. Confirm the app or target URL that should be inspected.
2. Start from runtime evidence, not source-code guesses.
3. Prefer Replay before Attach.
4. Use the installed `/debug-react`, `/reproduce-bug`, and `/validate-fix` commands when they fit.
5. Summarize the reproduction path, the observed signals, and the validation result.

## Avoid this agent when

- the task is purely editorial or static;
- no runnable target exists;
- or the question can be answered from repository files alone.
4 changes: 4 additions & 0 deletions assets/agent-pack/commands/debug-react.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
---
description: Inspect a live React runtime with React-Sentinel before editing source code.
---

# debug-react

Use this command when the task looks like a real browser or React runtime bug instead of a pure source-code question.
Expand Down
27 changes: 16 additions & 11 deletions assets/agent-pack/commands/reproduce-bug.md
Original file line number Diff line number Diff line change
@@ -1,17 +1,22 @@
---
description: Reproduce a React or browser bug with React-Sentinel before proposing a fix.
---

# reproduce-bug

Use this command when the agent needs a stable reproduction before proposing a fix.
Use this command when you need a deterministic reproduction before changing code.

## Checklist
## Recommended flow

1. Capture the target URL, important preconditions, and the exact user-visible failure.
2. Decide between:
- **Replay** for deterministic, isolated reproduction;
- **Attach** only if the issue depends on authenticated or extension-backed browser state.
3. Rebuild the bug with `navigate_replay`, `replay_interactions`, or attach-mode interaction tools.
4. Record the first verdict from console, network, runtime status, and visible UI state.
5. Keep the reproduction steps compact enough to replay after a code change.
1. Start with `get_server_info` and `get_session_status`.
2. Choose **Replay** unless the issue requires an existing logged-in tab or real browser state.
3. Navigate to the failing page and replay the minimal steps that trigger the bug.
4. Capture the useful signals early: console events, network events, render hotspots, hydration issues, or async timeline data.
5. Write down the exact trigger, observed result, and expected result.
6. End with a runtime assertion that can be reused by `validate-fix`.

## Guardrail
## Expected outcome

If the bug can be explained by static code inspection alone, do not force a runtime reproduction.
- a stable reproduction path exists;
- the failure is backed by observable runtime evidence;
- and follow-up validation can reuse the same scenario.
26 changes: 14 additions & 12 deletions assets/agent-pack/commands/validate-fix.md
Original file line number Diff line number Diff line change
@@ -1,19 +1,21 @@
---
description: Validate a proposed React fix with React-Sentinel assertions or replay checks.
---

# validate-fix

Use this command after the bug is reproducible and the agent has a concrete fix hypothesis.
Use this command after the bug is reproduced and you have a concrete fix hypothesis.

## Validation sequence
## Recommended flow

1. Re-run the failing scenario with `validate_after_action` or `validate_scenario`.
2. If the fix is still hypothetical, use `apply_patch_then_replay` or `apply_runtime_patch` in replay mode first.
3. Prefer structured assertions over visual guesswork.
4. Confirm the fix against the same console, network, DOM, and React-state signals that proved the bug.
5. Clean up any sandbox patches after the verdict.
1. Reuse the reproduction scenario instead of inventing a new one.
2. Express success as `validate_after_action` or `validate_scenario` assertions.
3. Prefer Replay for deterministic validation.
4. Use Shadow Sandbox or runtime patch validation before editing source when one runtime hypothesis needs proof.
5. Re-run the assertions after the change and capture pass/fail evidence.

## Expected outcome

The agent should end with one of these states:

- the scenario is now validated;
- the runtime patch proves the hypothesis but source code still needs to change;
- or the attempted fix is disproved and the investigation must continue.
- the fix is validated against the original bug;
- the final answer cites observed runtime evidence;
- and regressions are less likely because the success condition is explicit.
14 changes: 7 additions & 7 deletions assets/agent-pack/docs/compatibility.md
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
# Agent compatibility

| Agent | Support level | What the pack provides | Notes |
| Agent / client | Support level | What the pack provides | Notes |
|---|---|---|---|
| Claude Code | Primary | Project-local `.mcp.json`, commands, skills, heuristics, profile docs | The default install target |
| Generic MCP client | Supported with manual wiring | Standard stdio launch command, arguments, and local docs | Client-specific config path may differ |
| Cursor | Documented adaptation | Cursor profile notes plus the same MCP launch guidance | `.cursor/mcp.json` is a natural project-local target |
| Gemini CLI | Documented adaptation | Prompt/skill guidance and generic MCP notes | Manual setup expected |
| Copilot | Documented adaptation | Prompt/skill guidance and generic MCP notes | VS Code and CLI surfaces may differ |
| Claude Code | Primary | `.claude/commands`, `.claude/skills`, `.claude/agents`, `.claude/docs`, and `.mcp.json` | Immediately usable without rewriting the markdown files |
| Generic MCP client | Supported with manual wiring | Standard stdio launch command plus reusable guidance | Client-specific config path may differ |
| Cursor | Documented adaptation | Reuse the same MCP launch config and markdown guidance manually | `.cursor/mcp.json` remains a natural project-local target |
| Gemini CLI | Documented adaptation | Reuse the same MCP launch config and guidance manually | Command and prompt wiring remain client-specific |
| GitHub Copilot / VS Code | Documented adaptation | Reuse the same MCP launch config and guidance manually | `.vscode/mcp.json` remains the main config target |

The pack keeps the Markdown assets portable so the same guidance can move across clients even when their native command surfaces differ.
The pack keeps Claude Code as the only auto-wired experience. Other clients can still reuse the same transport config and prompt guidance without changing the core React-Sentinel launch command.
17 changes: 0 additions & 17 deletions assets/agent-pack/profiles/claude-code.md

This file was deleted.

17 changes: 0 additions & 17 deletions assets/agent-pack/profiles/copilot-cli.md

This file was deleted.

14 changes: 0 additions & 14 deletions assets/agent-pack/profiles/cursor.md

This file was deleted.

15 changes: 0 additions & 15 deletions assets/agent-pack/profiles/gemini-cli.md

This file was deleted.

19 changes: 0 additions & 19 deletions assets/agent-pack/profiles/generic-mcp.md

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
---
name: react-sentinel-debug
description: Use React-Sentinel when a task needs live browser or React runtime inspection rather than static code reading alone.
---

# React-Sentinel Debug Skill

Use React-Sentinel only when the task benefits from **observing a live browser runtime** instead of only reading repository files.
Expand All @@ -21,9 +26,9 @@ Use React-Sentinel only when the task benefits from **observing a live browser r

1. `get_server_info`
2. `get_session_status`
3. `debug-react`
4. `reproduce-bug`
5. `validate-fix`
3. `/debug-react`
4. `/reproduce-bug`
5. `/validate-fix`

## Mode rules

Expand Down
2 changes: 1 addition & 1 deletion docs/adoption-checklist.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Universal adoption checklist

This checklist captures the onboarding scenarios React-Sentinel must support for Sprint 15.
This checklist captures the onboarding scenarios React-Sentinel should support across its documented environments.

## Validation scenarios

Expand Down
Loading
Loading