added cwex package for manifest version 3 extensions

.gitignore

@@ -16,6 +16,7 @@ out/
 *.nex
 extension-builds/
 coverage
+.coverage/
 
 dist
 build

bin/ext-update-index.js → bin/ext-update-index.mjs

@@ -1,9 +1,12 @@
-const path = require('path');
-const fs = require('fs');
-module.exports = ({ extensionFilesDir }) => {
+import path from 'path';
+import fs from 'fs';
+export default ({ extensionFilesDir }) => {
   const indexFilePath = path.resolve(extensionFilesDir, 'index.html');
   const indexFileStr = fs.readFileSync(indexFilePath, 'utf8');
-  const output = indexFileStr.replace('</body>', `<script src='js/init.js'></script></body>`);
+  const output = indexFileStr.replace(
+    '</body>',
+    `<script src='js/init.js'></script></body>`
+  );
 
   fs.writeFileSync(indexFilePath, output, 'utf8');
   console.log('Updated index.html');

chrome-ext-files/js/background.js

@@ -1,5 +1,5 @@
 /* global chrome */
-(function() {
+(function () {
   const MAX_EXT_LOAD_COUNT = 30;
   let curTab = {
     id: null,
@@ -18,7 +18,7 @@
 
   // Create a new tab for the extension
   function createNewTab() {
-    chrome.tabs.create({ url: 'index.html' }, function(tab) {
+    chrome.tabs.create({ url: 'index.html' }, function (tab) {
       curTab = {
         id: tab.id,
         url: tab.url,
@@ -32,24 +32,22 @@
   // Focus on the open extension tab
   function focusTab(tabId) {
     const updateProperties = { active: true };
-    chrome.tabs.update(tabId, updateProperties, function(tab) {});
+    chrome.tabs.update(tabId, updateProperties, function (tab) {});
   }
 
   function openChangeLog() {
     chrome.storage.sync.get(
       {
         showChangeLog: true,
       },
-      function(items) {
+      function (items) {
         if (items.showChangeLog) {
           chrome.tabs.create(
             {
               url: 'https://altairgraphql.dev/updated',
             },
-            function(tab) {
-              console.log(
-                'New tab launched with https://altairgraphql.dev/updated'
-              );
+            function (tab) {
+              console.log('New tab launched with https://altairgraphql.dev/updated');
             }
           );
         }
@@ -65,12 +63,12 @@
           userDonated: false,
           extLoadCount: 0,
         },
-        function(items) {
+        function (items) {
           if (!items.userDonated) {
             console.log('extension loaded count: ', items.extLoadCount);
             if (items.extLoadCount > MAX_EXT_LOAD_COUNT) {
               // show donation page
-              chrome.tabs.create({ url: 'donate.html' }, function(tab) {
+              chrome.tabs.create({ url: 'donate.html' }, function (tab) {
                 console.log('New tab launched with donation.');
               });
               chrome.storage.sync.set({
@@ -88,11 +86,11 @@
   }
 
   // Open the extension tab when the extension icon is clicked
-  chrome.browserAction.onClicked.addListener(function(tab) {
+  chrome.action.onClicked.addListener(function (tab) {
     if (!curTab || !curTab.id) {
       createNewTab();
     } else {
-      chrome.tabs.get(curTab.id, function(tab) {
+      chrome.tabs.get(curTab.id, function (tab) {
         console.log(chrome.runtime.id, tab.url);
         if (tab && tab.url && tab.url.includes(getExtensionId())) {
           focusTab(curTab.id);
@@ -104,14 +102,14 @@
   });
 
   // When a tab is closed, check if it is the extension tab that was closed, and unset curTabId
-  chrome.tabs.onRemoved.addListener(function(tabId) {
+  chrome.tabs.onRemoved.addListener(function (tabId) {
     if (tabId === curTab.id) {
       curTab = {};
     }
   });
 
   // Show the update notification after every new update
-  chrome.runtime.onInstalled.addListener(function(details) {
+  chrome.runtime.onInstalled.addListener(function (details) {
     if (details.reason === 'update') {
       chrome.notifications.create(
         {
@@ -120,12 +118,12 @@
           title: 'Altair has been updated',
           message: 'Click to view changelog.',
         },
-        function(notifId) {}
+        function (notifId) {}
       );
     }
   });
 
-  chrome.notifications.onClicked.addListener(function(notifId) {
+  chrome.notifications.onClicked.addListener(function (notifId) {
     openChangeLog();
   });
 })();

cwex.old.yml

@@ -0,0 +1,39 @@
+include:
+  - packages/altair-app/dist/*
+  - chrome-ext-files/*
+exclude:
+  - dist\/stats\.json
+  - dist\/assets\/img\/readme
+outDir: extension-builds
+outFile: build.zip
+beforeCompile: bin/ext-update-index.js
+manifestOptions:
+  name: Altair GraphQL Client
+  short_name: Altair
+  description: A beautiful feature-rich GraphQL client for all platforms
+  version: 6.4.2
+  icons:
+    16: assets/img/altair_logo_128.png
+    48: assets/img/altair_logo_128.png
+    128: assets/img/altair_logo_128.png
+  browser_action:
+    default_icon: assets/img/altair_logo_128.png
+  permissions:
+    - http://*/
+    - https://*/
+    - tabs
+    - storage
+    - notifications
+  # this CSP has been modified to allow unsafe-eval but the CSP in the index.html remains strict. This allows the web worker to have the less strict CSP.
+  # Note: firefox ignores the CSP if it contains unsafe-inline
+  content_security_policy: "script-src 'self' 'sha256-765ndVO8s0mJNdlCDVQJVuWyBpugFWusu1COU8BNbI8=' 'sha256-kFTKSG2YSVB69S6DWzferO6LmwbqfHmYBTqvVbPEp4I=' 'unsafe-eval' https://cdn.jsdelivr.net https://apis.google.com https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com localhost:* http://localhost:8002 http://localhost:8080; object-src 'self';"
+  background:
+    scripts:
+      - js/background.js
+  options_ui:
+    page: options.html
+    open_in_tab: false
+  offline_enabled: true
+  browser_specific_settings:
+    gecko:
+      strict_min_version: '60.0'

cwex.yml

@@ -6,7 +6,7 @@ exclude:
   - dist\/assets\/img\/readme
 outDir: extension-builds
 outFile: build.zip
-beforeCompile: bin/ext-update-index.js
+beforeCompile: bin/ext-update-index.mjs
 manifestOptions:
   name: Altair GraphQL Client
   short_name: Altair
@@ -16,24 +16,41 @@ manifestOptions:
     16: assets/img/altair_logo_128.png
     48: assets/img/altair_logo_128.png
     128: assets/img/altair_logo_128.png
-  browser_action:
+  action:
     default_icon: assets/img/altair_logo_128.png
   permissions:
-    - http://*/
-    - https://*/
     - tabs
     - storage
     - notifications
-  # this CSP has been modified to allow unsafe-eval but the CSP in the index.html remains strict. This allows the web worker to have the less strict CSP.
-  # Note: firefox ignores the CSP if it contains unsafe-inline
-  content_security_policy: "script-src 'self' 'sha256-765ndVO8s0mJNdlCDVQJVuWyBpugFWusu1COU8BNbI8=' 'sha256-kFTKSG2YSVB69S6DWzferO6LmwbqfHmYBTqvVbPEp4I=' 'unsafe-eval' https://cdn.jsdelivr.net https://apis.google.com https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com localhost:* http://localhost:8002 http://localhost:8080; object-src 'self';"
+  host_permissions:
+    - http://*/
+    - https://*/
+  content_security_policy:
+    # this CSP has been modified to allow unsafe-eval but the CSP in the index.html remains strict. This allows the web worker to have the less strict CSP.
+    # Note: firefox ignores the CSP if it contains unsafe-inline
+    # Note: Don't forget to update the CSP in the index.html file
+    #
+    # Most script-src values are unsupported in mv3 https://developer.chrome.com/docs/extensions/develop/migrate/improve-security#remove-unsupported-csv
+    # extension_pages: "script-src 'self' 'sha256-765ndVO8s0mJNdlCDVQJVuWyBpugFWusu1COU8BNbI8=' 'sha256-btk6arYQcHAX3O853bPKjrJz/yX/iuv4n0kXWYdJlEE=' 'sha256-kFTKSG2YSVB69S6DWzferO6LmwbqfHmYBTqvVbPEp4I='; object-src 'self';"
+    sandbox: "sandbox allow-scripts allow-forms allow-popups allow-modals; script-src 'self' 'sha256-765ndVO8s0mJNdlCDVQJVuWyBpugFWusu1COU8BNbI8=' 'sha256-btk6arYQcHAX3O853bPKjrJz/yX/iuv4n0kXWYdJlEE=' 'sha256-kFTKSG2YSVB69S6DWzferO6LmwbqfHmYBTqvVbPEp4I=' 'unsafe-eval' https://cdn.jsdelivr.net https://apis.google.com https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com localhost:* http://localhost:8002 http://localhost:8080; object-src 'self';"
   background:
     scripts:
       - js/background.js
+    service_worker: js/background.js
   options_ui:
     page: options.html
     open_in_tab: false
   offline_enabled: true
+  web_accessible_resources:
+    - resources:
+        - '*.css'
+        - '*.woff'
+        - '*.woff2'
+      matches:
+        - '<all_urls>'
+  # sandbox:
+  #   pages:
+  #     - index.html
   browser_specific_settings:
     gecko:
       strict_min_version: '60.0'

lerna.json

@@ -1,7 +1,5 @@
 {
-  "packages": [
-    "packages/*"
-  ],
+  "packages": ["packages/*", "libs/*"],
   "version": "7.0.1",
   "registry": "https://registry.npmjs.org/",
   "npmClient": "yarn",

libs/cwex/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "altair-cwex",
+  "version": "6.4.2",
+  "description": "A CLI tool for creating and managing cross-platform browser extensions",
+  "bin": {
+    "cwex": "dist/cli.js"
+  },
+  "type": "module",
+  "main": "dist/index.js",
+  "license": "MIT",
+  "private": true,
+  "dependencies": {
+    "archiver": "^7.0.1",
+    "commander": "^12.0.0",
+    "debug": "^4.3.4",
+    "find-up": "^7.0.0",
+    "fs-extra": "^11.2.0",
+    "globby": "^14.0.1",
+    "web-ext": "^7.11.0",
+    "yaml": "^2.4.1"
+  },
+  "devDependencies": {
+    "@types/archiver": "^6.0.2",
+    "@types/chrome": "^0.0.266",
+    "@types/debug": "^4.1.12",
+    "@types/firefox-webext-browser": "^120.0.3",
+    "@types/node": "^20.12.7"
+  },
+  "scripts": {
+    "build": "tsc",
+    "prepare": "yarn build"
+  }
+}

libs/cwex/src/__mocks__/web-ext.js

@@ -0,0 +1,7 @@
+module.exports = {
+  default: {
+    cmd: {
+      build: jest.fn(),
+    }
+  }
+};

libs/cwex/src/__snapshots__/config.spec.ts.snap

@@ -0,0 +1,23 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`config getConfig should merge config from config file with default config 1`] = `
+Object {
+  "beforeCompile": "./new/before-compile.js",
+  "exclude": Array [
+    "new.exclude.pattern",
+  ],
+  "include": Array [
+    "file1",
+    "file2",
+  ],
+  "manifestOptions": Object {
+    "name": "New test",
+  },
+  "outDir": "out",
+  "rootDir": "./new/root",
+  "targets": Array [
+    "new-target1",
+    "new-target2",
+  ],
+}
+`;

libs/cwex/src/cli.spec.ts

@@ -0,0 +1,26 @@
+// import commander from 'commander';
+// import { buildProject } from './index';
+
+// jest.mock('./index');
+// jest.mock('commander', () => {
+
+//   const commandInstance = {} as any;
+//   const commandInstanceMethod = jest.fn(() => commandInstance);
+//   commandInstance.command = commandInstanceMethod;
+//   commandInstance.description = commandInstanceMethod;
+//   commandInstance.option = commandInstanceMethod;
+//   commandInstance.action = jest.fn(cb => cb({}) || commandInstance);
+//   commandInstance.parse = commandInstanceMethod;
+
+//   return {
+//     Command: jest.fn(() => {
+//       return commandInstance;
+//     })
+//   };
+// });
+
+// describe('cli', () => {
+//   it('executes successfully', () => {
+//     require('./cli');
+//   });
+// });

libs/cwex/src/cli.ts

@@ -0,0 +1,34 @@
+#!/usr/bin/env node
+
+import { Command } from 'commander';
+import { setLogging } from './utils/logger.js';
+
+import { buildProject } from './index.js';
+
+const program = new Command();
+program
+  .command('build')
+  .description('builds extensions')
+  .option('-c, --config <config path>', 'specify the config file')
+  .option('--debug', 'show debugging information')
+  .action((cmd) => {
+    setLogging(cmd.debug);
+    return buildProject({
+      configPath: cmd.config,
+    });
+  });
+program.parse(process.argv);
+
+export default program;
+
+// build project
+// Compile assets:
+/*
+ out/
+  chrome-extension/
+    includes**
+    manifest.json
+  mozilla-extension/
+    includes**
+    manifest.json
+*/