This PR addresses Issue #15 which requests the ability for a user to download their current extension configuration as a JSON file to their Downloads.
This was a very interesting look into the inner workings of Chrome Extensions, their lifecycle, and their service workers. I was not aware of the careful separation between the browser, extensions, and Chrome's various APIs. Very cool. Main challenge was realizing that the chrome runtime methods are only available to the app when it is being run as an installed extension within Chrome, adding some time to each round of manual testing.
Changes
Created an export method for both the useSettingStore and useGroupStore to easily get details needed in the exported config file.
Due to limitations with creating URLs for Blobs in manifest version 3 for Chrome Extensions the config's JSON is base64 encoded and made into a Data URL for Chrome to download. There are tradeoffs to this approach such as an up to 30% increase in data size after encoding but the config is small and simple enough that this infrequent operation shouldn't be a major issue.
Refactored Settings to separate logic into a useSettings custom hook.
Touched up the styling and tooltips on the Settings view.
An initial approach used a background worker but after wrapping my head around things I realized nothing in my app is actually running within the background, and my previous issues with accessing chrome were due to the app running on live-server during testing and not being installed to Chrome (where the extra features like chrome.downloads are accessible). After installing my app for testing it was able to access window.chrome and any Chrome API methods required from that point onward so I removed the unnecessary background.js I was using.
Summary
This PR addresses Issue #15 which requests the ability for a user to download their current extension configuration as a JSON file to their Downloads.
This was a very interesting look into the inner workings of Chrome Extensions, their lifecycle, and their service workers. I was not aware of the careful separation between the browser, extensions, and Chrome's various APIs. Very cool. Main challenge was realizing that the
chrome
runtime methods are only available to the app when it is being run as an installed extension within Chrome, adding some time to each round of manual testing.Changes
export
method for both theuseSettingStore
anduseGroupStore
to easily get details needed in the exported config file.Settings
to separate logic into auseSettings
custom hook.Settings
view.chrome
were due to the app running on live-server during testing and not being installed to Chrome (where the extra features likechrome.downloads
are accessible). After installing my app for testing it was able to accesswindow.chrome
and any Chrome API methods required from that point onward so I removed the unnecessarybackground.js
I was using.