feat: support for popups

package.json

@@ -38,20 +38,20 @@
   ],
   "devDependencies": {
     "@types/chrome": "0.0.91",
-    "@types/node": "12.12.17",
-    "@typescript-eslint/eslint-plugin": "^2.11.0",
-    "@typescript-eslint/parser": "^2.11.0",
+    "@types/node": "13.1.1",
+    "@typescript-eslint/eslint-plugin": "^2.13.0",
+    "@typescript-eslint/parser": "^2.13.0",
     "cross-env": "^6.0.3",
-    "electron": "^7.1.5",
-    "eslint": "^6.7.2",
-    "eslint-config-prettier": "^6.7.0",
-    "eslint-plugin-prettier": "^3.1.1",
+    "electron": "^7.1.7",
+    "eslint": "^6.8.0",
+    "eslint-config-prettier": "^6.9.0",
+    "eslint-plugin-prettier": "^3.1.2",
     "ncp": "^2.0.0",
     "prettier": "1.19.1",
     "rimraf": "^3.0.0",
     "ts-loader": "^6.2.1",
-    "typescript": "3.7.3",
-    "webpack": "^4.41.2",
+    "typescript": "3.7.4",
+    "webpack": "^4.41.4",
     "webpack-cli": "^3.3.10",
     "webpack-merge": "^4.2.2"
   },

src/api/index.ts

@@ -42,6 +42,7 @@ export const getAPI = (extension: IpcExtension, sessionId: number) => {
 
     extension: {
       isIncognitoContext: false,
+      getURL: getRuntime(extension, sessionId).getURL,
     },
   };
 

src/api/storage.ts

@@ -44,4 +44,7 @@ export const getStorage = (extensionId: string, sessionId: number) => ({
   local: getStorageArea(extensionId, 'local', sessionId),
   managed: getStorageArea(extensionId, 'managed', sessionId),
   sync: getStorageArea(extensionId, 'sync', sessionId),
+  onChanged: {
+    addListener: () => {},
+  },
 });

src/background-preload/index.ts

@@ -7,7 +7,7 @@ import { IpcExtension } from '../models/ipc-extension';
 declare const window: any;
 declare const global: any;
 
-global.isBackground = true;
+global.isTab = false;
 
 // https://github.com/electron/electron/issues/11290#issuecomment-362301961
 Object.defineProperty(window.navigator, 'userAgent', {
@@ -30,8 +30,8 @@ const extension: IpcExtension = ipcRenderer.sendSync(
 process.once('loaded', () => {
   const api = getAPI(extension, sessionId);
 
-  window.chrome = api;
-  window.browser = api;
+  window.chrome = window.browser = api;
+  window.webext = api;
 
   process.once('loaded', () => {
     delete global.require;

src/content-preload/index.ts

@@ -11,7 +11,7 @@ const arg = process.argv.find(x => x.startsWith('--blacklist='));
 
 let blackList: string[] = [];
 
-global.isBackground = false;
+global.isTab = true;
 
 if (arg) {
   try {

src/content-preload/inject.ts

@@ -23,7 +23,7 @@ export const injectChromeApi = async (
     },
   ]);
 
-  w.chrome = w.browser = context;
+  w.chrome = w.browser = w.webext = context;
 };
 
 const runContentScript = async (

src/main/services/messaging.ts

@@ -1,4 +1,4 @@
-import { webContents, ipcMain, BrowserWindow } from 'electron';
+import { webContents, ipcMain, BrowserWindow, session } from 'electron';
 import { getIpcExtension, sendToBackgroundPages } from '../../utils/extensions';
 import { ExtensibleSession, storages } from '..';
 import {
@@ -175,12 +175,22 @@ export const runMessagingService = (ses: ExtensibleSession) => {
           }
         });
       } else {
-        const contents = getAllWebContentsInSession(ses.session);
+        let contents = getAllWebContentsInSession(ses.session);
         for (const content of contents) {
           if (content.id !== e.sender.id) {
             content.send(`api-port-postMessage-${portId}`, msg, tab);
           }
         }
+
+        contents = getAllWebContentsInSession(
+          session.fromPartition(`persist:electron-extension-${ses.id}`),
+        );
+
+        for (const content of contents) {
+          if (content.id !== e.sender.id && webContentsValid(content)) {
+            content.send(`api-port-postMessage-${portId}`, msg, tab);
+          }
+        }
       }
     },
   );

src/models/port.ts

@@ -39,12 +39,12 @@ export class Port {
   }
 
   public postMessage(msg: any) {
-    const { isBackground } = global as any;
+    const { isTab } = global as any;
 
     ipcRenderer.send(`api-port-postMessage-${this.sessionId}`, {
       portId: this.portId,
       msg,
-      tab: isBackground ? null : getSenderTab(),
+      tab: isTab ? null : getSenderTab(),
     });
   }
 }

src/popup-preload/index.ts

@@ -0,0 +1,65 @@
+import { ipcRenderer, webFrame } from 'electron';
+import { parse } from 'url';
+import { getAPI } from '../api';
+import { IpcExtension } from '../models/ipc-extension';
+
+declare const global: any;
+
+global.isTab = false;
+
+let sessionId = -1;
+
+const arg = process.argv.find(x => x.startsWith('--session-id='));
+
+if (arg) {
+  try {
+    sessionId = parseInt(arg.split('--session-id=')[1]);
+  } catch (e) {
+    console.log(e);
+  }
+}
+
+// https://github.com/electron/electron/issues/11290#issuecomment-362301961
+Object.defineProperty(window.navigator, 'userAgent', {
+  value: window.navigator.userAgent.replace(/Electron\/\S*\s/, ''),
+  configurable: false,
+  writable: false,
+});
+
+ipcRenderer.setMaxListeners(0);
+
+const extensionId = parse(window.location.href).hostname;
+
+const extension: IpcExtension = ipcRenderer.sendSync(
+  `get-extension-${sessionId}`,
+  extensionId,
+);
+
+const updateBounds = () => {
+  ipcRenderer.sendToHost(
+    'webview-size',
+    document.body.clientWidth,
+    document.body.clientHeight,
+  );
+};
+
+window.addEventListener('DOMContentLoaded', () => {
+  setTimeout(() => {
+    updateBounds();
+  });
+
+  document.body.addEventListener('resize', () => {
+    updateBounds();
+  });
+});
+
+window.addEventListener('blur', () => {
+  ipcRenderer.sendToHost('webview-blur');
+});
+
+process.once('loaded', async () => {
+  const api = getAPI(extension, sessionId);
+
+  const w: any = await webFrame.executeJavaScript('window');
+  w.chrome = w.browser = w.webext = api;
+});

webpack.config.js

@@ -83,6 +83,7 @@ const preloadsConfig = getConfig({
   entry: {
     'content-preload': './src/content-preload',
     'background-preload': './src/background-preload',
+    'popup-preload': './src/popup-preload',
   },
 
   plugins: [],