Skip to main content

​
Debugging

Enable debug mode to see detailed logs: 
await composite.init({
  apiKey: 'pk_your_api_key',
  transport: 'chrome-extension',
  debug: true  // Enables console logging
});

// Check transport status
console.log('Transport ready:', composite.isInitialized());

// Manually flush events
await composite.flush();

​
Chrome DevTools

  1. Open Chrome DevTools for your extension
  2. Check the Network tab for requests to prod.alb.us.api.composite.com
  3. Use the Console to see debug logs
  4. Check Application > Storage for persisted data

​
Common Issues

If you encounter CSP errors, ensure your manifest includes the correct host permissions:
"host_permissions": [
  "https://prod.alb.us.api.composite.com/*"
]
For inline scripts, you may need to adjust your CSP:
"content_security_policy": {
  "extension_pages": "script-src 'self'; object-src 'self'"
}
The SDK handles message passing automatically, but ensure:
  • Background script is loaded before content scripts
  • Same API key is used across all contexts
  • Transport is set to 'chrome-extension' in all contexts
Session recording requires:
  • Content script injected with <all_urls> or specific matches
  • sessionRecording: true in configuration
  • Sufficient permissions in manifest
Test with a simple page first, then expand to more complex sites.
If you see errors like ChunkLoadError: Loading chunk X failed or chunks loading from the wrong domain (e.g., https://example.com/123.js instead of your extension), this is caused by bundlers using dynamic imports for code splitting.Why this happens: Content scripts run in an isolated world separate from the page’s JavaScript. When bundlers like Webpack use import() for lazy loading, they inject <script> tags that execute in the page’s main world, not your content script’s isolated context.Solution: Import from the /content-script entry point which pre-bundles all extensions:
// Causes ChunkLoadError with code splitting
import composite from '@composite-inc/composite-js';

// All extensions pre-bundled, no dynamic imports
import composite from '@composite-inc/composite-js/content-script';
This increases the bundle size (~230KB vs ~25KB initial) but eliminates dynamic imports entirely.
Check:
  1. API key is correct
  2. Network requests are successful (check DevTools)
  3. Debug mode is enabled to see logs
  4. Session recording is enabled in config

​
What’s Next?

Overview

Back to Chrome Extension overview

Session Recording

Configure recording options