Live CortexUI Surface

This block renders live CortexUI contract metadata in the docs DOM so AI View can inspect real machine-readable elements instead of only code examples.

AI View can now inspect a live status region, form fields, actions, and table entities on every docs page.
AI-addressable docs entities
ItemState
Search docsReady
Inspect metadataVisible in AI View

Debugging AI Metadata

Common Problems and Fixes

Problem: Action not appearing in getAvailableActions()

Cause: Element is missing data-ai-role="action", or has data-ai-state="disabled".

Fix:

// In browser console:
document.querySelectorAll('[data-ai-role="action"]')
// If your button is missing, it lacks the attribute

Problem: Form fields not appearing in getFormSchema()

Cause: Form is missing data-ai-role="form" or data-ai-id.

Fix:

document.querySelectorAll('[data-ai-role="form"]')
// Verify your form has both role and id

Problem: State not updating

Cause: State is only reflected visually (CSS class) but data-ai-state attribute is not updated.

Fix: Ensure your component syncs data-ai-state with the actual operation state.

Debugging Workflow

// 1. Check screen context
console.log(window.__CORTEX_UI__.getScreenContext());

// 2. List all actions
console.log(window.__CORTEX_UI__.getAvailableActions());

// 3. Check a specific form
console.log(window.__CORTEX_UI__.getFormSchema('my-form-id'));

// 4. Check event log
console.log(window.__CORTEX_UI__.getRecentEvents());
Best Practice

Keep the browser console open with window.__CORTEX_UI__ pinned while developing CortexUI components.