[FSSDK-12298] logger adjustment (#325)

Author: junaed-optimizely

src/client/createInstance.ts

@@ -16,6 +16,8 @@
 
 import { createInstance as jsCreateInstance } from '@optimizely/optimizely-sdk';
 import type { Config, Client } from '@optimizely/optimizely-sdk';
+import { REACT_LOGGER } from '../logger/createLogger';
+import type { ReactLogger } from '../logger/ReactLogger';
 
 export const CLIENT_ENGINE = 'react-sdk';
 export const CLIENT_VERSION = '4.0.0';
@@ -25,6 +27,7 @@ export const REACT_CLIENT_META = Symbol('react-client-meta');
 export interface ReactClientMeta {
   hasOdpManager: boolean;
   hasVuidManager: boolean;
+  logger?: ReactLogger;
 }
 
 /**
@@ -37,6 +40,13 @@ export interface ReactClientMeta {
  * @returns An OptimizelyClient instance with React SDK metadata
  */
 export function createInstance(config: Config): Client {
+  let reactLogger: ReactLogger | undefined;
+
+  if (config.logger) {
+    reactLogger = (config.logger as Record<symbol, unknown>)[REACT_LOGGER] as ReactLogger | undefined;
+    delete (config.logger as Record<symbol, unknown>)[REACT_LOGGER];
+  }
+
   const jsClient = jsCreateInstance({
     ...config,
     clientEngine: CLIENT_ENGINE,
@@ -48,6 +58,7 @@ export function createInstance(config: Config): Client {
   reactClient[REACT_CLIENT_META] = {
     hasOdpManager: !!config.odpManager,
     hasVuidManager: !!config.vuidManager,
+    logger: reactLogger,
   } satisfies ReactClientMeta;
 
   return reactClient;

src/client/index.ts

@@ -27,5 +27,4 @@ export {
   createOdpManager,
   createVuidManager,
   createErrorNotifier,
-  createLogger, // This will be removed later with logger implementation changes
 } from '@optimizely/optimizely-sdk';

src/index.ts

@@ -23,8 +23,8 @@ export {
   createOdpManager,
   createVuidManager,
   createErrorNotifier,
-  createLogger,
 } from './client/index';
+export { createLogger, DEBUG, ERROR, WARN, INFO } from './logger/index';
 
 export type * from '@optimizely/optimizely-sdk';
 

src/logger/ReactLogger.ts

@@ -0,0 +1,70 @@
+/**
+ * Copyright 2026, Optimizely
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { LogLevel } from '@optimizely/optimizely-sdk';
+import type { LogHandler } from '@optimizely/optimizely-sdk';
+
+export interface ReactLogger {
+  debug(message: string): void;
+  info(message: string): void;
+  warn(message: string): void;
+  error(message: string): void;
+}
+
+export interface ReactLoggerConfig {
+  logLevel: LogLevel;
+  logHandler?: LogHandler;
+}
+
+const LOG_PREFIX = '[OPTIMIZELY - REACT]';
+const defaultLogHandler: LogHandler = {
+  log(level: LogLevel, message: string): void {
+    switch (level) {
+      case LogLevel.Debug:
+        console.debug(message);
+        break;
+      case LogLevel.Info:
+        console.info(message);
+        break;
+      case LogLevel.Warn:
+        console.warn(message);
+        break;
+      case LogLevel.Error:
+        console.error(message);
+        break;
+    }
+  },
+};
+
+export function createReactLogger(config: ReactLoggerConfig): ReactLogger {
+  const handler = config.logHandler ?? defaultLogHandler;
+  const level = config.logLevel;
+
+  return {
+    debug: (msg) => {
+      if (level <= LogLevel.Debug) handler.log(LogLevel.Debug, `${LOG_PREFIX} - DEBUG ${msg}`);
+    },
+    info: (msg) => {
+      if (level <= LogLevel.Info) handler.log(LogLevel.Info, `${LOG_PREFIX} - INFO ${msg}`);
+    },
+    warn: (msg) => {
+      if (level <= LogLevel.Warn) handler.log(LogLevel.Warn, `${LOG_PREFIX} - WARN ${msg}`);
+    },
+    error: (msg) => {
+      if (level <= LogLevel.Error) handler.log(LogLevel.Error, `${LOG_PREFIX} - ERROR ${msg}`);
+    },
+  };
+}

src/logger/createLogger.spec.ts

@@ -0,0 +1,165 @@
+/**
+ * Copyright 2026, Optimizely
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { vi, describe, it, expect, beforeEach } from 'vitest';
+import { DEBUG, INFO, WARN, ERROR, LogLevel } from '@optimizely/optimizely-sdk';
+import type { LogHandler } from '@optimizely/optimizely-sdk';
+import { createReactLogger } from './ReactLogger';
+import type { ReactLogger } from './ReactLogger';
+
+const mockOpaqueLogger = vi.hoisted(() => ({ __opaque: true }));
+
+vi.mock('@optimizely/optimizely-sdk', async (importOriginal) => {
+  const original = await importOriginal<typeof import('@optimizely/optimizely-sdk')>();
+  return {
+    ...original,
+    createLogger: vi.fn().mockReturnValue(mockOpaqueLogger),
+  };
+});
+
+import { createLogger, REACT_LOGGER } from './createLogger';
+
+describe('createLogger', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('should return the opaque logger from the JS SDK', () => {
+    const result = createLogger({ level: INFO });
+    expect(result).toBe(mockOpaqueLogger);
+  });
+
+  it('should attach a ReactLogger via the REACT_LOGGER symbol', () => {
+    const mockHandler: LogHandler = { log: vi.fn() };
+    const result = createLogger({ level: INFO, logHandler: mockHandler });
+
+    const reactLogger = (result as Record<symbol, unknown>)[REACT_LOGGER] as ReactLogger;
+    expect(reactLogger).toBeDefined();
+    expect(reactLogger.debug).toBeTypeOf('function');
+    expect(reactLogger.info).toBeTypeOf('function');
+    expect(reactLogger.warn).toBeTypeOf('function');
+    expect(reactLogger.error).toBeTypeOf('function');
+  });
+
+  it('should create a ReactLogger that uses the provided logHandler', () => {
+    const mockHandler: LogHandler = { log: vi.fn() };
+    const result = createLogger({ level: INFO, logHandler: mockHandler });
+
+    const reactLogger = (result as Record<symbol, unknown>)[REACT_LOGGER] as ReactLogger;
+    reactLogger.info('hello');
+
+    expect(mockHandler.log).toHaveBeenCalledWith(LogLevel.Info, '[OPTIMIZELY - REACT] - INFO hello');
+  });
+
+  describe('log level resolution', () => {
+    it.each([
+      { preset: DEBUG, expectedCalls: 4, name: 'DEBUG' },
+      { preset: INFO, expectedCalls: 3, name: 'INFO' },
+      { preset: WARN, expectedCalls: 2, name: 'WARN' },
+      { preset: ERROR, expectedCalls: 1, name: 'ERROR' },
+    ])('should resolve $name preset correctly', ({ preset, expectedCalls }) => {
+      const mockHandler: LogHandler = { log: vi.fn() };
+      const result = createLogger({ level: preset, logHandler: mockHandler });
+
+      const reactLogger = (result as Record<symbol, unknown>)[REACT_LOGGER] as ReactLogger;
+      reactLogger.debug('d');
+      reactLogger.info('i');
+      reactLogger.warn('w');
+      reactLogger.error('e');
+      expect(mockHandler.log).toHaveBeenCalledTimes(expectedCalls);
+    });
+  });
+});
+
+describe('createReactLogger', () => {
+  describe('log level filtering', () => {
+    it('should filter messages below the configured level', () => {
+      const mockHandler: LogHandler = { log: vi.fn() };
+      const logger = createReactLogger({ logLevel: LogLevel.Warn, logHandler: mockHandler });
+
+      logger.debug('should not appear');
+      logger.info('should not appear');
+      logger.warn('should appear');
+      logger.error('should appear');
+
+      expect(mockHandler.log).toHaveBeenCalledTimes(2);
+      expect(mockHandler.log).toHaveBeenCalledWith(LogLevel.Warn, '[OPTIMIZELY - REACT] - WARN should appear');
+      expect(mockHandler.log).toHaveBeenCalledWith(LogLevel.Error, '[OPTIMIZELY - REACT] - ERROR should appear');
+    });
+
+    it('should allow all messages when level is Debug', () => {
+      const mockHandler: LogHandler = { log: vi.fn() };
+      const logger = createReactLogger({ logLevel: LogLevel.Debug, logHandler: mockHandler });
+
+      logger.debug('d');
+      logger.info('i');
+      logger.warn('w');
+      logger.error('e');
+
+      expect(mockHandler.log).toHaveBeenCalledTimes(4);
+    });
+
+    it('should only allow error messages when level is Error', () => {
+      const mockHandler: LogHandler = { log: vi.fn() };
+      const logger = createReactLogger({ logLevel: LogLevel.Error, logHandler: mockHandler });
+
+      logger.debug('d');
+      logger.info('i');
+      logger.warn('w');
+      logger.error('e');
+
+      expect(mockHandler.log).toHaveBeenCalledTimes(1);
+      expect(mockHandler.log).toHaveBeenCalledWith(LogLevel.Error, '[OPTIMIZELY - REACT] - ERROR e');
+    });
+  });
+
+  describe('log handler', () => {
+    it('should use the provided logHandler', () => {
+      const mockHandler: LogHandler = { log: vi.fn() };
+      const logger = createReactLogger({ logLevel: LogLevel.Info, logHandler: mockHandler });
+
+      logger.info('hello');
+
+      expect(mockHandler.log).toHaveBeenCalledWith(LogLevel.Info, '[OPTIMIZELY - REACT] - INFO hello');
+    });
+
+    it('should use default console handler when logHandler is not provided', () => {
+      const consoleSpy = vi.spyOn(console, 'info').mockImplementation(() => {});
+      const logger = createReactLogger({ logLevel: LogLevel.Info });
+
+      logger.info('hello');
+
+      expect(consoleSpy).toHaveBeenCalledWith('[OPTIMIZELY - REACT] - INFO hello');
+      consoleSpy.mockRestore();
+    });
+  });
+
+  describe('message prefix', () => {
+    it('should prepend [OPTIMIZELY - REACT] to all messages', () => {
+      const mockHandler: LogHandler = { log: vi.fn() };
+      const logger = createReactLogger({ logLevel: LogLevel.Debug, logHandler: mockHandler });
+
+      logger.debug('test');
+      logger.info('test');
+      logger.warn('test');
+      logger.error('test');
+
+      for (const call of (mockHandler.log as ReturnType<typeof vi.fn>).mock.calls) {
+        expect(call[1]).toMatch(/^\[OPTIMIZELY - REACT\] - (DEBUG|INFO|WARN|ERROR) /);
+      }
+    });
+  });
+});

src/logger/createLogger.ts

@@ -0,0 +1,39 @@
+/**
+ * Copyright 2026, Optimizely
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { createLogger as jsCreateLogger, LogLevel, DEBUG, INFO, WARN, ERROR } from '@optimizely/optimizely-sdk';
+import type { LoggerConfig, OpaqueLevelPreset } from '@optimizely/optimizely-sdk';
+import { createReactLogger } from './ReactLogger';
+
+export const REACT_LOGGER = Symbol('react-logger');
+
+function resolveLogLevel(preset: OpaqueLevelPreset): LogLevel {
+  if (preset === DEBUG) return LogLevel.Debug;
+  if (preset === INFO) return LogLevel.Info;
+  if (preset === WARN) return LogLevel.Warn;
+  if (preset === ERROR) return LogLevel.Error;
+  return LogLevel.Error;
+}
+
+export function createLogger(config: LoggerConfig) {
+  const opaqueLogger = jsCreateLogger(config);
+  const reactLogger = createReactLogger({
+    logLevel: resolveLogLevel(config.level),
+    logHandler: config.logHandler,
+  });
+  (opaqueLogger as Record<symbol, unknown>)[REACT_LOGGER] = reactLogger;
+  return opaqueLogger;
+}

src/logger/getReactLogger.ts

@@ -0,0 +1,30 @@
+/**
+ * Copyright 2026, Optimizely
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { Client } from '@optimizely/optimizely-sdk';
+import { REACT_CLIENT_META } from '../client/createInstance';
+import type { ReactClientMeta } from '../client/createInstance';
+import type { ReactLogger } from './ReactLogger';
+
+/**
+ * Returns the ReactLogger instance for the given client, or undefined
+ * if the client has no logger (e.g., logger was not created via the
+ * React SDK's createLogger wrapper).
+ */
+export function getReactLogger(client: Client): ReactLogger | undefined {
+  const meta = (client as unknown as Record<symbol, ReactClientMeta>)[REACT_CLIENT_META];
+  return meta.logger;
+}

src/logger/index.ts

@@ -0,0 +1,21 @@
+/**
+ * Copyright 2026, Optimizely
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export { createLogger } from './createLogger';
+export { getReactLogger } from './getReactLogger';
+export { createReactLogger } from './ReactLogger';
+export type { ReactLogger, ReactLoggerConfig } from './ReactLogger';
+export { ERROR, DEBUG, WARN, INFO } from '@optimizely/optimizely-sdk';