Table to CSV Exporter

Small Chrome/Edge extension that helps you select HTML tables (including Angular Material mat-table) on a web page and export them as CSV files.

Features

• Select a single table on the page and export it as a CSV file.
• Export all tables found on the page in one action.
• Supports regular HTML <table> and Angular Material <mat-table> structures.
• Attempts to sanitize cell text and escape CSV special characters.

Installation (Developer / Unpacked)

1. Clone or download this repository.
2. Open your browser's Extensions page (chrome://extensions or edge://extensions).
3. Enable "Developer mode".
4. Click "Load unpacked" and select the project folder (the folder that contains manifest.json).

Note: This is a Manifest V3 extension and requires a Chromium-based browser that supports MV3.

Usage

1. Click the extension toolbar icon (the popup titled "Table to CSV").
2. Choose one of the actions:
   • "Select Table on Page": activates a selection mode — hover over tables to highlight them, then click a table to export it. Press ESC to cancel selection mode.
   • "Export All Tables": finds all <table> and <mat-table> elements on the page and exports each as a separate CSV file.
3. Exported files are downloaded to your browser's default Downloads folder. Filenames use the page title and table index, for example table_html_1_My_Page_Title.csv.

Permissions

The extension requests the following permissions in manifest.json:

• activeTab — interact with the active tab to start selection or export.
• downloads — save CSV files to your Downloads folder.
• scripting — inject/execute the content script when needed.

Supported Table Types

• Standard HTML tables (<table>, tr, td, th).
• Angular Material tables (<mat-table>, mat-header-row, mat-row, mat-header-cell, mat-cell).

Troubleshooting

• If clicking an action shows an error in the popup, try refreshing the page and retrying.
• If no tables are found, confirm the page actually uses <table> or mat-table elements (some apps render tables using divs).
• If CSV output looks odd, inspect the table contents — complex HTML inside cells (images, nested elements) may not render cleanly as plain text.
• If downloads fail, ensure the browser allows downloads from extensions and the downloads permission is present in manifest.json.

Development notes

• Content script: content.js — handles selection, highlighting, table parsing, and sends download requests to the background service worker.
• Popup UI: popup.html, popup.js — controls user actions and shows status messages.
• Background worker: background.js — performs downloads (see source for message handlers).

Contributing

Feel free to open issues or PRs. Small improvements to CSV escaping, support for other table-like structures, or options for delimiter/filename formatting would be helpful.

---

Repository: https://github.com/richhinkle/table-csv-extension

Screenshots

Below are three screenshots illustrating the extension UI, selection mode on a page, and an example download prompt. Place the corresponding files in the assets/ folder so GitHub displays them here.

Toolbar / Popup

Selection on page (hover highlight)

Download prompt (example)