Muted Chrome Extension

A Chrome extension to control audio across browser tabs - mute current tab, all tabs, or auto-mute new tabs.

Features

• Mute/unmute the current tab
• Mute/unmute all tabs
• Auto-mute new tabs
• Visual feedback with icon changes based on tab's mute state

Development Setup

Prerequisites

• Node.js (LTS version recommended)
• pnpm package manager

Installation

# Clone the repository
git clone <repository-url>
cd muted

# Install dependencies
pnpm install

Development Workflow

# Start development build with watch mode
pnpm dev

# Build for production
pnpm build

# Generate icons from SVG sources
pnpm generate:icons

# Lint code
pnpm lint

# Fix linting issues
pnpm lint:fix

# Format code with Prettier
pnpm format

# Run tests
pnpm test

Loading the Extension in Chrome

1. Build the extension: pnpm build
2. Open Chrome and navigate to chrome://extensions/
3. Enable "Developer mode" (toggle in the top-right corner)
4. Click "Load unpacked" and select the dist directory from this project
5. The extension icon should appear in your browser toolbar

Project Structure

muted/
├── dist/             # Compiled output
├── src/              # Source files
│   ├── background.ts # Service worker script
│   ├── icons/        # Extension icons
│   ├── manifest.json # Extension manifest
│   ├── popup/        # Popup UI
│   │   ├── popup.html
│   │   └── popup.ts
│   ├── scripts/      # Utility scripts
│   │   └── generate-icons.ts
│   └── types/        # TypeScript type definitions
└── ... configuration files

Technologies

• TypeScript
• Webpack
• Chrome Extension API
• Canvas API (for icon generation)

License

ISC © Ken Ojuka