chore: create new debug module (#6028)

* chore: create new Debug module

This debug module can be used in either Node or the browser. We'll use
the `debug` module in Node land, but fallback to a simple `console.log`
solution when in the browser in an attempt to keep our browser bundle
size down.

* Use our debug wrapper rather than Node's `debug`.

src/BrowserFetcher.ts

@@ -23,7 +23,7 @@ import * as https from 'https';
 import * as http from 'http';
 
 import extractZip from 'extract-zip';
-import debug from 'debug';
+import { debug } from './Debug';
 import removeRecursive from 'rimraf';
 import * as URL from 'url';
 import ProxyAgent from 'https-proxy-agent';

src/Connection.ts

@@ -15,7 +15,7 @@
  */
 import { assert } from './assert';
 import { Events } from './Events';
-import debug from 'debug';
+import { debug } from './Debug';
 const debugProtocolSend = debug('puppeteer:protocol:SEND ►');
 const debugProtocolReceive = debug('puppeteer:protocol:RECV ◀');
 

src/Debug.ts

@@ -0,0 +1,44 @@
+/**
+ * Copyright 2020 Google Inc. All rights reserved.
+ *
+ * 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
+ *
+ *     http://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.
+ */
+
+const isNodeEnv = typeof document === 'undefined';
+
+/**
+ * A debug function that can be used in any environment.
+ *
+ * If used in Node, it falls back to the {@link https://www.npmjs.com/package/debug | debug module}.
+ * In the browser it uses `console.log`.
+ *
+ * @param prefix - this will be prefixed to each log.
+ * @returns a function that can be called to log to that debug channel.
+ *
+ * @example
+ * ```
+ * const log = debug('Page');
+ *
+ * log('new page created')
+ * // logs "Page: new page created"
+ * ```
+ */
+export const debug = (prefix: string): ((...args: unknown[]) => void) => {
+  if (isNodeEnv) {
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    return require('debug')(prefix);
+  }
+
+  // eslint-disable-next-line no-console
+  return (...logArgs: unknown[]): void => console.log(`${prefix}:`, ...logArgs);
+};

src/helper.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import { TimeoutError } from './Errors';
-import debug from 'debug';
+import { debug } from './Debug';
 import * as fs from 'fs';
 import { CDPSession } from './Connection';
 import { promisify } from 'util';

src/launcher/BrowserRunner.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import debug from 'debug';
+import { debug } from '../Debug';
 
 import removeFolder from 'rimraf';
 import * as childProcess from 'child_process';