browser-extension-manager 1.2.3 → 1.2.4

package/CLAUDE.md

@@ -323,6 +323,105 @@ Manager.initialize().then(() => {
 **Storage normalization:**
 The wrapper automatically resolves `storage` to `storage.sync` if available, falling back to `storage.local`.
 
+**Auth Helpers:** [src/lib/auth-helpers.js](src/lib/auth-helpers.js)
+
+Provides cross-context auth synchronization and reusable auth UI event handlers.
+
+### Cross-Context Auth Architecture
+
+**Background.js is the source of truth** for authentication. Browser extensions have multiple isolated JavaScript contexts (background, popup, options, pages, sidepanel) - each runs its own Firebase instance. BEM solves this by:
+
+1. Background.js monitors for auth tokens via `tabs.onUpdated`
+2. When detected, background signs in Firebase and saves to `chrome.storage`
+3. Other contexts listen to storage changes and sync their Firebase instances
+
+**Sign-in Flow:**
+```
+User clicks .auth-signin-btn
+  → openAuthPage() opens https://{authDomain}/token?authSourceTabId=123
+  → Website authenticates, redirects to /token?authToken=xxx
+  → background.js tabs.onUpdated detects authDomain URL with authToken param
+  → background.js calls handleAuthToken():
+    → signInWithCustomToken(auth, token)
+    → Saves {token, user, timestamp} to storage key 'bxm:authState'
+    → Closes the /token tab
+    → Reactivates the original tab (authSourceTabId)
+  → Other contexts detect storage change via setupAuthStorageListener()
+  → Each context calls signInWithStoredToken() to sign in their Firebase
+```
+
+**Sign-out Flow:**
+```
+User clicks .auth-signout-btn
+  → Web Manager signs out Firebase locally
+  → setupAuthStorageListener() detects WM auth state change (user=null)
+  → Clears 'bxm:authState' from storage
+  → background.js setupAuthStorageListener() detects storage cleared
+  → background.js signs out its Firebase instance
+  → Other contexts detect storage cleared and sign out
+```
+
+**Key Implementation Details:**
+
+1. **Storage area**: BEM normalizes storage to `sync` (if available) or `local`. Auth listeners should NOT check `areaName` - just check for the `bxm:authState` key directly.
+
+2. **Firebase in service workers**: Static ES6 imports are required. Dynamic `import()` fails with webpack chunking in service workers.
+
+3. **Config path**: `authDomain` is at `config.firebase.app.config.authDomain` (loaded via BEM_BUILD_JSON).
+
+4. **Required permission**: `tabs` permission needed for `tabs.onUpdated` listener.
+
+**Functions:**
+- `setupAuthStorageListener(context)` - Listens for auth state changes from background.js AND monitors WM auth state to clear storage on sign-out
+- `setupAuthEventListeners(context)` - Sets up delegated click handlers for auth buttons
+- `openAuthPage(context, options)` - Opens auth page on the website with authSourceTabId for tab restoration
+
+**Auth Button CSS Classes:**
+
+Add these classes to your HTML elements to enable automatic auth handling:
+
+| Class | Description | Action |
+|-------|-------------|--------|
+| `.auth-signin-btn` | Sign in button | Opens `/token` page on website (authDomain) |
+| `.auth-signout-btn` | Sign out button | Handled by Web Manager (triggers storage sync via auth listener) |
+| `.auth-account-btn` | Account button | Opens `/account` page on website |
+
+**Example usage:**
+```html
+<!-- Sign In Button (shown when logged out) -->
+<button class="btn auth-signin-btn" data-wm-bind="@show !auth.user">
+  Sign In
+</button>
+
+<!-- Account Dropdown (shown when logged in) -->
+<div data-wm-bind="@show auth.user" hidden>
+  <a class="auth-account-btn" href="#">Account</a>
+  <button class="auth-signout-btn">Sign Out</button>
+</div>
+```
+
+**Reactive bindings:**
+- `data-wm-bind="@show auth.user"` - Show when logged in
+- `data-wm-bind="@show !auth.user"` - Show when logged out
+- `data-wm-bind="@text auth.user.displayName"` - Display user's name
+- `data-wm-bind="@text auth.user.email"` - Display user's email
+- `data-wm-bind="@attr src auth.user.photoURL"` - Set avatar image src
+
+**Storage Schema (`bxm:authState`):**
+```javascript
+{
+  token: "firebase-custom-token",  // Used by other contexts to sign in
+  user: {
+    uid: "...",
+    email: "...",
+    displayName: "...",
+    photoURL: "...",
+    emailVerified: true
+  },
+  timestamp: 1234567890
+}
+```
+
 **Logger:** [src/lib/logger.js](src/lib/logger.js)
 - Full logging utility
 - [src/lib/logger-lite.js](src/lib/logger-lite.js) for lightweight contexts
@@ -679,9 +778,14 @@ Manager.initialize().then(() => {
 
 **Utilities:**
 - [src/lib/extension.js](src/lib/extension.js) - Cross-browser API wrapper
+- [src/lib/auth-helpers.js](src/lib/auth-helpers.js) - Cross-context auth sync (see Auth Architecture section above)
 - [src/lib/logger.js](src/lib/logger.js) - Logging utility
 - [src/cli.js](src/cli.js) - CLI implementation
 
+**Auth System (Cross-Context):**
+- [src/background.js](src/background.js) - Source of truth for auth; `setupAuthTokenListener()`, `setupAuthStorageListener()`, `handleAuthToken()`
+- [src/lib/auth-helpers.js](src/lib/auth-helpers.js) - `setupAuthStorageListener()`, `openAuthPage()`, `setupAuthEventListeners()` for non-background contexts
+
 **CSS Framework:**
 - [src/assets/css/browser-extension-manager.scss](src/assets/css/browser-extension-manager.scss) - Main entry
 - [src/assets/css/core/](src/assets/css/core/) - Core styles

package/README.md

@@ -86,6 +86,115 @@ EDGE_API_KEY="your-api-key"
 
 Only stores with configured credentials will be published to.
 
+## 🔐 Authentication
+
+BEM provides built-in authentication support that syncs across all extension contexts (popup, options, pages, sidepanel, background).
+
+### Auth Architecture Overview
+
+**Background.js is the source of truth** for authentication state. When a user signs in via the website, the auth token flows through background.js to all other contexts via `chrome.storage`.
+
+```
+┌─────────────────────────────────────────────────────────────────────────┐
+│                         SIGN-IN FLOW                                    │
+├─────────────────────────────────────────────────────────────────────────┤
+│  1. User clicks .auth-signin-btn in any context                         │
+│  2. Extension opens https://{authDomain}/token?authSourceTabId=123      │
+│  3. Website authenticates user, redirects to /token?authToken=xxx       │
+│  4. Background.js detects URL via tabs.onUpdated listener               │
+│  5. Background signs in Firebase with custom token                      │
+│  6. Background saves auth state to chrome.storage (bxm:authState)       │
+│  7. Background closes /token tab and reactivates original tab           │
+│  8. Other contexts detect storage change and sign in their Firebase     │
+└─────────────────────────────────────────────────────────────────────────┘
+
+┌─────────────────────────────────────────────────────────────────────────┐
+│                         SIGN-OUT FLOW                                   │
+├─────────────────────────────────────────────────────────────────────────┤
+│  1. User clicks .auth-signout-btn in any context                        │
+│  2. Web Manager signs out Firebase locally                              │
+│  3. Auth helper detects WM auth change, clears bxm:authState storage    │
+│  4. Background.js detects storage cleared, signs out its Firebase       │
+│  5. Other contexts detect storage change and sign out                   │
+└─────────────────────────────────────────────────────────────────────────┘
+```
+
+### Required Configuration
+
+Add `authDomain` to your Firebase config in `config/browser-extension-manager.json`:
+
+```json
+{
+  "firebaseConfig": {
+    "apiKey": "...",
+    "authDomain": "your-app.firebaseapp.com",
+    "projectId": "..."
+  }
+}
+```
+
+### Required Permission
+
+Add the `tabs` permission to your `src/manifest.json`:
+
+```json
+{
+  "permissions": ["tabs"]
+}
+```
+
+This is required for background.js to monitor tab URL changes and detect auth tokens.
+
+### Auth Button Classes
+
+Add these classes to your HTML elements to enable automatic auth handling:
+
+| Class | Description | Action |
+|-------|-------------|--------|
+| `.auth-signin-btn` | Sign in button | Opens `/token` page on website |
+| `.auth-signout-btn` | Sign out button | Signs out via Web Manager (which triggers storage sync) |
+| `.auth-account-btn` | Account button | Opens `/account` page on website |
+
+### Example
+```html
+<!-- Sign In Button (shown when logged out) -->
+<button class="btn auth-signin-btn" data-wm-bind="@show !auth.user">
+  Sign In
+</button>
+
+<!-- Account Section (shown when logged in) -->
+<div data-wm-bind="@show auth.user" hidden>
+  <span data-wm-bind="@text auth.user.displayName">User</span>
+  <a class="auth-account-btn" href="#">Account</a>
+  <button class="auth-signout-btn">Sign Out</button>
+</div>
+```
+
+### Reactive Bindings
+- `data-wm-bind="@show auth.user"` - Show when logged in
+- `data-wm-bind="@show !auth.user"` - Show when logged out
+- `data-wm-bind="@text auth.user.displayName"` - Display user's name
+- `data-wm-bind="@text auth.user.email"` - Display user's email
+- `data-wm-bind="@attr src auth.user.photoURL"` - Set avatar image src
+
+### Storage Key
+
+Auth state is stored in `chrome.storage` under the key `bxm:authState`:
+
+```javascript
+{
+  token: "firebase-custom-token",
+  user: {
+    uid: "...",
+    email: "...",
+    displayName: "...",
+    photoURL: "...",
+    emailVerified: true
+  },
+  timestamp: 1234567890
+}
+```
+
 <!-- ## ⛳️ Flags
 * `--test=false` - Coming soon
 ```bash

package/dist/assets/themes/classy/css/base/_utilities.scss

@@ -1,57 +1,6 @@
 // Classy Utility Classes
 // Custom helper classes and theme-specific utilities
 
-// ============================================
-// Section Spacing
-// ============================================
-
-// Section Spacing
-// .section {
-//   padding: $classy-spacing-4xl 0;
-
-//   &.section-sm {
-//     padding: $classy-spacing-2xl 0;
-//   }
-
-//   &.section-lg {
-//     padding: 6rem 0;
-//   }
-
-//   &.section-xl {
-//     padding: 8rem 0;
-//   }
-// }
-
-// Hero Sections
-// .hero {
-//   padding: 6rem 0;
-//   position: relative;
-//   overflow: hidden;
-
-//   &.hero-gradient {
-//     background: $classy-gradient-primary;
-//   }
-
-//   &.hero-pattern {
-//     &::before {
-//       content: "";
-//       position: absolute;
-//       top: 0;
-//       left: 0;
-//       right: 0;
-//       bottom: 0;
-//       background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%235B47FB' fill-opacity='0.1'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
-//       opacity: 0.1;
-//       z-index: 0;
-//     }
-//   }
-
-//   .hero-content {
-//     position: relative;
-//     z-index: 1;
-//   }
-// }
-
 // ============================================
 // Shadow Utilities
 // ============================================

package/dist/assets/themes/classy/css/components/_text.scss

@@ -39,3 +39,14 @@
 [data-bs-theme="dark"] .text-adaptive {
   @extend .text-dark;
 }
+
+// ============================================
+// Text Decoration Utilities
+// ============================================
+.text-decoration-dotted {
+  text-decoration-style: dotted !important;
+}
+
+.text-decoration-dashed {
+  text-decoration-style: dashed !important;
+}

package/dist/background.js

@@ -2,23 +2,22 @@
 import extension from './lib/extension.js';
 import LoggerLite from './lib/logger-lite.js';
 
+// Firebase (static imports - dynamic import() doesn't work in service workers with webpack chunking)
+import { initializeApp, getApp } from 'firebase/app';
+import { getAuth, signInWithCustomToken, onAuthStateChanged } from 'firebase/auth';
+
 // Variables
 const serviceWorker = self;
 
 // Import build config at the top level (synchronous)
 importScripts('/build.js');
 
-// ⚠️⚠️⚠️ CRITICAL: Setup global listeners BEFORE importing Firebase ⚠️⚠️⚠️
+// ⚠️⚠️⚠️ CRITICAL: Setup global listeners BEFORE any async operations ⚠️⚠️⚠️
 // https://stackoverflow.com/questions/78270541/cant-catch-fcm-notificationclick-event-in-service-worker-using-firebase-messa
+// Note: ES6 static imports above are fine - they're hoisted and bundled by webpack.
+// The issue is with importScripts() calls which must be synchronous at top-level.
 setupGlobalHandlers();
 
-// Import Firebase libraries at the top level (before any async operations)
-// ⚠️ importScripts MUST be called at top-level (synchronously) - it cannot be called inside functions or after async operations
-// importScripts(
-//   'https://www.gstatic.com/firebasejs/%%% firebaseVersion %%%/firebase-app-compat.js',
-//   'https://www.gstatic.com/firebasejs/%%% firebaseVersion %%%/firebase-messaging-compat.js',
-// );
-
 // Class
 class Manager {
   constructor() {
@@ -36,7 +35,8 @@ class Manager {
     this.app = this.config?.app?.id || 'extension';
     this.environment = this.config?.bem?.environment || 'production';
     this.libraries = {
-      firebase: false,
+      firebase: null,
+      firebaseAuth: null,
       messaging: false,
       promoServer: false,
     };
@@ -62,6 +62,12 @@ class Manager {
     // Initialize Firebase
     this.initializeFirebase();
 
+    // Setup auth token listener (for cross-runtime auth)
+    this.setupAuthTokenListener();
+
+    // Setup auth storage listener (detect sign-out from pages)
+    this.setupAuthStorageListener();
+
     // Setup livereload
     this.setupLiveReload();
 
@@ -170,6 +176,211 @@ class Manager {
       .catch(error => this.logger.error('Failed to cache resources:', error));
   }
 
+  // Setup auth token listener (monitors tabs for auth tokens from website)
+  setupAuthTokenListener() {
+    // DEBUG: Log the full config to see what we have
+    console.log('[AUTH] setupAuthTokenListener called');
+    console.log('[AUTH] this.config:', this.config);
+    console.log('[AUTH] BEM_BUILD_JSON:', serviceWorker.BEM_BUILD_JSON);
+
+    // Get auth domain from config
+    // Structure is: this.config.firebase.app.config.authDomain
+    const authDomain = this.config?.firebase?.app?.config?.authDomain;
+
+    // Log config for debugging
+    this.logger.log('[AUTH] Config paths:', {
+      firebase_path: this.config?.firebase?.app?.config?.authDomain,
+      resolved: authDomain,
+    });
+
+    // Skip if no auth domain configured
+    if (!authDomain) {
+      this.logger.log('[AUTH] No authDomain configured, skipping auth token listener');
+      return;
+    }
+
+    // Log
+    this.logger.log(`[AUTH] Setting up auth token listener for domain: ${authDomain}`);
+
+    // Listen for tab URL changes
+    this.extension.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
+      // Only process when URL changes and is complete
+      if (changeInfo.status !== 'complete' || !tab.url) {
+        return;
+      }
+
+      // Parse the URL
+      let tabUrl;
+      try {
+        tabUrl = new URL(tab.url);
+      } catch (e) {
+        return;
+      }
+
+      // Log every tab update for auth domain matching
+      this.logger.log(`[AUTH] Tab updated: ${tabUrl.hostname} (looking for: ${authDomain})`);
+
+      // Check if this is our auth domain
+      if (tabUrl.hostname !== authDomain) {
+        return;
+      }
+
+      // Log - we found our domain
+      this.logger.log(`[AUTH] Auth domain matched! Checking for authToken param...`);
+
+      // Check for authToken param
+      const authToken = tabUrl.searchParams.get('authToken');
+      if (!authToken) {
+        this.logger.log(`[AUTH] No authToken param found in URL: ${tabUrl.href}`);
+        return;
+      }
+
+      // Get source tab ID to restore after auth
+      const authSourceTabId = tabUrl.searchParams.get('authSourceTabId');
+
+      // Log
+      this.logger.log('[AUTH] Auth token detected in tab:', tabId);
+
+      // Handle the auth token
+      this.handleAuthToken(authToken, tabId, authSourceTabId ? parseInt(authSourceTabId, 10) : null);
+    });
+  }
+
+  // Setup auth storage listener (detect sign-out from pages)
+  setupAuthStorageListener() {
+    this.extension.storage.onChanged.addListener((changes) => {
+      const authChange = changes['bxm:authState'];
+      if (!authChange) {
+        return;
+      }
+
+      this.logger.log('[AUTH] Storage auth state changed:', authChange.newValue ? 'signed in' : 'signed out');
+
+      // If storage was cleared (sign-out from a page) and we have Firebase initialized, sign out
+      if (!authChange.newValue && this.libraries.firebaseAuth) {
+        this.logger.log('[AUTH] Signing out background Firebase...');
+        this.libraries.firebaseAuth.signOut();
+      }
+    });
+
+    this.logger.log('[AUTH] Auth storage listener set up');
+  }
+
+  // Get or initialize Firebase auth (reuse existing instance)
+  getFirebaseAuth() {
+    // Return existing instance if available
+    if (this.libraries.firebaseAuth) {
+      return this.libraries.firebaseAuth;
+    }
+
+    // Get Firebase config
+    const firebaseConfig = this.config?.firebase?.app?.config;
+    if (!firebaseConfig) {
+      throw new Error('Firebase config not available');
+    }
+
+    // Try to get existing app or create new one
+    try {
+      this.libraries.firebase = getApp('bxm-auth');
+    } catch (e) {
+      this.libraries.firebase = initializeApp(firebaseConfig, 'bxm-auth');
+    }
+
+    // Get auth and set up state listener (only once)
+    this.libraries.firebaseAuth = getAuth(this.libraries.firebase);
+
+    // Set up auth state change listener (background is source of truth)
+    onAuthStateChanged(this.libraries.firebaseAuth, (user) => {
+      this.handleAuthStateChange(user);
+    });
+
+    return this.libraries.firebaseAuth;
+  }
+
+  // Handle Firebase auth state changes (source of truth for all contexts)
+  async handleAuthStateChange(user) {
+    this.logger.log('[AUTH] Auth state changed:', user?.email || 'signed out');
+
+    if (user) {
+      // User is signed in - get current stored state to preserve token
+      const result = await new Promise(resolve =>
+        this.extension.storage.get('bxm:authState', resolve)
+      );
+      const currentState = result['bxm:authState'] || {};
+
+      // Update auth state with current user info
+      const authState = {
+        token: currentState.token, // Preserve existing token
+        user: {
+          uid: user.uid,
+          email: user.email,
+          displayName: user.displayName,
+          photoURL: user.photoURL,
+          emailVerified: user.emailVerified,
+        },
+        timestamp: Date.now(),
+      };
+
+      await this.extension.storage.set({ 'bxm:authState': authState });
+      this.logger.log('[AUTH] Auth state synced to storage');
+    } else {
+      // User is signed out - clear storage
+      await this.extension.storage.remove('bxm:authState');
+      this.logger.log('[AUTH] Auth state cleared from storage');
+    }
+  }
+
+  // Handle auth token from website
+  async handleAuthToken(token, tabId, authSourceTabId = null) {
+    try {
+      // Log
+      this.logger.log('[AUTH] Processing auth token...');
+
+      // Get or initialize Firebase auth
+      const auth = this.getFirebaseAuth();
+
+      // Sign in with custom token
+      this.logger.log('[AUTH] Calling signInWithCustomToken...');
+      const userCredential = await signInWithCustomToken(auth, token);
+      const user = userCredential.user;
+
+      // Log
+      this.logger.log('[AUTH] Signed in successfully:', user.email);
+
+      // Save token to storage (user state will be synced by onAuthStateChanged)
+      const result = await new Promise(resolve =>
+        this.extension.storage.get('bxm:authState', resolve)
+      );
+      const currentState = result['bxm:authState'] || {};
+
+      await this.extension.storage.set({
+        'bxm:authState': {
+          ...currentState,
+          token: token,
+          timestamp: Date.now(),
+        }
+      });
+
+      // Close the auth tab
+      await this.extension.tabs.remove(tabId);
+      this.logger.log('[AUTH] Auth tab closed');
+
+      // Reactivate the source tab if provided
+      if (authSourceTabId) {
+        try {
+          await this.extension.tabs.update(authSourceTabId, { active: true });
+          this.logger.log('[AUTH] Restored source tab:', authSourceTabId);
+        } catch (e) {
+          // Tab may have been closed, ignore
+          this.logger.log('[AUTH] Could not restore source tab (may be closed):', authSourceTabId);
+        }
+      }
+
+    } catch (error) {
+      this.logger.error('[AUTH] Error handling auth token:', error);
+    }
+  }
+
   // Setup livereload
   setupLiveReload() {
     // Quit if not in dev mode

package/dist/defaults/_.env

@@ -18,5 +18,9 @@ EDGE_PRODUCT_ID="your-product-id"
 EDGE_CLIENT_ID="your-client-id"
 EDGE_API_KEY="your-api-key"
 
+# Opera Add-ons
+# NOTE: Opera does not have a publishing API. Extensions must be submitted manually at:
+# https://addons.opera.com/developer/
+
 # ========== Custom Values ==========
 # ...

package/dist/defaults/config/browser-extension-manager.json

@@ -1,11 +1,9 @@
 {
-  app: {
-    id: 'ultimate-jekyll',
-  },
   theme: {
     id: 'classy',
   },
   brand: {
+    id: 'ultimate-jekyll',
     name: 'Ultimate Jekyll',
     url: 'https://ultimate-jekyll.itwcreativeworks.com',
     contact: {
@@ -25,13 +23,13 @@
     secret: '',
   },
   firebaseConfig: {
-    apiKey: 'AIzaSyDzy5BG9-i9RmymyFx6mfwSgaRioyfa0Cc',
-    authDomain: 'ultimate-jekyll.itwcreativeworks.com',
-    databaseURL: 'https://ultimate-jekyll.firebaseio.com',
-    projectId: 'ultimate-jekyll',
-    storageBucket: 'ultimate-jekyll.appspot.com',
-    messagingSenderId: '837186164890',
-    appId: '1:837186164890:web:f1f59569d661078c',
-    measurementId: 'G-FR3X7X4KYN',
+    apiKey: 'AIzaSyD1MvM-EQC_eVWqaTe5ImWALwhBr7iXgh8',
+    authDomain: 'universal-auth.itwcreativeworks.com',
+    databaseURL: 'https://itwcw-universal-auth.firebaseio.com',
+    projectId: 'itwcw-universal-auth',
+    storageBucket: 'itwcw-universal-auth.appspot.com',
+    messagingSenderId: '195162582358',
+    appId: '1:195162582358:web:6f9320c516d9ab4838baf7',
+    measurementId: 'G-W08HGRW4S',
   },
 }

package/dist/gulp/main.js

@@ -9,6 +9,10 @@ const glob = require('glob').globSync;
 // Load package
 const package = Manager.getPackage('main');
 const project = Manager.getPackage('project');
+const projectRoot = Manager.getRootPath('project');
+
+// Load .env file from project root
+require('dotenv').config({ path: path.join(projectRoot, '.env') });
 
 // Log
 logger.log('Starting...', argv);

package/dist/gulp/tasks/audit.js

@@ -4,7 +4,7 @@ const logger = Manager.logger('audit');
 const path = require('path');
 const jetpack = require('fs-jetpack');
 const { series } = require('gulp');
-const chalk = require('chalk');
+const chalk = require('chalk').default;
 
 // Load package
 const package = Manager.getPackage('main');

package/dist/gulp/tasks/defaults.js

@@ -18,6 +18,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';
+
 // Get clean versions
 // const cleanVersions = { versions: Manager.getCleanVersions()};
 const cleanVersions = { versions: package.engines };
@@ -434,7 +437,11 @@ function customTransform() {
 
     // Skip if instructed
     if (options.skip || (!options.overwrite && exists && !options.merge && !options.mergeLines)) {
-      logger.log(`Skipping file: ${relativePath}`);
+      // Log if loud is enabled
+      if (LOUD) {
+        logger.log(`Skipping file: ${relativePath}`);
+      }
+
       return callback();
     }