browser-extension-manager 1.3.48 → 1.4.0

package/dist/gulp/tasks/html.js

@@ -2,7 +2,7 @@
 const Manager = new (require('../../build.js'));
 const logger = Manager.logger('html');
 const { src, dest, watch, series } = require('gulp');
-const through2 = require('through2');
+const { Transform } = require('node:stream');
 const jetpack = require('fs-jetpack');
 const path = require('path');
 const { template } = require('node-powertools');
@@ -51,86 +51,89 @@ function html(complete) {
 
 // Process HTML transform
 function processHtml(templateContent) {
-  return through2.obj(function (file, _, callback) {
-    // Skip if it's a directory
-    if (file.isDirectory()) {
-      return callback(null, file);
-    }
-
-    try {
-      // Get the view name from the file path
-      const viewName = path.basename(file.path, '.html');
-      const relativePath = path.relative(path.join(rootPathProject, 'src/views'), file.dirname);
-      const viewNameWithPath = relativePath ? `${relativePath}/${viewName}` : viewName;
-
-      // Read the content (body HTML)
-      const bodyContent = file.contents.toString();
-
-      // Determine the component name for CSS/JS loading
-      // Template already includes /components/ prefix, so just provide the component path
-      // Pages can have multiple files (index, pricing, login, etc.)
-      // Other components (popup, options, etc.) only have index.html
-      let componentName;
-      if (relativePath.startsWith('pages/') || relativePath === 'pages') {
-        // Pages directory: include full path with filename
-        // pages/index.html -> pages/index
-        // pages/pricing.html -> pages/pricing
-        componentName = viewNameWithPath;
-      } else if (relativePath && viewName === 'index') {
-        // Other components with index.html: use just the directory name
-        // popup/index.html -> popup
-        // options/index.html -> options
-        componentName = relativePath;
-      } else if (relativePath) {
-        // Non-index files in other directories: use full path
-        componentName = viewNameWithPath;
-      } else {
-        // No path: use viewName
-        componentName = viewName;
+  return new Transform({
+    objectMode: true,
+    transform(file, _, callback) {
+      // Skip if it's a directory
+      if (file.isDirectory()) {
+        return callback(null, file);
       }
 
-      // Prepare template data
-      const data = {
-        content: bodyContent,
-        page: {
-          name: componentName,
-          path: viewNameWithPath,
-          title: config.brand?.name || 'Extension',
-        },
-        theme: {
-          appearance: config.theme?.appearance || 'dark',
-        },
-        brand: config.brand || {},
-        cacheBust: Date.now(),
-      };
-
-      // Apply template with custom brackets
-      // First, template the body content to replace any {{ }} placeholders in the view
-      const templatedBody = template(bodyContent, data, {
-        brackets: ['{{', '}}'],
-      });
-
-      // Update data with templated body
-      data.content = templatedBody;
-
-      // Then template the outer page template
-      const rendered = template(templateContent, data, {
-        brackets: ['{{', '}}'],
-      });
-
-      // Update file contents
-      file.contents = Buffer.from(rendered);
-
-      // Log
-      logger.log(`Processed: ${viewNameWithPath}.html`);
-
-      // Push the file
-      this.push(file);
-      return callback();
-    } catch (error) {
-      logger.error('Error processing HTML:', error);
-      return callback(error);
-    }
+      try {
+        // Get the view name from the file path
+        const viewName = path.basename(file.path, '.html');
+        const relativePath = path.relative(path.join(rootPathProject, 'src/views'), file.dirname);
+        const viewNameWithPath = relativePath ? `${relativePath}/${viewName}` : viewName;
+
+        // Read the content (body HTML)
+        const bodyContent = file.contents.toString();
+
+        // Determine the component name for CSS/JS loading
+        // Template already includes /components/ prefix, so just provide the component path
+        // Pages can have multiple files (index, pricing, login, etc.)
+        // Other components (popup, options, etc.) only have index.html
+        let componentName;
+        if (relativePath.startsWith('pages/') || relativePath === 'pages') {
+          // Pages directory: include full path with filename
+          // pages/index.html -> pages/index
+          // pages/pricing.html -> pages/pricing
+          componentName = viewNameWithPath;
+        } else if (relativePath && viewName === 'index') {
+          // Other components with index.html: use just the directory name
+          // popup/index.html -> popup
+          // options/index.html -> options
+          componentName = relativePath;
+        } else if (relativePath) {
+          // Non-index files in other directories: use full path
+          componentName = viewNameWithPath;
+        } else {
+          // No path: use viewName
+          componentName = viewName;
+        }
+
+        // Prepare template data
+        const data = {
+          content: bodyContent,
+          page: {
+            name: componentName,
+            path: viewNameWithPath,
+            title: config.brand?.name || 'Extension',
+          },
+          theme: {
+            appearance: config.theme?.appearance || 'dark',
+          },
+          brand: config.brand || {},
+          cacheBust: Date.now(),
+        };
+
+        // Apply template with custom brackets
+        // First, template the body content to replace any {{ }} placeholders in the view
+        const templatedBody = template(bodyContent, data, {
+          brackets: ['{{', '}}'],
+        });
+
+        // Update data with templated body
+        data.content = templatedBody;
+
+        // Then template the outer page template
+        const rendered = template(templateContent, data, {
+          brackets: ['{{', '}}'],
+        });
+
+        // Update file contents
+        file.contents = Buffer.from(rendered);
+
+        // Log
+        logger.log(`Processed: ${viewNameWithPath}.html`);
+
+        // Push the file
+        this.push(file);
+        return callback();
+      } catch (error) {
+        logger.error('Error processing HTML:', error);
+        return callback(error);
+      }
+    },
   });
 }
 

package/dist/gulp/tasks/utils/template-transform.js

@@ -1,49 +1,49 @@
 // Libraries
-const through2 = require('through2');
+const { Transform } = require('node:stream');
 const { template } = require('node-powertools');
 const path = require('path');
 
 /**
- * Creates a through2 transform stream that processes template variables in files
+ * Creates a transform stream that processes template variables in files
  **/
 function createTemplateTransform(data) {
   const extensions = ['html', 'md', 'liquid', 'json', 'yml', 'yaml']
 
-  return through2.obj(function(file, encoding, callback) {
-    // Skip directories
-    if (file.isDirectory()) {
-      return callback(null, file);
-    }
-
-    // Check if file extension matches
-    const ext = path.extname(file.path).toLowerCase().slice(1);
-    if (!extensions.includes(ext)) {
-      return callback(null, file);
-    }
-
-    // Log
-    // console.log(`Processing file: ${file.path}`);
-
-    // Process the file contents
-    try {
-      const contents = file.contents.toString();
-
-      // Process templates
-      const templated = template(contents, data, {
-        brackets: ['[', ']'],
-      });
-
-      // Update file contents if changed
-      if (contents !== templated) {
-        file.contents = Buffer.from(templated);
-        const relativePath = file.relative || file.path;
+  return new Transform({
+    objectMode: true,
+    transform(file, encoding, callback) {
+      // Skip directories
+      if (file.isDirectory()) {
+        return callback(null, file);
       }
-    } catch (error) {
-      console.error(`Error processing templates in ${file.path}:`, error);
-    }
 
-    // Pass the file through
-    callback(null, file);
+      // Check if file extension matches
+      const ext = path.extname(file.path).toLowerCase().slice(1);
+      if (!extensions.includes(ext)) {
+        return callback(null, file);
+      }
+
+      // Process the file contents
+      try {
+        const contents = file.contents.toString();
+
+        // Process templates
+        const templated = template(contents, data, {
+          brackets: ['[', ']'],
+        });
+
+        // Update file contents if changed
+        if (contents !== templated) {
+          file.contents = Buffer.from(templated);
+          const relativePath = file.relative || file.path;
+        }
+      } catch (error) {
+        console.error(`Error processing templates in ${file.path}:`, error);
+      }
+
+      // Pass the file through
+      callback(null, file);
+    },
   });
 }
 

package/dist/offscreen.js

@@ -1,6 +1,7 @@
 // Libraries
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
+import { attachTo as attachModeHelpers } from './utils/mode-helpers.js';
 
 // Class
 class Manager {
@@ -23,5 +24,8 @@ class Manager {
   }
 }
 
+// Cross-context helpers — Manager.isTesting() / isDevelopment() / etc.
+attachModeHelpers(Manager);
+
 // Export
 export default Manager;

package/dist/options.js

@@ -3,6 +3,7 @@ import webManager from 'web-manager';
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
 import { syncWithBackground, setupAuthBroadcastListener, setupSignOutListener, setupAuthEventListeners, openAuthPage as openAuthPageHelper } from './lib/auth-helpers.js';
+import { attachTo as attachModeHelpers } from './utils/mode-helpers.js';
 
 // Import theme (exposes Bootstrap to window.bootstrap)
 import '__theme__/_theme.js';
@@ -59,5 +60,8 @@ class Manager {
   }
 }
 
+// Cross-context helpers — Manager.isTesting() / isDevelopment() / etc.
+attachModeHelpers(Manager);
+
 // Export
 export default Manager;

package/dist/page.js

@@ -3,6 +3,7 @@ import webManager from 'web-manager';
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
 import { syncWithBackground, setupAuthBroadcastListener, setupSignOutListener, setupAuthEventListeners, openAuthPage as openAuthPageHelper } from './lib/auth-helpers.js';
+import { attachTo as attachModeHelpers } from './utils/mode-helpers.js';
 
 // Import theme (exposes Bootstrap to window.bootstrap)
 import '__theme__/_theme.js';
@@ -59,5 +60,8 @@ class Manager {
   }
 }
 
+// Cross-context helpers — Manager.isTesting() / isDevelopment() / etc.
+attachModeHelpers(Manager);
+
 // Export
 export default Manager;

package/dist/popup.js

@@ -3,6 +3,7 @@ import webManager from 'web-manager';
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
 import { syncWithBackground, setupAuthBroadcastListener, setupSignOutListener, setupAuthEventListeners, openAuthPage as openAuthPageHelper } from './lib/auth-helpers.js';
+import { attachTo as attachModeHelpers } from './utils/mode-helpers.js';
 
 // Import theme (exposes Bootstrap to window.bootstrap)
 import '__theme__/_theme.js';
@@ -59,5 +60,8 @@ class Manager {
   }
 }
 
+// Cross-context helpers — Manager.isTesting() / isDevelopment() / etc.
+attachModeHelpers(Manager);
+
 // Export
 export default Manager;

package/dist/sidepanel.js

@@ -3,6 +3,7 @@ import webManager from 'web-manager';
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
 import { syncWithBackground, setupAuthBroadcastListener, setupSignOutListener, setupAuthEventListeners, openAuthPage as openAuthPageHelper } from './lib/auth-helpers.js';
+import { attachTo as attachModeHelpers } from './utils/mode-helpers.js';
 
 // Import theme (exposes Bootstrap to window.bootstrap)
 import '__theme__/_theme.js';
@@ -59,5 +60,8 @@ class Manager {
   }
 }
 
+// Cross-context helpers — Manager.isTesting() / isDevelopment() / etc.
+attachModeHelpers(Manager);
+
 // Export
 export default Manager;

package/dist/test/assert.js

@@ -0,0 +1,120 @@
+// Tiny expect() — Jest/Vitest-compatible subset.
+// Each matcher throws on failure; the runner catches.
+
+function deepEqual(a, b) {
+  if (a === b) return true;
+  if (typeof a !== typeof b) return false;
+  if (a === null || b === null) return a === b;
+  if (typeof a !== 'object') return false;
+
+  if (Array.isArray(a)) {
+    if (!Array.isArray(b) || a.length !== b.length) return false;
+    return a.every((x, i) => deepEqual(x, b[i]));
+  }
+
+  const ka = Object.keys(a);
+  const kb = Object.keys(b);
+  if (ka.length !== kb.length) return false;
+  return ka.every((k) => deepEqual(a[k], b[k]));
+}
+
+function fmt(v) {
+  if (typeof v === 'string') return JSON.stringify(v);
+  if (v === undefined) return 'undefined';
+  try {
+    return JSON.stringify(v);
+  } catch (e) {
+    return String(v);
+  }
+}
+
+function fail(message) {
+  const err = new Error(message);
+  err.name = 'AssertionError';
+  throw err;
+}
+
+function buildMatchers(actual, negated) {
+  const not = negated ? 'not ' : '';
+
+  function check(cond, message) {
+    if (negated) cond = !cond;
+    if (!cond) fail(message);
+  }
+
+  return {
+    toBe(expected) {
+      check(actual === expected, `expected ${fmt(actual)} ${not}to be ${fmt(expected)}`);
+    },
+    toEqual(expected) {
+      check(deepEqual(actual, expected), `expected ${fmt(actual)} ${not}to deeply equal ${fmt(expected)}`);
+    },
+    toBeTruthy() {
+      check(!!actual, `expected ${fmt(actual)} ${not}to be truthy`);
+    },
+    toBeFalsy() {
+      check(!actual, `expected ${fmt(actual)} ${not}to be falsy`);
+    },
+    toBeDefined() {
+      check(actual !== undefined, `expected ${fmt(actual)} ${not}to be defined`);
+    },
+    toBeUndefined() {
+      check(actual === undefined, `expected ${fmt(actual)} ${not}to be undefined`);
+    },
+    toBeNull() {
+      check(actual === null, `expected ${fmt(actual)} ${not}to be null`);
+    },
+    toContain(item) {
+      const has = Array.isArray(actual)
+        ? actual.includes(item)
+        : (typeof actual === 'string' && actual.includes(item));
+      check(has, `expected ${fmt(actual)} ${not}to contain ${fmt(item)}`);
+    },
+    toHaveProperty(key) {
+      const has = actual != null && Object.prototype.hasOwnProperty.call(actual, key);
+      check(has, `expected ${fmt(actual)} ${not}to have property "${key}"`);
+    },
+    toMatch(regex) {
+      check(regex.test(actual), `expected ${fmt(actual)} ${not}to match ${regex}`);
+    },
+    toBeInstanceOf(cls) {
+      check(actual instanceof cls, `expected value ${not}to be instance of ${cls.name}`);
+    },
+    toBeGreaterThan(n) {
+      check(actual > n, `expected ${fmt(actual)} ${not}to be > ${n}`);
+    },
+    toBeLessThan(n) {
+      check(actual < n, `expected ${fmt(actual)} ${not}to be < ${n}`);
+    },
+    async toThrow(matcher) {
+      let threw = false;
+      let thrown;
+      try {
+        if (typeof actual === 'function') {
+          await actual();
+        }
+      } catch (e) {
+        threw = true;
+        thrown = e;
+      }
+      if (!threw) {
+        return check(false, `expected function ${not}to throw`);
+      }
+      if (matcher instanceof RegExp) {
+        check(matcher.test(thrown.message), `expected thrown message ${not}to match ${matcher} (got: ${thrown.message})`);
+      } else if (typeof matcher === 'string') {
+        check(thrown.message.includes(matcher), `expected thrown message ${not}to contain "${matcher}" (got: ${thrown.message})`);
+      } else {
+        check(true, '');
+      }
+    },
+  };
+}
+
+function expect(actual) {
+  const m = buildMatchers(actual, false);
+  m.not = buildMatchers(actual, true);
+  return m;
+}
+
+module.exports = expect;

package/dist/test/fixtures/consumer-extension/dist/background.js

@@ -0,0 +1,15 @@
+// BXM fixture consumer — pretends to be a real BXM-based extension's background.
+// Boot tests verify this SW comes up cleanly and exposes a couple of probe hooks.
+
+globalThis.__bxmFixtureBooted = true;
+globalThis.__bxmFixtureBootedAt = Date.now();
+
+chrome.runtime.onMessage.addListener((msg, _sender, sendResponse) => {
+  if (msg && msg.type === 'fixture:hello') {
+    sendResponse({ ok: true, version: chrome.runtime.getManifest().version });
+    return false;
+  }
+  return false;
+});
+
+console.log('[bxm-fixture] background ready');

package/dist/test/fixtures/consumer-extension/dist/manifest.json

@@ -0,0 +1,20 @@
+{
+  "manifest_version": 3,
+  "name": "BXM Fixture Consumer",
+  "version": "0.1.0",
+  "description": "Used by BXM's boot-layer tests as a stand-in for a real consumer extension.",
+  "background": {
+    "service_worker": "background.js"
+  },
+  "action": {
+    "default_popup": "popup.html",
+    "default_title": "BXM Fixture Consumer"
+  },
+  "options_ui": {
+    "page": "options.html",
+    "open_in_tab": true
+  },
+  "permissions": [
+    "storage"
+  ]
+}

package/dist/test/fixtures/consumer-extension/dist/options.html

@@ -0,0 +1,10 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>BXM Fixture Consumer — Options</title>
+</head>
+<body>
+  <h1>Fixture Options</h1>
+</body>
+</html>

package/dist/test/fixtures/consumer-extension/dist/popup.html

@@ -0,0 +1,11 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>BXM Fixture Consumer — Popup</title>
+</head>
+<body>
+  <h1 id="main-content">Fixture Popup</h1>
+  <p>Boot tests assert that this page renders inside Chromium when loaded as an unpacked extension.</p>
+</body>
+</html>

package/dist/test/harness/extension/background.js

@@ -0,0 +1,26 @@
+// BXM test-harness background service worker.
+//
+// This SW does ONE job: stay alive long enough for the chromium runner to attach
+// a CDP session and inject test code via Runtime.evaluate. The runner discovers
+// this SW via Puppeteer's service-worker target API, then drives test execution
+// directly from the parent Node process — this file is intentionally minimal.
+//
+// We set a couple of globals the injected test code can rely on:
+//   globalThis.BXM_TEST_MODE — picked up by Manager.isTesting()
+//   globalThis.__bxmTestEmit — defined by the runner before each test;
+//                              used by injected code to report results
+//
+// We also publish a `chrome.runtime.onMessage` ping handler so view-layer tests
+// (running in popup/options/sidepanel tabs) can verify the SW is alive.
+
+globalThis.BXM_TEST_MODE = true;
+
+chrome.runtime.onMessage.addListener((msg, _sender, sendResponse) => {
+  if (msg && msg.type === 'bxm:test:ping') {
+    sendResponse({ pong: true, ts: Date.now() });
+    return false; // sync response
+  }
+  return false;
+});
+
+console.log('[bxm-harness] service worker ready');

package/dist/test/harness/extension/manifest.json

@@ -0,0 +1,27 @@
+{
+  "manifest_version": 3,
+  "name": "BXM Test Harness",
+  "version": "1.0.0",
+  "description": "Loaded by the chromium runner to host background + view layer tests.",
+  "background": {
+    "service_worker": "background.js"
+  },
+  "action": {
+    "default_popup": "popup.html",
+    "default_title": "BXM Test Harness"
+  },
+  "options_ui": {
+    "page": "options.html",
+    "open_in_tab": true
+  },
+  "side_panel": {
+    "default_path": "sidepanel.html"
+  },
+  "permissions": [
+    "storage",
+    "sidePanel"
+  ],
+  "host_permissions": [
+    "<all_urls>"
+  ]
+}

package/dist/test/harness/extension/options.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>BXM Test Harness — Options</title>
+</head>
+<body data-bxm-context="options">
+  <h3 id="title">BXM Test Harness — Options</h3>
+  <p id="status">ready</p>
+  <pre id="log"></pre>
+</body>
+</html>

package/dist/test/harness/extension/popup.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>BXM Test Harness — Popup</title>
+</head>
+<body data-bxm-context="popup">
+  <h3 id="title">BXM Test Harness</h3>
+  <p id="status">ready</p>
+  <pre id="log"></pre>
+</body>
+</html>

package/dist/test/harness/extension/sidepanel.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>BXM Test Harness — Side Panel</title>
+</head>
+<body data-bxm-context="sidepanel">
+  <h3 id="title">BXM Test Harness — Side Panel</h3>
+  <p id="status">ready</p>
+  <pre id="log"></pre>
+</body>
+</html>