Variable Inspector

Example

{
  "id": "debug-inspector",
  "type": "variable-inspector",
  "label": "Developer: Form State",
  "width": "full",
  "modeVisibilitySettings": {
    "edit":    false,
    "view":    false,
    "admin":   false,
    "preview": false,
    "design":  true
  }
}

Settings Reference

What the Inspector Shows

The inspector renders three sections:

{
  "values": {
    // All current field values — the $json source
    "customerName": "Acme Corp",
    "contractValue": 50000,
    "invoiceLines": [
      { "description": "Consulting", "qty": 5, "unitPrice": 150, "total": 750 }
    ]
  },
  "context": {
    // The execution context — the $context source
    "customer": { "id": "cust-123", "tier": "enterprise" },
    "analytics": { "pageViews": [...] }
  },
  "metadata": {
    "formId": 12001,
    "mode": "edit",
    "userId": "user-456",
    "tenantId": "tenant-789",
    "timestamp": "2025-05-25T10:30:00Z"
  }
}

Filtered Inspector — Debugging a Specific Subtree

When you only need to inspect a specific part of the context (e.g., a chart binding), use filterPath to limit output:

{
  "id": "analytics-inspector",
  "type": "variable-inspector",
  "label": "Context: analytics subtree",
  "settings": {
    "showValues": false,
    "showContext": true,
    "filterPath": "context.analytics",
    "height": "300px",
    "collapsed": false
  },
  "modeVisibilitySettings": {
    "edit": false, "view": false, "admin": false, "preview": false, "design": true
  }
}

Live Update Behaviour

The inspector subscribes to the form state and re-renders as JSON every time any field value or context value changes. This makes it extremely useful for:

• Verifying that a computed field is calculating correctly.
• Confirming that an onLoad API action populated the correct context paths.
• Checking that cascading select options are receiving the right dependent values.
• Validating that chart data arrays have the expected structure before debugging chart rendering.
• Watching real-time context updates arrive via SignalR without opening browser DevTools.