Use path-browserify

packages/redux-devtools-inspector-monitor-trace-tab/package.json

@@ -31,6 +31,7 @@
     "@types/chrome": "^0.0.159",
     "anser": "^2.1.0",
     "html-entities": "^2.3.2",
+    "path-browserify": "^1.0.1",
     "redux-devtools-themes": "^1.0.0",
     "source-map": "^0.5.7"
   },

packages/redux-devtools-inspector-monitor-trace-tab/src/openFile.ts

@@ -88,7 +88,6 @@ function openInEditor(editor: string, path: string, stackFrame: StackFrame) {
       // sublime, emacs, macvim, textmate + custom like https://github.com/eclemens/atom-url-handler
       url = `${editor}://open/?url=file://${projectPath}${filePath}&line=${line}&column=${column}`;
   }
-  if (process.env.NODE_ENV === 'development') console.log(url); // eslint-disable-line no-console
   if (chrome.devtools && !isFF) {
     if (chrome.tabs) openAndCloseTab(url);
     else window.open(url);
@@ -102,9 +101,6 @@ export default function openFile(
   lineNumber: number,
   stackFrame: StackFrame
 ) {
-  if (process.env.NODE_ENV === 'development')
-    // eslint-disable-next-line no-console
-    console.log(fileName, lineNumber, stackFrame);
   if (!chrome || !chrome.storage) return; // TODO: Pass editor settings for using outside of browser extension
   const storage = isFF
     ? chrome.storage.local

packages/redux-devtools-inspector-monitor-trace-tab/src/path-browserify.ts

@@ -0,0 +1,150 @@
+declare module 'path-browserify' {
+  /**
+   * A parsed path object generated by path.parse() or consumed by path.format().
+   */
+  interface ParsedPath {
+    /**
+     * The root of the path such as '/' or 'c:\'
+     */
+    root: string;
+    /**
+     * The full directory path such as '/home/user/dir' or 'c:\path\dir'
+     */
+    dir: string;
+    /**
+     * The file name including extension (if any) such as 'index.html'
+     */
+    base: string;
+    /**
+     * The file extension (if any) such as '.html'
+     */
+    ext: string;
+    /**
+     * The file name without extension (if any) such as 'index'
+     */
+    name: string;
+  }
+  interface FormatInputPathObject {
+    /**
+     * The root of the path such as '/' or 'c:\'
+     */
+    root?: string | undefined;
+    /**
+     * The full directory path such as '/home/user/dir' or 'c:\path\dir'
+     */
+    dir?: string | undefined;
+    /**
+     * The file name including extension (if any) such as 'index.html'
+     */
+    base?: string | undefined;
+    /**
+     * The file extension (if any) such as '.html'
+     */
+    ext?: string | undefined;
+    /**
+     * The file name without extension (if any) such as 'index'
+     */
+    name?: string | undefined;
+  }
+  interface PlatformPath {
+    /**
+     * Normalize a string path, reducing '..' and '.' parts.
+     * When multiple slashes are found, they're replaced by a single one; when the path contains a trailing slash, it is preserved. On Windows backslashes are used.
+     *
+     * @param p string path to normalize.
+     */
+    normalize(p: string): string;
+    /**
+     * Join all arguments together and normalize the resulting path.
+     * Arguments must be strings. In v0.8, non-string arguments were silently ignored. In v0.10 and up, an exception is thrown.
+     *
+     * @param paths paths to join.
+     */
+    join(...paths: string[]): string;
+    /**
+     * The right-most parameter is considered {to}.  Other parameters are considered an array of {from}.
+     *
+     * Starting from leftmost {from} parameter, resolves {to} to an absolute path.
+     *
+     * If {to} isn't already absolute, {from} arguments are prepended in right to left order,
+     * until an absolute path is found. If after using all {from} paths still no absolute path is found,
+     * the current working directory is used as well. The resulting path is normalized,
+     * and trailing slashes are removed unless the path gets resolved to the root directory.
+     *
+     * @param pathSegments string paths to join.  Non-string arguments are ignored.
+     */
+    resolve(...pathSegments: string[]): string;
+    /**
+     * Determines whether {path} is an absolute path. An absolute path will always resolve to the same location, regardless of the working directory.
+     *
+     * @param path path to test.
+     */
+    isAbsolute(p: string): boolean;
+    /**
+     * Solve the relative path from {from} to {to}.
+     * At times we have two absolute paths, and we need to derive the relative path from one to the other. This is actually the reverse transform of path.resolve.
+     */
+    relative(from: string, to: string): string;
+    /**
+     * Return the directory name of a path. Similar to the Unix dirname command.
+     *
+     * @param p the path to evaluate.
+     */
+    dirname(p: string): string;
+    /**
+     * Return the last portion of a path. Similar to the Unix basename command.
+     * Often used to extract the file name from a fully qualified path.
+     *
+     * @param p the path to evaluate.
+     * @param ext optionally, an extension to remove from the result.
+     */
+    basename(p: string, ext?: string): string;
+    /**
+     * Return the extension of the path, from the last '.' to end of string in the last portion of the path.
+     * If there is no '.' in the last portion of the path or the first character of it is '.', then it returns an empty string
+     *
+     * @param p the path to evaluate.
+     */
+    extname(p: string): string;
+    /**
+     * The platform-specific file separator. '\\' or '/'.
+     */
+    readonly sep: string;
+    /**
+     * The platform-specific file delimiter. ';' or ':'.
+     */
+    readonly delimiter: string;
+    /**
+     * Returns an object from a path string - the opposite of format().
+     *
+     * @param pathString path to evaluate.
+     */
+    parse(p: string): ParsedPath;
+    /**
+     * Returns a path string from an object - the opposite of parse().
+     *
+     * @param pathString path to evaluate.
+     */
+    format(pP: FormatInputPathObject): string;
+    /**
+     * On Windows systems only, returns an equivalent namespace-prefixed path for the given path.
+     * If path is not a string, path will be returned without modifications.
+     * This method is meaningful only on Windows system.
+     * On POSIX systems, the method is non-operational and always returns path without modifications.
+     */
+    toNamespacedPath(path: string): string;
+    /**
+     * Posix specific pathing.
+     * Same as parent object on posix.
+     */
+    readonly posix: PlatformPath;
+    /**
+     * Windows specific pathing.
+     * Same as parent object on windows
+     */
+    readonly win32: PlatformPath;
+  }
+
+  const path: PlatformPath;
+  export = path;
+}

packages/redux-devtools-inspector-monitor-trace-tab/src/react-error-overlay/utils/unmapper.ts

@@ -8,7 +8,7 @@
 import StackFrame from './stack-frame';
 import { getSourceMap } from './getSourceMap';
 import { getLinesAround } from './getLinesAround';
-import path from 'path';
+import path from 'path-browserify';
 
 function count(search: string, string: string): number {
   // Count starts at -1 becuse a do-while loop always runs at least once

yarn.lock

@@ -4818,6 +4818,7 @@ __metadata:
     eslint-plugin-react: ^7.26.1
     html-entities: ^2.3.2
     jest: ^27.3.1
+    path-browserify: ^1.0.1
     react: ^16.14.0
     react-dom: ^16.14.0
     react-test-renderer: ^16.14.0