mcp-csp-investigation
Comprehensive Content Security Policy audit for MCP Apps in sandboxed iframes. Discovers all network origins, traces them to source, and generates CSP configuration for registerAppResource.
npx skills add a5c-ai/babysitter --skill mcp-csp-investigation --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# mcp-csp-investigation Perform exhaustive Content Security Policy audits for MCP Apps running in sandboxed iframes where all network requests fail SILENTLY without proper CSP declarations. ## Overview MCP Apps run in sandboxed iframes with no same-origin server. This means: - **ALL network requests fail silently** without CSP -- no errors, no warnings, just silent failure - Every external origin (CDN, API, font, image, WebSocket) must be declared in CSP - CSP is configured in the `contents[]` return from the `registerAppResource` read callback - Missing even ONE origin causes that resource to silently not load This skill provides a systematic methodology for discovering every network origin an app uses, tracing each to its source, and generating the correct CSP configuration. ## Capabilities ### Build Output Analysis - Build the application and capture all output files (HTML, CSS, JS, assets) - Search every file for network origin references - Identify fetch/XHR targets, script sources, link hrefs, image sources, font URLs, iframe sources, WebSocket endpoints ### Origin Tracing - Trace each discovered origin to its source in the codebase - Classify as: hardcoded constant, environm
- Overview
- Capabilities
- Build Output Analysis
- Origin Tracing
- CSP Domain Categorization
- CSP Configuration Generation
- Usage
- Step 1: Build the Application
- Step 2: Search for ALL Network Origins
- Step 3: Trace Each Origin to Source
- Step 4: Check Third-Party Libraries
- Step 5: Generate CSP Configuration
- Step 6: Verify Conditional Origins
- Common Pitfalls
Build to produce final output files
npm run build
Identify all output files
find dist/ -type f \( -name "*.html" -o -name "*.js" -o -name "*.css" \)
Search for URL patterns in build output
grep -rEoh 'https?://[a-zA-Z0-9._-]+[a-zA-Z0-9._/-]*' dist/ | sort -u
Search for protocol-relative URLs
grep -rEoh '//[a-zA-Z0-9._-]+\.[a-zA-Z]{2,}' dist/ | sort -u
Search for fetch/XHR patterns in source
grep -rn 'fetch\|XMLHttpRequest\|axios\|\.get\(\|\.post\(' src/What does the mcp-csp-investigation skill do?
Comprehensive Content Security Policy audit for MCP Apps in sandboxed iframes. Discovers all network origins, traces them to source, and generates CSP configuration for registerAppResource.
How do I install it?
Run `npx skills add a5c-ai/babysitter --skill mcp-csp-investigation --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From a5c-ai/babysitter, a repository with 1,642 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.