fictjs/fict-devtools-playground
packages/skill/skills/fict-devtools-playground/SKILL.md
Fict DevTools and Playground engineering guide. Use when implementing, debugging, or reviewing Fict devtools panel/extension behavior, signal/computed/effect inspection UX, graph/timeline interactions, or playground preview refresh and isolation from production runtime.
$ install --global
skillsauthnpx skillsauth add fictjs/fict fict-devtools-playgroundInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 4, 2026, 10:30 PM24.0s16 files scanned
SKILL.md
- name:
- fict-devtools-playground
- description:
- Fict DevTools and Playground engineering guide. Use when implementing, debugging, or reviewing Fict devtools panel/extension behavior, signal/computed/effect inspection UX, graph/timeline interactions, or playground preview refresh and isolation from production runtime.
Fict DevTools and Playground Engineering
Guidance for shipping robust devtools and playground features without regressing Fict runtime correctness or production performance.
Rule Categories by Priority
| Priority | Category | Impact | Prefix |
| -------- | -------------------------------- | -------- | ------------ |
| 1 | Bridge and Transport Correctness | CRITICAL | bridge- |
| 2 | Inspector Data Semantics | HIGH | inspector- |
| 3 | Graph and Timeline UX | HIGH | graph- |
| 4 | Playground Preview Runtime | HIGH | preview- |
| 5 | Verification and Shipping Gates | CRITICAL | quality- |
Quick Reference
1. Bridge and Transport Correctness (CRITICAL)
bridge-standalone-handshake- Keep standalone and extension handshake contract alignedbridge-dev-only-gating- Ensure debug bridge is development-only
2. Inspector Data Semantics (HIGH)
inspector-stable-owner-labeling- Prefer semantic names over generated ids when possibleinspector-owner-navigation- Owner links should navigate and expand ancestor chain
3. Graph and Timeline UX (HIGH)
graph-coverage-all-node-types- Render graph for signals, computed, and effectsgraph-owner-click-through- Make graph owner/sidebar references navigablegraph-timeline-click-through- Timeline nodes should support context jump
4. Playground Preview Runtime (HIGH)
preview-refresh-fidelity- Preserve HMR and full refresh behavior for changed sourcepreview-runtime-isolation- Keep playground internals out of runtime production path
5. Verification and Shipping Gates (CRITICAL)
quality-counter-basic-e2e- Validate onexamples/counter-basicfor real interaction pathsquality-standalone-extension-parity- Keep standalone and extension behavior parity
How to Use
Read rules in rules/ for implementation and debugging details.
Use AGENTS.md for a compiled one-file reference.
Full Compiled Document
AGENTS.md
Related Skills
fictjs/fict-best-practices
tools
VerifiedTrustedCommunity
Fict compiler and runtime engineering guide for correctness and reliability. Use when implementing or reviewing Fict compiler transforms, runtime reactivity behavior, SSR/resume flow, devtools/playground integration, or release CI gates in Fict repositories.
61SKILL.mdUpdated Apr 4, 2026
openclaw/taskflow
tools
VerifiedTrustedCommunity
Use when work should span one or more detached tasks but still behave like one job with a single owner context. TaskFlow is the durable flow substrate under authoring layers like Lobster, ACPX, plugins, or plain code. Keep conditional logic in the caller; use TaskFlow for flow identity, child-task linkage, waiting state, revision-checked mutations, and user-facing emergence.
357,764SKILL.mdUpdated Apr 10, 2026
openclaw/extensions/lobster
tools
VerifiedTrustedCommunity
# Lobster Lobster executes multi-step workflows with approval checkpoints. Use it when: - User wants a repeatable automation (triage, monitor, sync) - Actions need human approval before executing (send, post, delete) - Multiple tool calls should run as one deterministic operation ## When to use Lobster | User intent | Use Lobster? | | ------------------------------------------------------ | --------------------------
357,764SKILL.mdUpdated Apr 10, 2026
steipete/extensions/lobster
tools
VerifiedTrustedCommunity
# Lobster Lobster executes multi-step workflows with approval checkpoints. Use it when: - User wants a repeatable automation (triage, monitor, sync) - Actions need human approval before executing (send, post, delete) - Multiple tool calls should run as one deterministic operation ## When to use Lobster | User intent | Use Lobster? | | ------------------------------------------------------ | --------------------------
357,588SKILL.mdUpdated Apr 13, 2026