DevTools Export – One-Click Chrome DevTools Snapshots

TL;DR

TL;DR: DevTools Export is a free Chrome extension that captures complete DevTools state—network logs, console messages, storage data, and screenshots—and generates a shareable link in one click. No account, no tracking, redacts sensitive values by default.

Source and Accuracy Notes

⚠️ This section is MANDATORY. All links must be verified from actual source, not guessed.

• Project page: devtoolsexport.com ← MUST visit and verify
• Source repository: github.com/mariusbolik/chrome-devtools-export ← MUST read README
• License: MIT (verified via README.md ## License section)
• HN launch thread: news.ycombinator.com/item?id=48832389
• Source last checked: 2026-08-11

What Is DevTools Export?

Reproducing bugs is one of the most time-consuming parts of developer support. A user reports “checkout is broken” with no steps, no error message, and no context. DevTools Export solves this by letting anyone capture a complete DevTools snapshot and share it as a link in a single click.

The extension adds an Export panel directly inside Chrome DevTools. When you click “Share Bug Report,” it captures:

• Network requests — method, status, resource type, headers, timing, size
• Console logs — errors, warnings, stack traces with page context
• Storage — localStorage, sessionStorage, cookies, IndexedDB contents
• Browser details — user agent, installed extensions, viewport
• Screenshot — optional page screenshot

The generated link is unlisted and expires automatically. Sensitive values (cookies, request bodies, DOM snapshots) are redacted by default.

Setup Workflow

Step 1: Install the Chrome Extension

Visit devtoolsexport.com and click Install free Chrome extension. No account is required.

Alternatively, build from source and load unpacked:

# Clone the repo
git clone https://github.com/mariusbolik/chrome-devtools-export.git
cd chrome-devtools-export

# Build with bun
bun run build

Then open chrome://extensions, enable Developer mode, and click Load unpacked → select the dist folder.

Step 2: Open DevTools and Create a Snapshot

1. Navigate to the page where you want to capture the bug state.
2. Open Chrome DevTools (F12 or Cmd+Opt+I on macOS).
3. Select the Export panel.
4. Click Share Bug Report.

The generated share link appears immediately. Send it to a developer.

Step 3: Developer Reviews the Snapshot

Opening the share link gives a structured view of everything captured: failed network requests, console errors, storage state, and screenshot context.

Failed requests are visible immediately.
Network requests include status, method, resource type, source, timing, and size
so API and asset failures are easier to spot.

Each snapshot is self-contained—no need to reproduce the exact user environment.

Deeper Analysis

What DevTools Export Captures

The extension hooks into Chrome’s internal DevTools panel, capturing data that would normally require manual steps to export:

| Data type | What’s captured | |---|---| | Network | Method, URL, status, headers, response bodies, timing | | Console | Logs, errors, warnings, stack traces | | Storage | localStorage, sessionStorage, cookies, IndexedDB | | Environment | User agent, viewport, installed extensions | | Screenshot | Optional page capture |

Privacy Defaults

DevTools Export is privacy-conscious by design:

• Unlisted, expiring links — snapshots do not appear in search results and auto-expire
• Sensitive-value redaction — cookies, request/response bodies, DOM snapshots, and sensitive query parameters are redacted by default
• No account required — no login, no tracking

This makes it safe to use even with production data or real user sessions.

Build from Source

The extension is built with a src/ → dist/ pipeline:

bun run build

Requires bun as the package manager (as stated in the README).

Practical Evaluation Checklist

• [ ] Extension installs on Chrome without Developer mode (via the Chrome Web Store link)
• [ ] “Share Bug Report” generates a link in one click
• [ ] Network, console, and storage tabs are populated correctly
• [ ] Expiring links work (check that snapshot is not accessible after expiry)
• [ ] Sensitive data redaction is applied to cookies and request bodies
• [ ] Screenshot is included when enabled

Security Notes

• Share URLs are unlisted and auto-expiring — snapshots are not indexed or searchable
• Default redaction covers cookies, request bodies, and sensitive DOM content
• No authentication required to create or view snapshots — treat links as confidential
• Restricted URLs (chrome://, Chrome Web Store) cannot be captured

FAQ

Q: Does this work on mobile browsers? A: No. DevTools Export is a Chrome desktop extension. It captures the desktop Chrome DevTools state only.

Q: How long do share links remain accessible? A: Snapshots expire automatically. The exact expiry duration is not stated on the product page; check the individual share link for its TTL.

Q: Can I self-host the snapshot backend? A: The project is open source, but self-hosting instructions are not documented in the README. The Chrome extension may require configuration changes to point to a custom backend.

Q: Is this available on Firefox or Safari? A: The product page shows only a Chrome extension. Firefox and Safari builds are not currently listed.

Conclusion

DevTools Export fills a specific but common gap: getting reliable bug reproduction data from non-technical users. Instead of asking users to describe what they saw, you get a complete DevTools snapshot in one click. The privacy defaults (expiring unlisted links, redaction) make it safe to use with real user sessions, and no account is required.

The extension is lightweight and purpose-built. If your workflow involves receiving bug reports from end users or non-technical stakeholders, DevTools Export is worth keeping installed.

• Install DevTools Export
• View on GitHub