skills.rest
Snapchat
SnapchatOFFICIAL
Explore all skills by this author →
Website𝕏@snapGitHub

valdi-inspect

Inspect live Valdi app render trees and memory usage via DebuggerService.

16.4k|543|Updated Nov 6, 2025
Search Tags:#debugging#heap#screenshot#inspect#valdi#ui-tree
One-click install
npx skills add https://github.com/Snapchat/Valdi --skill valdi-inspect
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: valdi-inspect
Source: https://github.com/Snapchat/Valdi/tree/main/ai-skills/skills/valdi-inspect
Command: npx skills add https://github.com/Snapchat/Valdi --skill valdi-inspect

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Inspect and diagnose what components are on screen in a live Valdi app by traversing the rendered virtual node tree, capturing element screenshots, and evaluating memory usage.

Core Features & Use Cases

  • Inspect the live UI tree and active contexts to understand what is rendering.
  • Capture element screenshots and examine their dimensions and attributes.
  • Diagnose layout issues, verify component changes after hot-reloads, and analyze JS heap usage during runtime.

Quick Start

Launch a running Valdi app and run the valdi inspect commands to begin debugging.

Frequently Asked Questions about valdi-inspect

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I inspect a live app's UI tree to debug rendering issues?▼

To inspect a live app's UI tree, launch your running Valdi app and use the valdi inspect commands. The tool connects via the Valdi DebuggerService to traverse the rendered virtual node tree and output component details as JSON.

Can I capture element screenshots and analyze memory usage during runtime?▼

Yes, you can capture element screenshots and analyze JS heap memory usage during runtime. The inspection connects to the running app via the Valdi DebuggerService to evaluate active contexts and output rendering dimensions.

Does UI debugging work across iOS, Android, and macOS targets?▼

UI debugging works across iOS, Android, and macOS targets. The inspector connects to any running Valdi app on these platforms to diagnose layout issues, verify hot-reloads, and evaluate memory usage.

What format does the inspect output use for component details?▼

The inspect output uses JSON format by default for component details, with an option for pretty formatting. This structure includes on-screen components, render-tree details, and element dimensions extracted from the virtual node tree.

Do I need a running app to diagnose layout issues and verify hot-reloads?▼

Yes, you need a running Valdi app to diagnose layout issues and verify hot-reloads. The tool requires an active application to connect via the Valdi DebuggerService and inspect the live UI tree.

Related Skills

Explore More Software Engineering Skills→
jarrodmedranojarrodmedrano
2

valdi

Guide building and debugging cross-platform Valdi projects with TypeScript and Bazel.

Community
Advanced
nicolaiprodromovnicolaiprodromov
20

diagnose

Diagnose and fix Puree engine bugs across subsystems during Blender addon development.

Community
Advanced
GitnappGitnapp

node-inspect-debugger

Debug Node.js applications using inspector breakpoints and Chrome DevTools Protocol.

Community
Advanced
maurodf0maurodf0

webf-native-ui

Integrate Cupertino native UI components into React, Vue, or vanilla JS apps with TypeScript support.

Community
Advanced