@trace/sdk

AI-Powered Web Debugging SDK with 79 Debugging Tools

Full-power debugging SDK that provides programmatic access to all 79 debugging tools from the Trace engine. Connect to any web page, collect debugging data, and get AI-powered analysis.

Installation

``bash
npm install @trace/sdk
`

Quick Start

`typescript
import { Trace, createTrace } from '@trace/sdk';

// Create and connect
const trace = await createTrace('https://example.com', {
apiKey: 'your-api-key',
headless: true
});

// Ask the AI to debug
const result = await trace.query('Why is my page slow?');
console.log(result.analysis);

// Or get quick health check
const health = await trace.healthCheck();
console.log(Healthy: ${health.healthy}, Issues: ${health.issues});

// Cleanup
await trace.disconnect();
`

79 Debugging Tools

The SDK provides access to all 79 debugging tools across 8 categories:

$3


- get_console_logs - Get all console messages
- get_console_errors - Get error messages only
- get_error_groups - Get errors grouped by type
- get_exception_details - Get detailed exception info
- clear_console - Clear console store
- get_log_count - Get message counts by level

$3

- get_network_requests - Get all network requests
- get_network_failed - Get failed requests only
- get_network_summary - Get summary statistics
- get_request_details - Get specific request details
- get_cached_requests - Get cached requests
- get_request_timing - Get timing breakdown
- get_request_body - Get request body
- get_response_body - Get response body
- get_redirect_chain - Get redirect history
- replay_request - Re-execute a request

$3

- inspect_element - Inspect DOM element
- get_element_styles - Get computed styles
- get_element_box_model - Get box model info
- query_selector - Query DOM selectors
- get_dom_tree - Get DOM structure
- get_element_attributes - Get element attributes
- get_element_events - Get event listeners
- analyze_visibility - Check visibility
- get_element_accessibility - Get ARIA info
- check_accessibility - Full a11y check
- highlight_element - Highlight in page
- scroll_to_element - Scroll element into view
- get_element_screenshot - Screenshot element
- get_computed_style - Get specific styles
- get_element_hierarchy - Get ancestors/descendants
- measure_element - Get measurements

$3

- get_debug_state - Get debugger state
- set_breakpoint - Set breakpoint
- remove_breakpoint - Remove breakpoint
- get_breakpoints - List all breakpoints
- set_conditional_breakpoint - Set conditional
- set_logpoint - Set logpoint
- pause_execution - Pause script
- resume_execution - Resume execution
- step_over - Step over
- step_into - Step into
- step_out - Step out
- get_call_stack - Get call stack
- get_scope_variables - Get variables in scope
- get_variable_value - Get specific variable
- set_variable_value - Modify variable
- evaluate_expression - Evaluate code
- evaluate_on_frame - Evaluate in frame context
- get_this_object - Get this binding
- add_watch - Add watch expression
- remove_watch - Remove watch
- get_watches - Get all watches
- enable_debugger - Enable debugger
- disable_debugger - Disable debugger
- get_possible_breakpoints - Get valid locations

$3

- get_scripts - Get all loaded scripts
- get_script_source - Get script content
- search_scripts - Search in scripts
- get_script_parsed - Get parsed info
- set_script_source - Live edit source
- blackbox_script - Blackbox script
- unblackbox_script - Unblackbox script
- get_script_coverage - Get coverage data

$3

- get_performance_metrics - Get timing metrics
- start_performance_profile - Start profiling
- stop_performance_profile - Stop and get profile
- get_heap_snapshot - Get memory snapshot

$3

- get_timeline_events - Get timeline events
- start_timeline - Start recording
- stop_timeline - Stop recording
- get_event_listeners_timeline - Get event timeline
- take_timeline_snapshot - Take snapshot

$3

- start_trace - Start trace
- stop_trace - Stop trace
- get_trace_events - Get trace events

API Reference

$3

`typescript
const trace = new Trace({
apiUrl?: string; // API endpoint (default: https://dev-intelli-api.azurewebsites.net)
apiKey?: string; // API key for authentication
headless?: boolean; // Run headless (default: true)
verbose?: boolean; // Enable verbose logging
});
`

$3

`typescript
// Connect to a URL
await trace.connect('https://example.com');

// Navigate to new URL
await trace.navigate('https://example.com/page');

// Reload page
await trace.reload();

// Disconnect
await trace.disconnect();
`

$3

`typescript
// Ask anything
const result = await trace.query('What is causing the memory leak?');

// Quick debug scan
const debug = await trace.debug();

// Analyze performance
const perf = await trace.performance();
`

$3

`typescript
// Run any tool directly
const errors = await trace.tool('get_console_errors', {});
const element = await trace.tool('inspect_element', { selector: '#my-button' });
const metrics = await trace.tool('get_performance_metrics', {});
`

$3

`typescript
// Console
const errors = await trace.getConsoleErrors();
const groups = await trace.getErrorGroups();

// Network
const failed = await trace.getNetworkFailed();
const summary = await trace.getNetworkSummary();

// DOM
const element = await trace.inspectElement('#button');
const visibility = await trace.analyzeVisibility('#modal');
const a11y = await trace.checkAccessibility();

// Debugger
await trace.setBreakpoint('script.js', 42);
const stack = await trace.getCallStack();
const vars = await trace.getScopeVariables();

// Performance
const metrics = await trace.getPerformanceMetrics();

// Page interaction
await trace.click('#button');
await trace.type('#input', 'hello');
const result = await trace.evaluate('document.title');
await trace.screenshot('page.png');
`

$3

`typescript
const health = await trace.healthCheck();
// { healthy: true, issues: 0, critical: 0 }
`

Examples

$3

`typescript
import { createTrace } from '@trace/sdk';

const trace = await createTrace('https://myapp.com');

// Ask AI to investigate
const result = await trace.query('Why are there console errors?');

console.log('Summary:', result.analysis.summary);

for (const issue of result.analysis.issues) {
console.log([${issue.severity}] ${issue.title});
console.log( Fix: ${issue.fix});
}

await trace.disconnect();
`

$3

`typescript
import { createTrace } from '@trace/sdk';

const trace = await createTrace('https://myapp.com');

// Watch for 30 seconds
const interval = setInterval(async () => {
const errors = await trace.getConsoleErrors();
const failed = await trace.getNetworkFailed();

console.log(Errors: ${errors.length}, Failed: ${failed.length});
}, 5000);

setTimeout(async () => {
clearInterval(interval);
await trace.disconnect();
}, 30000);
`

$3

`typescript
import { createTrace } from '@trace/sdk';

const trace = await createTrace('https://myapp.com');

// Set breakpoint
await trace.setBreakpoint('app.js', 100);

// Trigger action
await trace.click('#submit-button');

// When paused, inspect
const stack = await trace.getCallStack();
const vars = await trace.getScopeVariables();

console.log('Call stack:', stack);
console.log('Variables:', vars);

await trace.disconnect();
``

License

MIT