The bare-bones data collection Chrome extension setup. A simple interface for collecting, storing, and downloading html elements from any page.
- Popup action from the app tray.
- Input text box in the popup action to write a CSS selector in.
- Submit button that sends the CSS selector to a content script to gather elements of that type.
- Save button that allows you to download all the elements stored in your local storage.
- Background service worker for transmitting messages, and starting the download using the
chrome.downloads
API. - Content script for collecting the elements, saving them, and setting up the download.
- Manifest that supports the above features.
If you're interested in seeing how this extension was built, you can follow my tutorial on medium.