browser-extension-manager 1.2.3 → 1.2.5

package/dist/gulp/tasks/distribute.js

@@ -15,6 +15,9 @@ const config = Manager.getConfig('project');
 const rootPathPackage = Manager.getRootPath('main');
 const rootPathProject = Manager.getRootPath('project');
 
+// Constants
+const LOUD = process.env.BXM_LOUD_LOGS === 'true';
+
 // Glob
 const input = [
   // Files to include
@@ -108,7 +111,9 @@ function customTransform() {
     const relativePath = path.relative(file.base, file.path).replace(/\\/g, '/');
 
     // Log
-    logger.log(`Processing file: ${relativePath}`);
+    if (LOUD) {
+      logger.log(`Processing file: ${relativePath}`);
+    }
 
     // Change path if it starts with 'pages/'
     // if (relativePath.startsWith('pages/')) {

package/dist/gulp/tasks/package.js

@@ -58,6 +58,7 @@ async function generateBuildJs(outputDir) {
       },
       config: {
         // Core metadata
+        runtime: 'browser-extension',
         version: project.version,
         environment: Manager.getEnvironment(),
         buildTime: Date.now(),
@@ -97,8 +98,11 @@ async function generateBuildJs(outputDir) {
         refreshNewVersion: { enabled: true, config: {} },
         serviceWorker: { enabled: false, config: {} },
 
-        // Analytics
-        google_analytics: config.google_analytics || {},
+        // Tracking
+        tracking: {
+          'google-analytics': config.google_analytics?.id || '',
+          'google-analytics-secret': config.google_analytics?.secret || '',
+        },
 
         // Theme config
         theme: config.theme || {},
@@ -282,7 +286,12 @@ async function packageZip() {
 
     // Create packed extension (.zip)
     if (Manager.isBuildMode()) {
-      await execute(`zip -r ${zipPath} ${inputDir}`);
+      // Remove existing zip if it exists
+      jetpack.remove(zipPath);
+
+      // Zip contents of raw directory (not the directory itself)
+      // This ensures manifest.json is at the root of the zip
+      await execute(`cd ${inputDir} && zip -r ../../${zipPath} .`);
       logger.log(`Zipped package created at ${zipPath}`);
     } else {
       logger.log(`Skipping zip (not in build mode)`);

package/dist/gulp/tasks/publish.js

@@ -12,19 +12,36 @@ const project = Manager.getPackage('project');
 // Paths
 const zipPath = path.join(process.cwd(), 'packaged', 'extension.zip');
 
+// Helper to check if a credential is valid (not empty or placeholder)
+function isValidCredential(value) {
+  return value && !value.startsWith('your-');
+}
+
 // Store configurations - all credentials come from .env file
 const STORES = {
   chrome: {
     name: 'Chrome Web Store',
-    enabled: () => !!(process.env.CHROME_EXTENSION_ID && process.env.CHROME_CLIENT_ID),
+    submitUrl: 'https://chrome.google.com/webstore/devconsole',
+    apiUrl: 'https://developer.chrome.com/docs/webstore/using_webstore_api/',
+    enabled: () => isValidCredential(process.env.CHROME_EXTENSION_ID) && isValidCredential(process.env.CHROME_CLIENT_ID),
   },
   firefox: {
     name: 'Firefox Add-ons',
-    enabled: () => !!(process.env.FIREFOX_API_KEY && process.env.FIREFOX_API_SECRET),
+    submitUrl: 'https://addons.mozilla.org/en-US/developers/addon/submit/distribution',
+    apiUrl: 'https://addons.mozilla.org/developers/addon/api/key/',
+    enabled: () => isValidCredential(process.env.FIREFOX_API_KEY) && isValidCredential(process.env.FIREFOX_API_SECRET),
   },
   edge: {
     name: 'Microsoft Edge Add-ons',
-    enabled: () => !!(process.env.EDGE_PRODUCT_ID && process.env.EDGE_CLIENT_ID),
+    submitUrl: 'https://partner.microsoft.com/dashboard/microsoftedge/',
+    apiUrl: 'https://learn.microsoft.com/en-us/microsoft-edge/extensions-chromium/publish/api/using-addons-api',
+    enabled: () => isValidCredential(process.env.EDGE_PRODUCT_ID) && isValidCredential(process.env.EDGE_CLIENT_ID),
+  },
+  opera: {
+    name: 'Opera Add-ons',
+    submitUrl: 'https://addons.opera.com/developer/',
+    apiUrl: null,
+    enabled: () => false,
   },
 };
 
@@ -50,20 +67,30 @@ async function publish(complete) {
 
   // Get enabled stores
   const enabledStores = Object.entries(STORES)
-    .filter(([key, store]) => store.enabled())
+    .filter(([, store]) => store.enabled())
     .map(([key]) => key);
 
+  // If no stores are configured, error and show all store info
   if (enabledStores.length === 0) {
-    logger.warn('No stores configured for publishing. Add credentials to .env file');
-    logger.log('Required environment variables:');
-    logger.log('  Chrome: CHROME_EXTENSION_ID, CHROME_CLIENT_ID, CHROME_CLIENT_SECRET, CHROME_REFRESH_TOKEN');
-    logger.log('  Firefox: FIREFOX_EXTENSION_ID, FIREFOX_API_KEY, FIREFOX_API_SECRET');
-    logger.log('  Edge: EDGE_PRODUCT_ID, EDGE_CLIENT_ID, EDGE_API_KEY');
-    return complete();
+    logger.error('No stores configured for publishing. Add credentials to .env file');
+    logger.log('');
+    logger.log('Store URLs and API documentation:');
+    Object.entries(STORES).forEach(([, store]) => {
+      logger.log(`  ${store.name}:`);
+      logger.log(`    Submit: ${store.submitUrl}`);
+      logger.log(`    API:    ${store.apiUrl || 'N/A (manual submission only)'}`);
+    });
+    throw new Error('No stores configured for publishing');
   }
 
   logger.log(`Publishing to: ${enabledStores.join(', ')}`);
 
+  // Track results
+  const results = {
+    success: [],
+    failed: [],
+  };
+
   // Run publish tasks in parallel
   const publishTasks = enabledStores.map(async (store) => {
     try {
@@ -79,14 +106,37 @@ async function publish(complete) {
           break;
       }
       logger.log(`[${store}] Published successfully`);
+      results.success.push(store);
     } catch (e) {
       logger.error(`[${store}] Publish failed: ${e.message}`);
+      results.failed.push(store);
     }
   });
 
   await Promise.all(publishTasks);
 
+  // Log completion and show all store URLs
+  logger.log('');
+  logger.log('Store URLs:');
+  Object.entries(STORES).forEach(([key, store]) => {
+    let status = '○ Manual';
+    if (results.success.includes(key)) {
+      status = '✓ Published';
+    } else if (results.failed.includes(key)) {
+      status = '✗ Failed';
+    }
+    logger.log(`  ${store.name}: ${status}`);
+    logger.log(`    Submit: ${store.submitUrl}`);
+    logger.log(`    API:    ${store.apiUrl || 'N/A (manual submission only)'}`);
+  });
+
+  // Throw error if any failed
+  if (results.failed.length > 0) {
+    throw new Error(`Publish failed for: ${results.failed.join(', ')}`);
+  }
+
   // Log
+  logger.log('');
   logger.log('Publish finished!');
 
   // Complete

package/dist/gulp/tasks/webpack.js

@@ -49,12 +49,11 @@ const watchInput = [
   `${rootPathPackage}/dist/assets/themes/**/*.js`,
   'src/assets/themes/**/*.js',
 
-  // Component files - watch for changes to trigger recompile
-  `${rootPathPackage}/src/popup.js`,
-  `${rootPathPackage}/src/options.js`,
-  `${rootPathPackage}/src/page.js`,
-  `${rootPathPackage}/src/sidepanel.js`,
-  `${rootPathPackage}/src/index.js`,
+  // All project assets js - watch for changes but don't compile as entry points
+  'src/assets/js/**/*.js',
+
+  // All BEM package src files - watch for changes (includes background.js, popup.js, etc.)
+  `${rootPathPackage}/src/**/*.js`,
 
   // So we can watch for changes while we're developing web-manager
   `${rootPathPackage}/../web-manager/src`,
@@ -108,6 +107,9 @@ function getSettings() {
       },
       // Add module resolution paths
       modules: [
+        // Local web-manager's node_modules (for when we're using "web-manager": "file:../web-manager")
+        path.resolve(rootPathPackage, '../web-manager/node_modules'),
+
         // Package's node_modules
         path.resolve(rootPathPackage, 'node_modules'),
 

package/dist/lib/auth-helpers.js

@@ -0,0 +1,184 @@
+// Auth helpers for cross-context auth sync in browser extensions
+// Used by popup.js, options.js, sidepanel.js, page.js
+
+/**
+ * Sign in with custom token from storage
+ * @param {Object} context - The manager instance
+ * @param {Object} authState - Auth state with token
+ */
+async function signInWithStoredToken(context, authState) {
+  const { webManager, logger } = context;
+
+  // Skip if no token
+  if (!authState?.token) {
+    logger.log('[AUTH-SYNC] No token in auth state, skipping sign in');
+    return;
+  }
+
+  try {
+    logger.log('[AUTH-SYNC] Signing in with stored token...');
+
+    // Sign in using webManager's auth which initializes Firebase
+    await webManager.auth().signInWithCustomToken(authState.token);
+
+    logger.log('[AUTH-SYNC] Signed in successfully:', authState.user?.email);
+  } catch (error) {
+    // Token may have expired, clear it
+    logger.error('[AUTH-SYNC] Error signing in with token:', error.message);
+
+    // If token is invalid/expired, clear the auth state
+    if (error.code === 'auth/invalid-custom-token' || error.code === 'auth/custom-token-expired') {
+      logger.log('[AUTH-SYNC] Token expired, clearing auth state');
+      context.extension.storage.remove('bxm:authState');
+    }
+  }
+}
+
+/**
+ * Set up storage listener for cross-context auth sync
+ * Listens for auth state changes from background.js and syncs Firebase auth
+ * @param {Object} context - The manager instance (must have extension, webManager, logger)
+ */
+export function setupAuthStorageListener(context) {
+  const { extension, webManager, logger } = context;
+
+  // Check existing auth state on load and sign in
+  extension.storage.get('bxm:authState', (result) => {
+    const authState = result['bxm:authState'];
+
+    if (authState?.token) {
+      logger.log('[AUTH-SYNC] Found existing auth state, signing in...', authState.user?.email);
+      signInWithStoredToken(context, authState);
+    }
+  });
+
+  // Listen for WM auth state changes and sync to storage
+  // When user signs out via WM, clear storage so background.js knows
+  webManager.auth().listen((state) => {
+    if (!state.user) {
+      // User signed out - clear storage so all contexts sync
+      logger.log('[AUTH-SYNC] WM auth signed out, clearing storage...');
+      extension.storage.remove('bxm:authState');
+    }
+  });
+
+  // Listen for storage changes from background.js
+  // Note: BEM normalizes storage to sync or local, so we listen to all areas
+  extension.storage.onChanged.addListener((changes) => {
+    // Check for auth state change
+    const authChange = changes['bxm:authState'];
+    if (!authChange) {
+      return;
+    }
+
+    // Log
+    logger.log('[AUTH-SYNC] Auth state changed in storage:', authChange);
+
+    // Get the new auth state
+    const newAuthState = authChange.newValue;
+
+    // If auth state was cleared (signed out)
+    if (!newAuthState) {
+      logger.log('[AUTH-SYNC] Auth state cleared, signing out...');
+      webManager.auth().signOut();
+      return;
+    }
+
+    // Sign in with the new token
+    if (newAuthState?.token) {
+      signInWithStoredToken(context, newAuthState);
+    }
+  });
+
+  // Log
+  logger.log('Auth storage listener set up');
+}
+
+/**
+ * Open auth page in new tab (for signing in via website)
+ * @param {Object} context - The manager instance (must have extension, webManager, logger)
+ * @param {Object} options - Options object
+ * @param {string} options.path - Path to open (default: '/token')
+ * @param {string} options.authReturnUrl - Return URL for electron/deep links
+ */
+export function openAuthPage(context, options = {}) {
+  const { extension, webManager, logger } = context;
+
+  // Get auth domain from config
+  const authDomain = webManager.config?.firebase?.app?.config?.authDomain;
+
+  if (!authDomain) {
+    logger.error('No authDomain configured');
+    return;
+  }
+
+  // Build the URL
+  const path = options.path || '/token';
+  const authUrl = new URL(path, `https://${authDomain}`);
+
+  // Add return URL if provided (for electron/deep links)
+  if (options.authReturnUrl) {
+    authUrl.searchParams.set('authReturnUrl', options.authReturnUrl);
+  }
+
+  // Log
+  logger.log('Opening auth page:', authUrl.toString());
+
+  // Get current active tab so we can restore it after auth
+  extension.tabs.query({ active: true, currentWindow: true }, (tabs) => {
+    const authSourceTabId = tabs[0]?.id;
+
+    // Add source tab ID to URL so background can restore it
+    if (authSourceTabId) {
+      authUrl.searchParams.set('authSourceTabId', authSourceTabId);
+    }
+
+    // Open in new tab
+    extension.tabs.create({ url: authUrl.toString() });
+  });
+}
+
+/**
+ * Set up DOM event listeners for auth buttons (sign in, account)
+ * Uses event delegation so it works with dynamically rendered content
+ * @param {Object} context - The manager instance (must have extension, webManager, logger)
+ */
+export function setupAuthEventListeners(context) {
+  // Only set up once DOM is ready
+  if (typeof document === 'undefined') {
+    return;
+  }
+
+  // Sign in button (.auth-signin-btn) - opens auth page
+  document.addEventListener('click', (event) => {
+    const $signInBtn = event.target.closest('.auth-signin-btn');
+    if (!$signInBtn) {
+      return;
+    }
+
+    event.preventDefault();
+    event.stopPropagation();
+
+    openAuthPage(context);
+  });
+
+  // Account button (.auth-account-btn) - opens account page on website
+  document.addEventListener('click', (event) => {
+    const $accountBtn = event.target.closest('.auth-account-btn');
+    if (!$accountBtn) {
+      return;
+    }
+
+    event.preventDefault();
+    event.stopPropagation();
+
+    openAuthPage(context, { path: '/account' });
+  });
+
+  // Note: .auth-signout-btn is handled by web-manager's auth module
+  // BEM's storage listener will detect the sign-out via onAuthStateChanged in background.js
+  // If background hasn't initialized Firebase yet, stale storage is cleared on next auth attempt
+
+  // Log
+  context.logger.log('Auth event listeners set up');
+}

package/dist/lib/logger.js

@@ -1,5 +1,5 @@
 // Libraries
-const chalk = require('chalk');
+const chalk = require('chalk').default;
 
 // Logger class
 function Logger(name) {

package/dist/options.js

@@ -2,6 +2,7 @@
 import { Manager as WebManager } from 'web-manager';
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
+import { setupAuthStorageListener, setupAuthEventListeners, openAuthPage as openAuthPageHelper } from './lib/auth-helpers.js';
 
 // Import theme (exposes Bootstrap to window.bootstrap)
 import '__theme__/_theme.js';
@@ -29,12 +30,28 @@ class Manager {
     // Initialize
     await this.webManager.initialize(configuration);
 
+    // Set up auth state listener (updates bindings with user/account state)
+    this.webManager.auth().listen((state) => {
+      this.logger.log('Auth state changed:', state);
+    });
+
+    // Set up storage listener for cross-context auth sync
+    setupAuthStorageListener(this);
+
+    // Set up auth event listeners (sign in, account buttons)
+    setupAuthEventListeners(this);
+
     // Log
     this.logger.log('Initialized!', this);
 
     // Return manager instance
     return this;
   }
+
+  // Open auth page in new tab (for signing in via website)
+  openAuthPage(options = {}) {
+    openAuthPageHelper(this, options);
+  }
 }
 
 // Export

package/dist/page.js

@@ -2,6 +2,7 @@
 import { Manager as WebManager } from 'web-manager';
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
+import { setupAuthStorageListener, setupAuthEventListeners, openAuthPage as openAuthPageHelper } from './lib/auth-helpers.js';
 
 // Import theme (exposes Bootstrap to window.bootstrap)
 import '__theme__/_theme.js';
@@ -29,12 +30,28 @@ class Manager {
     // Initialize
     await this.webManager.initialize(configuration);
 
+    // Set up auth state listener (updates bindings with user/account state)
+    this.webManager.auth().listen((state) => {
+      this.logger.log('Auth state changed:', state);
+    });
+
+    // Set up storage listener for cross-context auth sync
+    setupAuthStorageListener(this);
+
+    // Set up auth event listeners (sign in, account buttons)
+    setupAuthEventListeners(this);
+
     // Log
     this.logger.log('Initialized!', this);
 
     // Return manager instance
     return this;
   }
+
+  // Open auth page in new tab (for signing in via website)
+  openAuthPage(options = {}) {
+    openAuthPageHelper(this, options);
+  }
 }
 
 // Export

package/dist/popup.js

@@ -2,6 +2,7 @@
 import { Manager as WebManager } from 'web-manager';
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
+import { setupAuthStorageListener, setupAuthEventListeners, openAuthPage as openAuthPageHelper } from './lib/auth-helpers.js';
 
 // Import theme (exposes Bootstrap to window.bootstrap)
 import '__theme__/_theme.js';
@@ -29,12 +30,28 @@ class Manager {
     // Initialize
     await this.webManager.initialize(configuration);
 
+    // Set up auth state listener (updates bindings with user/account state)
+    this.webManager.auth().listen((state) => {
+      this.logger.log('Auth state changed:', state);
+    });
+
+    // Set up storage listener for cross-context auth sync
+    setupAuthStorageListener(this);
+
+    // Set up auth event listeners (sign in, account buttons)
+    setupAuthEventListeners(this);
+
     // Log
     this.logger.log('Initialized!', this);
 
     // Return manager instance
     return this;
   }
+
+  // Open auth page in new tab (for signing in via website)
+  openAuthPage(options = {}) {
+    openAuthPageHelper(this, options);
+  }
 }
 
 // Export

package/dist/sidepanel.js

@@ -2,6 +2,7 @@
 import { Manager as WebManager } from 'web-manager';
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
+import { setupAuthStorageListener, setupAuthEventListeners, openAuthPage as openAuthPageHelper } from './lib/auth-helpers.js';
 
 // Import theme (exposes Bootstrap to window.bootstrap)
 import '__theme__/_theme.js';
@@ -29,12 +30,28 @@ class Manager {
     // Initialize
     await this.webManager.initialize(configuration);
 
+    // Set up auth state listener (updates bindings with user/account state)
+    this.webManager.auth().listen((state) => {
+      this.logger.log('Auth state changed:', state);
+    });
+
+    // Set up storage listener for cross-context auth sync
+    setupAuthStorageListener(this);
+
+    // Set up auth event listeners (sign in, account buttons)
+    setupAuthEventListeners(this);
+
     // Log
     this.logger.log('Initialized!', this);
 
     // Return manager instance
     return this;
   }
+
+  // Open auth page in new tab (for signing in via website)
+  openAuthPage(options = {}) {
+    openAuthPageHelper(this, options);
+  }
 }
 
 // Export