Tab Grouping Tool

A cross-browser extension that automatically groups tabs by their domain for better organization and productivity.

Features

✅ Automatic Tab Grouping - Groups tabs from the same domain together automatically
🎨 Color-Coded Domains - Each domain gets a unique color for easy identification
⚡ Instant Organization - Click one button to organize all your tabs
🔄 Real-Time Updates - New tabs are automatically grouped as you open them
📊 Tab Statistics - See how many tabs and domains you have at a glance
🌐 Cross-Browser Support - Works on Chrome, Edge, and Firefox (with limitations)

Browser Support

Browser	Version	Tab Groups API	Status
Google Chrome	88+	✅ Full Support	Fully Functional
Microsoft Edge	88+	✅ Full Support	Fully Functional
Mozilla Firefox	Latest	⚠️ Limited	Basic Functionality

Note: Tab Groups API is fully supported in Chrome and Edge. Firefox has limited support for tab grouping features.

Installation

For Chrome and Edge

Method 1: Chrome Web Store / Edge Add-ons (Coming Soon)

Extension will be published to official stores

Method 2: Load Unpacked (Developer Mode)

1. Download the Extension

   • Clone this repository or download as ZIP
   • Extract files if downloaded as ZIP

2. Open Extension Settings

   • Chrome: Navigate to chrome://extensions/
   • Edge: Navigate to edge://extensions/

3. Enable Developer Mode

   • Toggle the "Developer mode" switch in the top right corner

4. Load the Extension

   • Click "Load unpacked" button
   • Select the TabGroupingTool folder
   • The extension icon should appear in your browser toolbar

For Firefox

1. Download the Extension

   • Clone this repository or download as ZIP
   • Extract files if downloaded as ZIP

2. Temporary Installation

   • Navigate to about:debugging#/runtime/this-firefox
   • Click "Load Temporary Add-on"
   • Select the manifest.json file from the TabGroupingTool folder

Note: Temporary installations in Firefox are removed when the browser restarts. For permanent installation, the extension needs to be signed by Mozilla.

Usage

Basic Usage

1. Click the Extension Icon

   • Look for the Tab Grouping Tool icon in your browser toolbar
   • Click it to open the popup interface

2. Group Your Tabs

   • Click the "Group Tabs Now" button
   • All tabs with the same domain will be automatically grouped together
   • Each domain group gets a unique color

3. View Statistics

   • See total number of tabs
   • See total number of unique domains
   • Statistics update in real-time

Automatic Grouping

Once installed, the extension automatically:

• Groups new tabs as you open them
• Adds tabs to existing domain groups
• Updates groups when URLs change

Manual Regrouping

If you need to reorganize:

1. Click the extension icon
2. Click "Group Tabs Now"
3. All tabs will be regrouped based on current domains

How It Works

The extension uses the browser's Tab Groups API to:

1. Extract the domain from each tab's URL
2. Create groups for domains with multiple tabs
3. Assign colors to each group for easy identification
4. Monitor new tabs and URL changes to maintain organization

Project Structure

TabGroupingTool/
├── manifest.json          # Extension configuration
├── background.js          # Background service worker
├── popup.html            # Popup interface HTML
├── popup.js              # Popup interface logic
├── popup.css             # Popup interface styling
├── icons/                # Extension icons
│   ├── icon16.svg
│   ├── icon32.svg
│   ├── icon48.svg
│   ├── icon128.svg
│   └── convert-icons.html
└── README.md             # This file

Icon Conversion (Optional)

If you need PNG icons instead of SVG:

1. Open icons/convert-icons.html in a browser
2. Click each "Convert & Download" button
3. Save the PNG files in the icons folder
4. Update manifest.json to reference .png files

Permissions Explained

The extension requires the following permissions:

• tabs: To read tab information and URLs
• tabGroups: To create and manage tab groups
• storage: To save user preferences (future feature)
• host_permissions (all_urls): To access tab URLs for domain extraction

Development

Prerequisites

• Node.js (optional, for future build tools)
• Modern web browser (Chrome, Edge, or Firefox)

Local Development

1. Make changes to the source files
2. Reload the extension in your browser:
   • Chrome/Edge: Go to extensions page → Click reload icon
   • Firefox: Go to debugging page → Reload temporary add-on

Testing

• Test with multiple tabs from different domains
• Test with tabs from the same domain
• Test automatic grouping when opening new tabs
• Test URL changes within existing tabs

Troubleshooting

Extension Not Working

• Check browser version: Ensure you're using Chrome 88+, Edge 88+, or latest Firefox
• Reload extension: Go to extensions page and click reload
• Check console: Open developer tools and check for errors

Tabs Not Grouping

• Refresh the page: Some tabs need to be refreshed after installation
• Manual trigger: Click the extension icon and click "Group Tabs Now"
• Check Tab Groups support: Verify your browser supports Tab Groups API

Firefox Limitations

• Tab Groups API is not fully supported in Firefox
• Extension provides basic functionality only
• Consider using Chrome or Edge for full features

Future Enhancements

Potential features for future versions:

• Custom color schemes
• Whitelist/blacklist domains
• Auto-collapse groups
• Keyboard shortcuts
• Group naming customization
• Export/import settings
• Group persistence across sessions

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

This project is licensed under the MIT License.

Support

For issues, questions, or suggestions:

• Open an issue on GitHub
• Check existing documentation
• Review browser compatibility notes

Changelog

Version 1.0.0 (2025-12-25)

• Initial release
• Basic tab grouping functionality
• Automatic grouping for new tabs
• Color-coded domain groups
• Real-time statistics
• Cross-browser support (Chrome, Edge, Firefox)

---

Made with ❤️ for better tab organization