Workflows
Workflows
Small command sequences that answer one runtime question.
Start with a connected, named session. Choose one interaction and a visible success condition, such as loaded results or the expected route.
For every workflow, use agent-browser or agent-device to perform the action and verify the visible
result. Use Genie to inspect runtime evidence. Examples with component IDs, routes, or query keys
require values from your app; the case studies include runnable demo setup.
Commands return JSON by default. Scripts that depend on a successful wait should add
--fail-on-result-error and check the process exit code.
| Goal | Start with |
|---|---|
| Explain a render | react_get_renders, then react_render_causes |
| Inspect mounted state | react_find_components, then react_inspect_component |
| Check Context | react_inspect_context |
| Find an effect loop | react_effect_timeline, then react_effect_audit |
| Test loading or error UI | Query simulation, Suspense, or error actions |
| Check Query work | query_list, query_get, and an exact devtools_wait |
| Check a route | router_get_state and router_list_matches |
| Separate data latency from rendering | timeline_start, timeline_stop, then timeline_read |
| Rank expensive React work | react_profile_start, then react_profile_report |
| Locate a StyleX definition | stylex_inspect, then verify the CSS condition in the browser |
| Check an optimization | Repeated captures and devtools_capture_compare |
| Check memory or frames | browser_get_memory or browser_fps |