Skip to content

A chrome extension to πŸ”„ Capture and replay HTTP requests πŸ“ Edit request details before replaying πŸ” Inspect request and response data

Notifications You must be signed in to change notification settings

Richd0tcom/runitback

Repository files navigation

Run It Back - Chrome Extension

A powerful Chrome extension for capturing, inspecting, and replaying network requests.

Features

  • πŸ”„ Capture and replay HTTP requests
  • πŸ“ Edit request details before replaying
  • πŸ” Inspect request and response data
  • πŸ› οΈ DevTools integration for advanced debugging

Installation

Development Setup

  1. Clone the repository:
git clone https://github.com/Richd0tcom/runitback
cd runitback
  1. Install dependencies:
npm install
  1. Start the development server:
npm run dev
  1. Build the extension:
npm run build
  1. Load the extension in Chrome:
    • Open Chrome and navigate to chrome://extensions/
    • Enable "Developer mode" in the top right
    • Click "Load unpacked"
    • Select the dist directory from the project

Production Installation

Coming Soon!

Usage

Capturing Requests

Screenshot 2025-05-21 at 14 44 58
  1. Click the extension icon in your browser toolbar
  2. Navigate to the "Capture" tab
  3. Browse your target website - requests will be automatically captured

Replaying Requests

Screenshot 2025-05-21 at 14 45 14
  1. Select a captured request from the list
  2. Click the "Replay" button to send the request
  3. View the response in the details panel

Editing Requests

  1. Select a request from the list
  2. Click "Edit Request"
  3. Modify headers, body, or other request details
  4. Save changes and replay the modified request

DevTools Integration

  1. Open Chrome DevTools (F12)
  2. Navigate to the "Run It Back" panel
  3. Access advanced debugging features and request history

Project Structure

src/
β”œβ”€β”€ background/     # Background script
β”œβ”€β”€ content/        # Content scripts
β”œβ”€β”€ devtools/       # DevTools panel
β”œβ”€β”€ popup/          # Extension popup
β”œβ”€β”€ components/     # React components
β”œβ”€β”€ services/       # Core services
└── models/         # TypeScript interfaces

Development

Available Scripts

  • npm run dev - Start development server
  • npm run build - Build extension for production

Tech Stack

  • React
  • TypeScript
  • Vite
  • Chrome Extension APIs

Contributing

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add some amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

License

Support

Email: [email protected]

About

A chrome extension to πŸ”„ Capture and replay HTTP requests πŸ“ Edit request details before replaying πŸ” Inspect request and response data

Resources

Stars

Watchers

Forks