Initialize App Check debug mode in initializeAppCheck

packages/app-check/src/api.test.ts

@@ -38,10 +38,12 @@ import * as logger from './logger';
 import * as client from './client';
 import * as storage from './storage';
 import * as internalApi from './internal-api';
+import * as indexeddb from './indexeddb';
 import { deleteApp, FirebaseApp } from '@firebase/app';
 import { CustomProvider, ReCaptchaV3Provider } from './providers';
 import { AppCheckService } from './factory';
 import { AppCheckToken } from './public-types';
+import { getDebugToken } from './debug';
 
 describe('api', () => {
   let app: FirebaseApp;
@@ -118,6 +120,40 @@ describe('api', () => {
         })
       ).to.equal(appCheckInstance);
     });
+    it('starts debug mode on first call', async () => {
+      let token: string = '';
+      const fakeWrite = (tokenToWrite: string): Promise<void> => {
+        token = tokenToWrite;
+        return Promise.resolve();
+      };
+      stub(indexeddb, 'writeDebugTokenToIndexedDB').callsFake(fakeWrite);
+      stub(indexeddb, 'readDebugTokenFromIndexedDB').resolves(token);
+      const consoleStub = stub(console, 'log');
+      self.FIREBASE_APPCHECK_DEBUG_TOKEN = true;
+      initializeAppCheck(app, {
+        provider: new ReCaptchaV3Provider(FAKE_SITE_KEY)
+      });
+      // Ensure getDebugToken() call inside `initializeAppCheck()`
+      // has time to resolve, and double check its value matches that
+      // written to indexedDB.
+      expect(await getDebugToken()).to.equal(token);
+      expect(consoleStub.args[0][0]).to.include(token);
+      self.FIREBASE_APPCHECK_DEBUG_TOKEN = undefined;
+    });
+    it('warns about debug mode on second call', async () => {
+      self.FIREBASE_APPCHECK_DEBUG_TOKEN = 'abcdefg';
+      const consoleStub = stub(console, 'log');
+      initializeAppCheck(app, {
+        provider: new ReCaptchaV3Provider(FAKE_SITE_KEY)
+      });
+      initializeAppCheck(app, {
+        provider: new ReCaptchaV3Provider(FAKE_SITE_KEY)
+      });
+      const token = await getDebugToken();
+      expect(token).to.equal('abcdefg');
+      expect(consoleStub.args[0][0]).to.include(token);
+      self.FIREBASE_APPCHECK_DEBUG_TOKEN = undefined;
+    });
 
     it('initialize reCAPTCHA when a ReCaptchaV3Provider is provided', () => {
       const initReCAPTCHAStub = stub(reCAPTCHA, 'initialize').returns(

packages/app-check/src/api.ts

@@ -23,7 +23,7 @@ import {
   PartialObserver
 } from './public-types';
 import { ERROR_FACTORY, AppCheckError } from './errors';
-import { getState, setState, AppCheckState } from './state';
+import { getState, setState, AppCheckState, getDebugState } from './state';
 import { FirebaseApp, getApp, _getProvider } from '@firebase/app';
 import { getModularInstance, ErrorFn, NextFn } from '@firebase/util';
 import { AppCheckService } from './factory';
@@ -35,6 +35,7 @@ import {
   isValid
 } from './internal-api';
 import { readTokenFromStorage } from './storage';
+import { getDebugToken, initializeDebugMode, isDebugMode } from './debug';
 
 declare module '@firebase/component' {
   interface NameServiceMapping {
@@ -57,6 +58,23 @@ export function initializeAppCheck(
   app = getModularInstance(app);
   const provider = _getProvider(app, 'app-check');
 
+  // Ensure initializeDebugMode() is only called once.
+  if (!getDebugState().initialized) {
+    initializeDebugMode();
+  }
+
+  // Log a warning when `initializeAppCheck()` is called in debug mode,
+  // and show the token.
+  if (isDebugMode()) {
+    // Do not block initialization to get the token for the message.
+    void getDebugToken().then(token =>
+      // Not using logger because I don't think we ever want this accidentally hidden.
+      console.log(
+        `App Check debug token: ${token}. You will need to add it to your app's App Check settings in the Firebase console for it to work.`
+      )
+    );
+  }
+
   if (provider.isInitialized()) {
     const existingInstance = provider.getImmediate();
     const initialOptions = provider.getOptions() as unknown as AppCheckOptions;

packages/app-check/src/index.ts

@@ -28,7 +28,6 @@ import {
 } from '@firebase/component';
 import { _AppCheckComponentName } from './public-types';
 import { factory, internalFactory } from './factory';
-import { initializeDebugMode } from './debug';
 import { _AppCheckInternalComponentName } from './types';
 import { name, version } from '../package.json';
 
@@ -82,4 +81,3 @@ function registerAppCheck(): void {
 }
 
 registerAppCheck();
-initializeDebugMode();

packages/app-check/src/state.ts

@@ -41,6 +41,7 @@ export interface ReCAPTCHAState {
 }
 
 export interface DebugState {
+  initialized: boolean;
   enabled: boolean;
   token?: Deferred<string>;
 }
@@ -52,6 +53,7 @@ export const DEFAULT_STATE: AppCheckState = {
 };
 
 const DEBUG_STATE: DebugState = {
+  initialized: false,
   enabled: false
 };
 

packages/app-check/src/storage.ts

@@ -87,10 +87,6 @@ export async function readOrCreateDebugTokenFromStorage(): Promise<string> {
     writeDebugTokenToIndexedDB(newToken).catch(e =>
       logger.warn(`Failed to persist debug token to IndexedDB. Error: ${e}`)
     );
-    // Not using logger because I don't think we ever want this accidentally hidden?
-    console.log(
-      `App Check debug token: ${newToken}. You will need to add it to your app's App Check settings in the Firebase console for it to work`
-    );
     return newToken;
   } else {
     return existingDebugToken;