Telegram Stream Capture - Chrome DevTools Extension

A Chrome DevTools extension that captures, reassembles, and exports split binary file chunks from Telegram Web network requests.

Features

• 🎯 Automatically detects Telegram progressive document downloads
• 📦 Captures binary chunks with proper Content-Range parsing
• 🗂️ Groups chunks by file automatically
• 📊 Shows real-time download progress for each file
• 🔄 Reassembles chunks in the correct order
• 💾 Individual download buttons for each file
• 🗑️ Delete individual files or reset all
• 🧹 Clean UI with file management
• 🧪 Built-in test mode to verify extension is working

Installation

1. Open Chrome and navigate to chrome://extensions/
2. Enable "Developer mode" (toggle in top right)
3. Click "Load unpacked"
4. Select the telehacker folder
5. The extension is now installed!

Usage

Step 1: Open DevTools

1. Open Chrome DevTools (F12 or Right-click → Inspect)
2. Navigate to the "Telegram Stream" tab (should appear as a new tab in DevTools)

Step 2: Verify Extension is Working

• Click the "🧪 Test Extension" button
• You should see a test chunk appear and the status update
• Check the debug info bar showing: Status, Requests count, and Chunks count

Step 3: Capture Real Telegram Files

1. Go to Telegram Web
2. Login to your account
3. Find a file to download (document, video, audio, etc.)
4. Click to download the file
5. Watch the extension capture chunks automatically
6. The "Requests" counter will increment as network activity is detected
7. When chunks are captured, they'll appear in the list

Step 4: Download Files

1. Each captured file appears in the list with:
   • File name and icon
   • Number of chunks captured
   • Download progress bar
   • Current size vs total size
   • Progress percentage
2. Click the "💾 Download" button on any file to download it
3. Use the "🗑️ Delete" button to remove individual files
4. Use "🗑️ Reset All" to clear all captured files

How It Works

Core Logic

The extension follows this binary processing flow:

1. Capture: Listens for network requests matching https://web.telegram.org.*/progressive/document
2. Parse Headers: Extracts Content-Range (format: bytes start-end/total)
3. Decode Binary: Converts Base64 response to Uint8Array (raw binary bytes)
4. Sort: Orders chunks by startByte from Content-Range
5. Reassemble: Creates a single Uint8Array(totalSize) and uses .set() to place each chunk at the correct offset
6. Export: Converts to Blob and triggers browser download

Files

• manifest.json: Manifest V3 configuration with devtools permissions
• devtools.html/js: Creates the "Telegram Stream" panel
• panel.html: UI with chunk list, buttons, and status messages
• panel.js: Core logic for network listening, binary processing, and file reassembly

Technical Details

Binary Processing

The extension properly handles binary data by:

• Decoding Base64 to raw bytes using atob() + Uint8Array
• Never concatenating Base64 strings directly (prevents corruption)
• Using Uint8Array.set() for efficient byte-level merging
• Preserving binary integrity through proper Content-Range ordering

Network Filtering

Regex pattern: https://web\.telegram\.org.*/progressive/document

This captures all progressive document downloads from Telegram Web, including:

• Documents
• Videos
• Large media files

Troubleshooting

Extension Not Showing in DevTools

Problem: Can't see "Telegram Stream" tab in DevTools

• Solution 1: Reload the extension in chrome://extensions/ and restart DevTools
• Solution 2: Close and reopen DevTools (F12)
• Solution 3: Make sure the extension loaded without errors in chrome://extensions/

No Chunks Appearing

Problem: Requests counter increases but no chunks captured

• Solution 1: Check DevTools Console (Console tab) for error messages
• Solution 2: Verify you're on web.telegram.org (not the desktop app)
• Solution 3: DevTools must be open BEFORE starting the download
• Solution 4: Try downloading a larger file (small files may not be chunked)
• Solution 5: Some files might not use the progressive download format

Verifying Extension is Active

1. Check the debug bar at the top shows "Status: Active & Listening"
2. Click "🧪 Test Extension" - a test chunk should appear
3. The "Requests" counter should increment when browsing any page
4. Open DevTools Console and look for messages like:
   • ✅ Telegram Stream Capture panel loaded and ready!
   • [1] Request: https://... (for each network request)

Request Counter Not Increasing

Problem: Extension seems frozen

• Solution 1: The extension only monitors while DevTools is open
• Solution 2: Refresh the DevTools panel (close and reopen the Telegram Stream tab)
• Solution 3: Navigate to any webpage - the counter should increase

Gap Detected Warning

Problem: Warning about missing bytes when combining

• Cause: Some chunks may be missing or out of order
• Solution: You can continue, but the file may be corrupted
• Alternative: Reset and try downloading again with DevTools open from the start

Download Not Starting

Problem: Combine button clicked but no download

• Solution 1: Check browser's download permissions
• Solution 2: Look for blocked pop-ups in address bar
• Solution 3: Check DevTools Console for errors
• Solution 4: Try the "Combine & Download" button again

File is Corrupted After Download

Problem: Combined file won't open or is corrupted

• Cause 1: Missing chunks (see Gap Detected warning)
• Cause 2: Download started before DevTools was open
• Solution: Reset, open DevTools first, then start download again

Debugging Tips

View Extension Logs

1. Open the "Telegram Stream" tab in DevTools
2. Switch to the "Console" tab in DevTools
3. Look for messages prefixed with:
   • ✅ = Success messages
   • 📦 = Chunk information
   • ⚠️ = Warnings
   • ❌ = Errors

What Should You See?

When extension is working correctly:

✅ Telegram Stream Capture panel loaded and ready!
📍 To test: 1) Open Telegram Web, 2) Download a file, 3) Watch this panel
[1] Request: https://web.telegram.org/...
[2] Request: https://static.telegram.org/...
✅ Telegram chunk detected: https://web.telegram.org/.../progressive/document
📦 Chunk info: 0-524287 of 1048576
Content encoding: base64, length: 699051
✅ Captured chunk: 0-524287 (512 KB)

Common Error Messages

• No Content-Range header found - File might not be chunked (single download)
• Invalid Content-Range format - Unexpected header format
• No content received - Empty response body
• Error combining chunks - Issue during reassembly (check console for details)

Advanced: Modifying the URL Pattern

If you need to capture files from different sources, edit panel.js line ~34:

// Current pattern (Telegram only)
const urlPattern = /telegram\.org.*\/(upload|download|progressive)/i;

// To capture all requests (for testing)
const urlPattern = /.*/;

// To capture specific domain
const urlPattern = /example\.com.*\/api\/files/i;

License

MIT License - Feel free to modify and distribute!