Twitter Video Downloader

A Chrome extension that adds a one-click download button to videos on Twitter/X.

How It Works

The extension intercepts Twitter's API responses (via fetch and XMLHttpRequest hooks) to extract the highest-quality MP4 URL for each video. A download button is then injected into the action bar of every tweet that contains a video or animated GIF.

• Interceptor (src/interceptor.js) — Runs in the MAIN world at document_start to hook network requests before Twitter's JS loads. Parses API responses and emits video data via custom DOM events.
• Content script (src/content.js) — Runs in the ISOLATED world. Listens for video data events, observes the DOM via MutationObserver, and injects download buttons into tweet action bars.
• Background service worker (src/background.js) — Registers the MAIN world interceptor and handles download requests using the chrome.downloads API.

Features

• Downloads the highest bitrate MP4 available
• Supports videos and animated GIFs
• Download button styled to match Twitter's native action bar (green hover/success state)
• Files named as {username}_{tweetId}.mp4
• Works on both twitter.com and x.com
• Keyboard accessible (Enter / Space)

Installation

1. Clone or download this repository
2. Open chrome://extensions/ in Chrome
3. Enable Developer mode (top-right toggle)
4. Click Load unpacked and select the project folder
5. Navigate to Twitter/X — download buttons will appear on video tweets

Permissions

Permission	Reason
downloads	Save video files to disk
scripting	Register the MAIN world interceptor script
host_permissions (twitter.com, x.com, twimg.com)	Access tweet pages and video CDN URLs

Project Structure

├── manifest.json          # Extension manifest (MV3)
├── icons/                 # Extension icons (16, 48, 128)
└── src/
    ├── background.js      # Service worker — registers interceptor, handles downloads
    ├── interceptor.js     # MAIN world — hooks fetch/XHR, extracts video URLs
    ├── content.js         # ISOLATED world — observes DOM, injects download buttons
    └── content.css        # Download button styles