debug config option

Author: mdjastrzebski

src/__tests__/config.test.ts

@@ -14,9 +14,10 @@ test('configure() overrides existing config values', () => {
   configure({ defaultDebugOptions: { message: 'debug message' } });
   expect(getConfig()).toEqual({
     asyncUtilTimeout: 5000,
+    concurrentRoot: true,
+    debug: false,
     defaultDebugOptions: { message: 'debug message' },
     defaultIncludeHiddenElements: false,
-    concurrentRoot: true,
   });
 });
 

src/config.ts

@@ -19,6 +19,11 @@ export type Config = {
    * Otherwise `render` will default to concurrent rendering.
    */
   concurrentRoot: boolean;
+
+  /**
+   * Verbose logging for the library.
+   */
+  debug: boolean;
 };
 
 export type ConfigAliasOptions = {
@@ -30,6 +35,7 @@ const defaultConfig: Config = {
   asyncUtilTimeout: 1000,
   defaultIncludeHiddenElements: false,
   concurrentRoot: true,
+  debug: false,
 };
 
 let config = { ...defaultConfig };

src/fire-event.ts

@@ -10,7 +10,7 @@ import act from './act';
 import { isElementMounted, isHostElement } from './helpers/component-tree';
 import { formatElement } from './helpers/format-element';
 import { isHostScrollView, isHostTextInput } from './helpers/host-component-names';
-import { logger } from './helpers/logger';
+import { debugLogger } from './helpers/logger';
 import { isPointerEventEnabled } from './helpers/pointer-events';
 import { isEditableTextInput } from './helpers/text-input';
 import { nativeState } from './native-state';
@@ -102,7 +102,7 @@ function findEventHandler(
     if (handlerState.enabled) {
       return handler;
     } else {
-      logger.warn(
+      debugLogger.warn(
         `FireEvent: "${eventName}" event handler is disabled on ${formatElement(element, {
           compact: true,
         })} due to ${handlerState.reason}.`,
@@ -157,11 +157,12 @@ function fireEvent(element: ReactTestInstance, eventName: EventName, ...data: un
 
   const handler = findEventHandler(element, eventName);
   if (!handler) {
-    logger.warn(
+    debugLogger.warn(
       `FireEvent: no enabled event handler for "${eventName}" found on ${formatElement(element, {
         compact: true,
       })} or its ancestors.`,
     );
+
     return;
   }
 

src/helpers/logger.ts

@@ -2,6 +2,7 @@ import chalk from 'chalk';
 import * as nodeConsole from 'console';
 import redent from 'redent';
 import * as nodeUtil from 'util';
+import { getConfig } from '../config';
 
 export const logger = {
   debug(message: unknown, ...args: unknown[]) {
@@ -25,6 +26,32 @@ export const logger = {
   },
 };
 
+export const debugLogger = {
+  debug(message: unknown, ...args: unknown[]) {
+    if (getConfig().debug) {
+      logger.debug(message, ...args);
+    }
+  },
+
+  info(message: unknown, ...args: unknown[]) {
+    if (getConfig().debug) {
+      logger.info(message, ...args);
+    }
+  },
+
+  warn(message: unknown, ...args: unknown[]) {
+    if (getConfig().debug) {
+      logger.warn(message, ...args);
+    }
+  },
+
+  error(message: unknown, ...args: unknown[]) {
+    if (getConfig().debug) {
+      logger.error(message, ...args);
+    }
+  },
+};
+
 function formatMessage(symbol: string, message: unknown, ...args: unknown[]) {
   const formatted = nodeUtil.format(message, ...args);
   const indented = redent(formatted, 4);

src/user-event/utils/dispatch-event.ts

@@ -2,7 +2,7 @@ import type { ReactTestInstance } from 'react-test-renderer';
 import act from '../../act';
 import { isElementMounted } from '../../helpers/component-tree';
 import { formatElement } from '../../helpers/format-element';
-import { logger } from '../../helpers/logger';
+import { debugLogger } from '../../helpers/logger';
 
 /**
  * Basic dispatch event function used by User Event module.
@@ -18,9 +18,9 @@ export function dispatchEvent(element: ReactTestInstance, eventName: string, ...
 
   const handler = getEventHandler(element, eventName);
   if (!handler) {
-    logger.debug(
+    debugLogger.debug(
       `User Event: no event handler for "${eventName}" found on ${formatElement(element, {
-        minimal: true,
+        compact: true,
       })}`,
     );
     return;