fix: Support browser overrides in package.json (#424)

`browser` section `package.json` is used to expand a list of dependent
files. The downstream build tool would normally do the right thing and
use the `browser` section for bundling correctly. I tested the bundling
itself on esbuild and WebPack, and it works correctly. All that's needed
is to make sure the files are there.

package.json

@@ -42,6 +42,7 @@
     "@ffmpeg-installer/ffmpeg": "^1.1.0",
     "@google-cloud/bigquery": "^4.1.4",
     "@google-cloud/firestore": "^7.6.0",
+    "@opentelemetry/api": "^1.7.0",
     "@sentry/node": "^5.5.0",
     "@tpluscode/sparql-builder": "^0.3.12",
     "@types/bindings": "^1.3.0",

src/node-file-trace.ts

@@ -68,6 +68,7 @@ export class Job {
   public warnings: Set<Error>;
   public reasons: NodeFileTraceReasons = new Map();
   private cachedFileSystem: CachedFileSystem;
+  private remappings: Map<string, Set<string>> = new Map();
 
   constructor({
     base = process.cwd(),
@@ -154,6 +155,16 @@ export class Job {
     this.warnings = new Set();
   }
 
+  addRemapping(path: string, dep: string) {
+    if (path === dep) return;
+    let deps = this.remappings.get(path);
+    if (!deps) {
+      deps = new Set();
+      this.remappings.set(path, deps);
+    }
+    deps.add(dep);
+  }
+
   async readlink(path: string) {
     return this.cachedFileSystem.readlink(path);
   }
@@ -316,6 +327,14 @@ export class Job {
     }
     this.processed.add(path);
 
+    // Additional dependencies.
+    const additionalDeps = this.remappings.get(path);
+    if (additionalDeps) {
+      await Promise.all(
+        [...additionalDeps].map(async (dep) => this.emitDependency(dep, path)),
+      );
+    }
+
     const emitted = await this.emitFile(path, 'dependency', parent);
     if (!emitted) return;
     if (path.endsWith('.json')) return;

src/resolve-dependency.ts

@@ -128,6 +128,7 @@ interface PkgCfg {
   main: string | undefined;
   exports: PackageTarget;
   imports: { [key: string]: PackageTarget };
+  browser?: string | { [key: string]: string };
 }
 
 async function getPkgCfg(
@@ -250,6 +251,33 @@ function resolveExportsImports(
   return undefined;
 }
 
+async function resolveRemappings(
+  pkgPath: string,
+  pkgCfg: PkgCfg,
+  parent: string,
+  job: Job,
+): Promise<void> {
+  if (job.conditions?.includes('browser')) {
+    const { browser: pkgBrowser } = pkgCfg;
+    if (typeof pkgBrowser === 'object') {
+      for (const [key, value] of Object.entries(pkgBrowser)) {
+        if (!key.startsWith('./') || !value.startsWith('./')) {
+          continue;
+        }
+        const keyResolved = await resolveFile(pkgPath + sep + key, parent, job);
+        const valueResolved = await resolveFile(
+          pkgPath + sep + value,
+          parent,
+          job,
+        );
+        if (keyResolved && valueResolved) {
+          job.addRemapping(keyResolved, valueResolved);
+        }
+      }
+    }
+  }
+}
+
 async function packageImportsResolve(
   name: string,
   parent: string,
@@ -355,6 +383,16 @@ async function resolvePackage(
     if (!stat || !stat.isDirectory()) continue;
     const pkgCfg = await getPkgCfg(nodeModulesDir + sep + pkgName, job);
     const { exports: pkgExports } = pkgCfg || {};
+
+    if (pkgCfg) {
+      await resolveRemappings(
+        nodeModulesDir + sep + pkgName,
+        pkgCfg,
+        parent,
+        job,
+      );
+    }
+
     if (
       job.conditions &&
       pkgExports !== undefined &&

test/integration/otel-api.js

@@ -0,0 +1,3 @@
+const { trace } = require('@opentelemetry/api');
+
+void trace.getTracer('test').startSpan('test');

test/unit.test.js

@@ -129,9 +129,20 @@ for (const { testName, isRoot } of unitTests) {
         inputFileNames.push('input-2.js', 'input-3.js', 'input-4.js');
       }
 
+      // Type: { conditions?: string[] }
+      let testOpts = {};
+      try {
+        testOpts = JSON.parse(
+          fs.readFileSync(join(unitPath, 'test-opts.json')).toString(),
+        );
+      } catch {
+        // Ignore.
+      }
+
       const { fileList, reasons } = await nodeFileTrace(
         inputFileNames.map((file) => join(unitPath, file)),
         {
+          conditions: testOpts.conditions,
           base: isRoot ? '/' : `${__dirname}/../`,
           processCwd: unitPath,
           paths: {

test/unit/browser-remappings-disabled/.gitignore

@@ -0,0 +1,2 @@
+# include node_modules for testing
+!node_modules 

test/unit/browser-remappings-disabled/input.js

@@ -0,0 +1,2 @@
+require('pkg');
+

test/unit/browser-remappings-disabled/output.js

@@ -0,0 +1,9 @@
+[
+  "package.json",
+  "test/unit/browser-remappings-disabled/input.js",
+  "test/unit/browser-remappings-disabled/node_modules/pkg/index.js",
+  "test/unit/browser-remappings-disabled/node_modules/pkg/package.json",
+  "test/unit/browser-remappings-disabled/node_modules/pkg/require-main.cjs",
+  "test/unit/browser-remappings-disabled/node_modules/pkg/subdir/import-main.js",
+  "test/unit/browser-remappings-disabled/node_modules/pkg/subdir/package.json"
+]

test/unit/browser-remappings-disabled/test-opts.json

@@ -0,0 +1,3 @@
+{
+  "conditions": ["node"]
+}

test/unit/browser-remappings-malformed/.gitignore

@@ -0,0 +1,2 @@
+# include node_modules for testing
+!node_modules 

test/unit/browser-remappings-malformed/input.js

@@ -0,0 +1,2 @@
+require('pkg');
+

test/unit/browser-remappings-malformed/output.js

@@ -0,0 +1,9 @@
+[
+  "package.json",
+  "test/unit/browser-remappings-malformed/input.js",
+  "test/unit/browser-remappings-malformed/node_modules/pkg/index.js",
+  "test/unit/browser-remappings-malformed/node_modules/pkg/package.json",
+  "test/unit/browser-remappings-malformed/node_modules/pkg/require-main.cjs",
+  "test/unit/browser-remappings-malformed/node_modules/pkg/subdir/import-main.js",
+  "test/unit/browser-remappings-malformed/node_modules/pkg/subdir/package.json"
+]

test/unit/browser-remappings-malformed/test-opts.json

@@ -0,0 +1,3 @@
+{
+  "conditions": ["browser"]
+}

test/unit/browser-remappings-malformed2/.gitignore

@@ -0,0 +1,2 @@
+# include node_modules for testing
+!node_modules 

test/unit/browser-remappings-malformed2/input.js

@@ -0,0 +1,2 @@
+require('pkg');
+

test/unit/browser-remappings-malformed2/output.js

@@ -0,0 +1,9 @@
+[
+  "package.json",
+  "test/unit/browser-remappings-malformed2/input.js",
+  "test/unit/browser-remappings-malformed2/node_modules/pkg/index.js",
+  "test/unit/browser-remappings-malformed2/node_modules/pkg/package.json",
+  "test/unit/browser-remappings-malformed2/node_modules/pkg/require-main.cjs",
+  "test/unit/browser-remappings-malformed2/node_modules/pkg/subdir/import-main.js",
+  "test/unit/browser-remappings-malformed2/node_modules/pkg/subdir/package.json"
+]

test/unit/browser-remappings-malformed2/test-opts.json

@@ -0,0 +1,3 @@
+{
+  "conditions": ["browser"]
+}

test/unit/browser-remappings/.gitignore

@@ -0,0 +1,2 @@
+# include node_modules for testing
+!node_modules 

test/unit/browser-remappings/input.js

@@ -0,0 +1,2 @@
+require('pkg');
+

test/unit/browser-remappings/output.js

@@ -0,0 +1,10 @@
+[
+  "package.json",
+  "test/unit/browser-remappings/input.js",
+  "test/unit/browser-remappings/node_modules/pkg/index.js",
+  "test/unit/browser-remappings/node_modules/pkg/package.json",
+  "test/unit/browser-remappings/node_modules/pkg/require-main.cjs",
+  "test/unit/browser-remappings/node_modules/pkg/subdir/import-main-browser.js",
+  "test/unit/browser-remappings/node_modules/pkg/subdir/import-main.js",
+  "test/unit/browser-remappings/node_modules/pkg/subdir/package.json"
+]

test/unit/browser-remappings/test-opts.json

@@ -0,0 +1,3 @@
+{
+  "conditions": ["browser"]
+}