fix: add browser polyfill to upnp-nat (#2959)

To give more helpful error messages, add a browser shim for upnp-nat, similar to `@libp2p/tcp` - without this the user gets errors about not being able to load node api modules, instead throw a specific error that tells them their configuration is invalid.

packages/upnp-nat/package.json

@@ -46,6 +46,10 @@
     "doc-check": "aegir doc-check",
     "build": "aegir build --no-bundle",
     "test": "aegir test -t node -t electron-main",
+    "test:chrome": "aegir test -t browser -f ./dist/test/browser.js --cov",
+    "test:chrome-webworker": "aegir test -t webworker -f ./dist/test/browser.js",
+    "test:firefox": "aegir test -t browser -f ./dist/test/browser.js -- --browser firefox",
+    "test:firefox-webworker": "aegir test -t webworker -f ./dist/test/browser.js -- --browser firefox",
     "test:node": "aegir test -t node --cov",
     "test:electron-main": "aegir test -t electron-main"
   },
@@ -65,7 +69,11 @@
     "@libp2p/logger": "^5.1.8",
     "@libp2p/peer-id": "^5.0.12",
     "aegir": "^45.0.5",
-    "sinon-ts": "^2.0.0"
+    "sinon-ts": "^2.0.0",
+    "wherearewe": "^2.0.1"
+  },
+  "browser": {
+    "./dist/src/upnp-nat.js": "./dist/src/upnp-nat.browser.js"
   },
   "sideEffects": false
 }

packages/upnp-nat/src/upnp-nat.browser.ts

@@ -0,0 +1,20 @@
+import { serviceCapabilities, serviceDependencies } from '@libp2p/interface'
+import type { UPnPNATClient, UPnPNAT as UPnPNATInterface } from './index.js'
+
+export class UPnPNAT implements UPnPNATInterface {
+  public portMappingClient: UPnPNATClient
+
+  constructor () {
+    throw new Error('UPnPNAT is not supported in browsers')
+  }
+
+  readonly [Symbol.toStringTag] = '@libp2p/upnp-nat'
+
+  readonly [serviceCapabilities]: string[] = [
+    '@libp2p/nat-traversal'
+  ]
+
+  get [serviceDependencies] (): string[] {
+    return []
+  }
+}

packages/upnp-nat/test/browser.ts

@@ -0,0 +1,29 @@
+import { generateKeyPair } from '@libp2p/crypto/keys'
+import { TypedEventEmitter } from '@libp2p/interface'
+import { defaultLogger } from '@libp2p/logger'
+import { peerIdFromPrivateKey } from '@libp2p/peer-id'
+import { expect } from 'aegir/chai'
+import { stubInterface } from 'sinon-ts'
+import { isBrowser, isWebWorker } from 'wherearewe'
+import { uPnPNAT } from '../src/index.js'
+import type { AddressManager } from '@libp2p/interface-internal'
+
+describe('browser non-support', () => {
+  it('should throw in browsers', async function () {
+    if (!isBrowser && !isWebWorker) {
+      return this.skip()
+    }
+
+    const components = {
+      peerId: peerIdFromPrivateKey(await generateKeyPair('Ed25519')),
+      nodeInfo: { name: 'test', version: 'test', userAgent: 'test' },
+      logger: defaultLogger(),
+      addressManager: stubInterface<AddressManager>(),
+      events: new TypedEventEmitter()
+    }
+
+    expect(() => {
+      uPnPNAT()(components)
+    }).to.throw()
+  })
+})