From b72d391ed1ecc961ed5e35845d99ce0dbe5e18f7 Mon Sep 17 00:00:00 2001 From: Shannon Duncan Date: Sun, 31 Dec 2017 11:20:17 -0600 Subject: [PATCH 1/5] Create extensions.md A basic example of using extensions --- docs/tutorial/extensions.md | 91 +++++++++++++++++++++++++++++++++++++ 1 file changed, 91 insertions(+) create mode 100644 docs/tutorial/extensions.md diff --git a/docs/tutorial/extensions.md b/docs/tutorial/extensions.md new file mode 100644 index 0000000000..7079afffd1 --- /dev/null +++ b/docs/tutorial/extensions.md @@ -0,0 +1,91 @@ +Muon exposes the ability to use extensions within your electron app. While a lot of this is still highly undocumented, below is a quick guideline on how to load and manage extensions within your app. + +The extension utilities are found under `session.defaultSession.extensions` and have the following API calls. + +### `extensions.load(path, manifest, manifestLocation)` + +This will load an extension for use. The path is absolute, and manifest is defaulted to `{}` until it locates your manifest file in your extension folder to load into the manifest object. + +You can replace `{}` with a custom manifest object if you wish to pass it, and your extension doesn't have a manifest file in it's folder. This allows you to dynamically generate your manifest. + +### `extensions.enable(extensionID)` + +This will enable an extension that has already been loaded via the `load()` api. + +### `extensions.disable(extensionID)` + +This will disable an extension that has already been loaded via the `load()` api. + +### `extensionID` + +The `exitensionID` is generated automatically by muon via 2 ways. + +1. If a key is presented, a hash of that key is created. This will result in always having the same `extensionID`. +2. If no key is presented, a hash of the file path to the extension will result in an `extensionID`. The extensionID will not always be the same. So it is recommended to generate and use a key. Guides can be found on that by searching `chrome extension key generation`. + +> Note: If you want to find out the id created by your key, you can manually load your extension folder into chrome under `chrome://extensions` and it will show your extensionID there. You must be in developer mode for that to work. + +--- + +## Using an extension + +Below is a lifecycle that [shadowcodex](https://github.com/shadowcodex) created. + +1. Create a file called `extensions.js` and import it into your `main.js` file. +2. Create a folder called `extensions` and manually copy your extensions into their respective folders in there. +3. Call `extensions.init()` to initialize and load the extensions for your app. + +In the case of the following extension.js file, shadowcodex is using the `chrome.ipcRenderer` to call the functions via a lifecycle in the renderer thread. For example a simple vuejs app is shown: + +### Vuejs renderer lifecycle hook + +```html + + +
+ {{message}} +
+ + + + + +``` + +### `extension.js` + +```javascript +const path = require('path') +const {ipcMain, session} = require('electron') + +module.exports.init = () => { + let hapiRegistered = false; + + ipcMain.on('halo', (event, arg) => { + console.log(event) + if(!hapiRegistered){ + session.defaultSession.extensions.load(path.join(__dirname,`extensions/hapi`), {}, 'unpacked'); + hapiRegistered = true; + } else { + session.defaultSession.extensions.enable('mnojpmjdmbbfmejpflffifhffcmidifd') + } + }) + + ipcMain.on('unload-halo', (event, arg) => { + console.log('unload hapi'); + session.defaultSession.extensions.disable('mnojpmjdmbbfmejpflffifhffcmidifd') + }) +} +``` + From 1ffdc3a2a3bb127735f8d9ea2f72404a0924eaa1 Mon Sep 17 00:00:00 2001 From: Shannon Duncan Date: Sun, 31 Dec 2017 11:21:52 -0600 Subject: [PATCH 2/5] Update extensions.md --- docs/tutorial/extensions.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/tutorial/extensions.md b/docs/tutorial/extensions.md index 7079afffd1..17d23d01b6 100644 --- a/docs/tutorial/extensions.md +++ b/docs/tutorial/extensions.md @@ -37,6 +37,8 @@ Below is a lifecycle that [shadowcodex](https://github.com/shadowcodex) created. In the case of the following extension.js file, shadowcodex is using the `chrome.ipcRenderer` to call the functions via a lifecycle in the renderer thread. For example a simple vuejs app is shown: +> Note: In order to use `chrome.ipcRenderer` your render file must be loaded with `chrome://brave/` and this one in particular is loaded like `mainWindow.loadURL('chrome://brave/' + path.join(__dirname, '../client/index.html'))` + ### Vuejs renderer lifecycle hook ```html From b10d766b58ef9522a8a7989b8d3199595dcaf874 Mon Sep 17 00:00:00 2001 From: Shannon Duncan Date: Sun, 31 Dec 2017 11:25:19 -0600 Subject: [PATCH 3/5] Update extensions.md removed console logs --- docs/tutorial/extensions.md | 2 -- 1 file changed, 2 deletions(-) diff --git a/docs/tutorial/extensions.md b/docs/tutorial/extensions.md index 17d23d01b6..76671f7c73 100644 --- a/docs/tutorial/extensions.md +++ b/docs/tutorial/extensions.md @@ -75,7 +75,6 @@ module.exports.init = () => { let hapiRegistered = false; ipcMain.on('halo', (event, arg) => { - console.log(event) if(!hapiRegistered){ session.defaultSession.extensions.load(path.join(__dirname,`extensions/hapi`), {}, 'unpacked'); hapiRegistered = true; @@ -85,7 +84,6 @@ module.exports.init = () => { }) ipcMain.on('unload-halo', (event, arg) => { - console.log('unload hapi'); session.defaultSession.extensions.disable('mnojpmjdmbbfmejpflffifhffcmidifd') }) } From 35c62a6cd6df53c1f5d90fa60d416662753f34a8 Mon Sep 17 00:00:00 2001 From: Shannon Duncan Date: Sun, 7 Jan 2018 23:00:39 -0600 Subject: [PATCH 4/5] Update extensions.md --- docs/tutorial/extensions.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/tutorial/extensions.md b/docs/tutorial/extensions.md index 76671f7c73..bbdf0cd3d6 100644 --- a/docs/tutorial/extensions.md +++ b/docs/tutorial/extensions.md @@ -2,6 +2,8 @@ Muon exposes the ability to use extensions within your electron app. While a lot The extension utilities are found under `session.defaultSession.extensions` and have the following API calls. +> If you want to access your extension resources after loading and enabling it then you can do so via `chrome-extension://{extensionID}/{resource-path}` + ### `extensions.load(path, manifest, manifestLocation)` This will load an extension for use. The path is absolute, and manifest is defaulted to `{}` until it locates your manifest file in your extension folder to load into the manifest object. From c85ff997d39461856eb0d413f3e90c335fa2dac9 Mon Sep 17 00:00:00 2001 From: Shannon Duncan Date: Fri, 23 Feb 2018 11:48:14 -0600 Subject: [PATCH 5/5] Update extensions.md --- docs/tutorial/extensions.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/tutorial/extensions.md b/docs/tutorial/extensions.md index bbdf0cd3d6..14a5b0e129 100644 --- a/docs/tutorial/extensions.md +++ b/docs/tutorial/extensions.md @@ -39,7 +39,7 @@ Below is a lifecycle that [shadowcodex](https://github.com/shadowcodex) created. In the case of the following extension.js file, shadowcodex is using the `chrome.ipcRenderer` to call the functions via a lifecycle in the renderer thread. For example a simple vuejs app is shown: -> Note: In order to use `chrome.ipcRenderer` your render file must be loaded with `chrome://brave/` and this one in particular is loaded like `mainWindow.loadURL('chrome://brave/' + path.join(__dirname, '../client/index.html'))` +> Note: In order to use `chrome.ipcRenderer` your render file must be loaded with `chrome://brave/` and this one in particular is loaded like `mainWindow.loadURL(path.join('chrome://brave', __dirname, '../client/index.html'))` ### Vuejs renderer lifecycle hook