feat: distribute the library for browser and node in ESM and CJS

ClientRequest/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../lib/node/interceptors/ClientRequest.js",
+  "module": "../lib/node/interceptors/ClientRequest.mjs",
+  "browser": null,
+  "types": "../lib/node/interceptors/ClientRequest/index.d.ts"
+}

README.md

@@ -107,7 +107,7 @@ To use this library you need to choose one or multiple interceptors to apply. Th
 Use an interceptor by constructing it and attaching request/response listeners:
 
 ```js
-import { ClientRequestInterceptor } from '@mswjs/interceptors/lib/interceptors/ClientRequest'
+import { ClientRequestInterceptor } from '@mswjs/interceptors/ClientRequest'
 
 const interceptor = new ClientRequestInterceptor()
 
@@ -138,8 +138,8 @@ You can combine multiple interceptors to capture requests from different request
 
 ```js
 import { BatchInterceptor } from '@mswjs/interceptors'
-import { ClientRequestInterceptor } from '@mswjs/interceptors/lib/interceptors/ClientRequest'
-import { XMLHttpRequestInterceptor } from '@mswjs/interceptors/lib/interceptors/XMLHttpRequest'
+import { ClientRequestInterceptor } from '@mswjs/interceptors/ClientRequest'
+import { XMLHttpRequestInterceptor } from '@mswjs/interceptors/XMLHttpRequest'
 
 const interceptor = new BatchInterceptor({
   name: 'my-interceptor',
@@ -256,7 +256,7 @@ interceptor.on('request', (request, requestId) => {
 })
 ```
 
-> We use Fetch API `Response` class as the middleground for mocked response definition. This library then coerces the response instance to the appropriate response format (e.g. to `http.OutgoingMessage` in the case of `http.ClientRequest`).
+> We use Fetch API `Response` class as the middle-ground for mocked response definition. This library then coerces the response instance to the appropriate response format (e.g. to `http.OutgoingMessage` in the case of `http.ClientRequest`).
 
 **The `Response` class is built-in in since Node.js 18. Use a Fetch API-compatible polyfill, like `node-fetch`, for older versions of Node.js.`**
 
@@ -326,8 +326,8 @@ Enables request interception in the current process while delegating the respons
 
 ```js
 // child.js
-import { RemoteHttpInterceptor } from '@mswjs/interceptors/lib/RemoteHttpInterceptor'
-import { ClientRequestInterceptor } from '@mswjs/interceptors/lib/interceptors/ClientRequest'
+import { RemoteHttpInterceptor } from '@mswjs/interceptors/RemoteHttpInterceptor'
+import { ClientRequestInterceptor } from '@mswjs/interceptors/ClientRequest'
 
 const interceptor = new RemoteHttpInterceptor({
   // Alternatively, you can use presets.
@@ -350,7 +350,7 @@ Resolves an intercepted request in the given child `process`. Requires for that
 ```js
 // parent.js
 import { spawn } from 'child_process'
-import { RemoteHttpResolver } from '@mswjs/interceptors/lib/RemoteHttpInterceptor'
+import { RemoteHttpResolver } from '@mswjs/interceptors/RemoteHttpInterceptor'
 
 const appProcess = spawn('node', ['app.js'], {
   stdio: ['inherit', 'inherit', 'inherit', 'ipc'],

RemoteHttpInterceptor/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../lib/node/RemoteHttpInterceptor.js",
+  "module": "../lib/node/RemoteHttpInterceptor.mjs",
+  "browser": null,
+  "types": "../lib/node/RemoteHttpInterceptor.d.ts"
+}

XMLHttpRequest/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../lib/node/interceptors/XMLHttpRequest/index.js",
+  "module": "../lib/node/interceptors/XMLHttpRequest/index.mjs",
+  "browser": "../lib/browser/interceptors/XMLHttpRequest/index.js",
+  "types": "../lib/node/interceptors/XMLHttpRequest/index.d.ts"
+}

fetch/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../lib/node/interceptors/fetch/index.js",
+  "module": "../lib/node/interceptors/fetch/index.mjs",
+  "browser": "../lib/browser/interceptors/fetch/index.js",
+  "types": "../lib/node/interceptors/fetch/index.d.ts"
+}

package.json

@@ -2,8 +2,55 @@
   "name": "@mswjs/interceptors",
   "description": "Low-level HTTP/HTTPS/XHR/fetch request interception library.",
   "version": "0.20.0",
-  "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "main": "./lib/node/index.js",
+  "module": "./lib/node/index.mjs",
+  "types": "./lib/node/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./lib/node/index.d.ts",
+      "require": "./lib/node/index.js",
+      "import": "./lib/node/index.mjs",
+      "default": "./lib/node/index.js"
+    },
+    "./ClientRequest": {
+      "browser": null,
+      "types": "./lib/node/interceptors/ClientRequest/index.d.ts",
+      "require": "./lib/node/interceptors/ClientRequest/index.js",
+      "import": "./lib/node/interceptors/ClientRequest/index.mjs",
+      "default": "./lib/node/interceptors/ClientRequest/index.js"
+    },
+    "./XMLHttpRequest": {
+      "browser": {
+        "types": "./lib/browser/interceptors/XMLHttpRequest/index.d.ts",
+        "require": "./lib/browser/interceptors/XMLHttpRequest/index.js",
+        "import": "./lib/browser/interceptors/XMLHttpRequest/index.mjs",
+        "default": "./lib/browser/interceptors/XMLHttpRequest/index.js"
+      },
+      "types": "./lib/node/interceptors/XMLHttpRequest/index.d.ts",
+      "require": "./lib/node/interceptors/XMLHttpRequest/index.js",
+      "import": "./lib/node/interceptors/XMLHttpRequest/index.mjs",
+      "default": "./lib/node/interceptors/XMLHttpRequest/index.js"
+    },
+    "./fetch": {
+      "browser": {
+        "types": "./lib/browser/interceptors/fetch/index.d.ts",
+        "require": "./lib/browser/interceptors/fetch/index.js",
+        "default": "./lib/browser/interceptors/fetch/index.js",
+        "import": "./lib/browser/interceptors/fetch/index.mjs"
+      },
+      "types": "./lib/node/interceptors/fetch/index.d.ts",
+      "require": "./lib/node/interceptors/fetch/index.js",
+      "import": "./lib/node/interceptors/fetch/index.mjs",
+      "default": "./lib/node/interceptors/fetch/index.js"
+    },
+    "./RemoteHttpInterceptor": {
+      "browser": null,
+      "types": "./lib/node/interceptors/RemoteHttpInterceptor.d.ts",
+      "require": "./lib/node/interceptors/RemoteHttpInterceptor.js",
+      "import": "./lib/node/interceptors/RemoteHttpInterceptor.mjs",
+      "default": "./lib/node/interceptors/RemoteHttpInterceptor.js"
+    }
+  },
   "author": "Artem Zakharchenko",
   "license": "MIT",
   "engines": {
@@ -17,7 +64,7 @@
     "test:integration:node": "jest --c test/jest.node.config.js --runInBand",
     "test:integration:browser": "jest --c test/jest.browser.config.js",
     "clean": "rimraf lib",
-    "build": "yarn clean && tsc --build",
+    "build": "yarn clean && cross-env NODE_ENV=production tsup --splitting",
     "prepare": "yarn simple-git-hooks init",
     "release": "release publish",
     "prepublishOnly": "yarn build && yarn test"
@@ -36,6 +83,7 @@
     "@commitlint/config-conventional": "^16.0.0",
     "@open-draft/test-server": "^0.4.2",
     "@ossjs/release": "^0.4.0",
+    "@remix-run/web-fetch": "^4.3.1",
     "@types/cors": "^2.8.12",
     "@types/express": "^4.17.13",
     "@types/express-rate-limit": "^6.0.0",
@@ -48,6 +96,7 @@
     "body-parser": "^1.19.0",
     "commitizen": "^4.2.4",
     "cors": "^2.8.5",
+    "cross-env": "^7.0.3",
     "cz-conventional-changelog": "3.3.0",
     "express": "^4.17.3",
     "express-rate-limit": "^6.3.0",
@@ -61,18 +110,18 @@
     "superagent": "^6.1.0",
     "supertest": "^6.1.6",
     "ts-jest": "^27.1.1",
-    "typescript": "4.4.4",
-    "wait-for-expect": "^3.0.2"
+    "tsup": "^6.5.0",
+    "typescript": "^4.9.4",
+    "wait-for-expect": "^3.0.2",
+    "web-encoding": "^1.1.5"
   },
   "dependencies": {
     "@open-draft/until": "^1.0.3",
-    "@remix-run/web-fetch": "^4.3.2",
     "@types/debug": "^4.1.7",
     "debug": "^4.3.3",
     "headers-polyfill": "^3.1.0",
     "outvariant": "^1.2.1",
-    "strict-event-emitter": "^0.4.6",
-    "web-encoding": "^1.1.5"
+    "strict-event-emitter": "^0.4.6"
   },
   "keywords": [
     "request",

src/interceptors/ClientRequest/utils/normalizeClientRequestArgs.ts

@@ -165,7 +165,7 @@ export function normalizeClientRequestArgs(
   // Handle a given "RequestOptions" object as-is
   // and derive the URL instance from it.
   else if (isObject(args[0])) {
-    options = args[0]
+    options = args[0] as any
     log('first argument is RequestOptions:', options)
 
     // When handling a "RequestOptions" object without an explicit "protocol",

src/shims/webEncoding.ts

@@ -0,0 +1,9 @@
+export const TextEncoder: typeof globalThis.TextEncoder =
+  typeof globalThis.TextEncoder === 'undefined'
+    ? require('util').TextEncoder
+    : globalThis.TextEncoder
+
+export const TextDecoder: typeof globalThis.TextDecoder =
+  typeof globalThis.TextDecoder === 'undefined'
+    ? require('util').TextDecoder
+    : globalThis.TextDecoder

src/utils/bufferUtils.ts

@@ -1,4 +1,4 @@
-import { TextDecoder, TextEncoder } from 'web-encoding'
+import { TextEncoder, TextDecoder } from '../shims/webEncoding'
 
 const encoder = new TextEncoder()
 

test/features/remote/child.js

@@ -1,5 +1,5 @@
 const fetch = require('node-fetch')
-const { RemoteHttpInterceptor } = require('../../../lib/RemoteHttpInterceptor')
+const { RemoteHttpInterceptor } = require('../../../RemoteHttpInterceptor')
 
 const interceptor = new RemoteHttpInterceptor()
 interceptor.apply()

test/modules/XMLHttpRequest/intercept/XMLHttpRequest.browser.runtime.js

@@ -1,4 +1,4 @@
-import { XMLHttpRequestInterceptor } from '@mswjs/interceptors/lib/interceptors/XMLHttpRequest'
+import { XMLHttpRequestInterceptor } from '@mswjs/interceptors/XMLHttpRequest'
 
 const interceptor = new XMLHttpRequestInterceptor()
 interceptor.on('request', async (request, requestId) => {

test/modules/XMLHttpRequest/response/xhr-response-patching.browser.runtime.js

@@ -1,4 +1,4 @@
-import { XMLHttpRequestInterceptor } from '@mswjs/interceptors/lib/interceptors/XMLHttpRequest'
+import { XMLHttpRequestInterceptor } from '@mswjs/interceptors/XMLHttpRequest'
 
 const interceptor = new XMLHttpRequestInterceptor()
 

test/modules/XMLHttpRequest/response/xhr.browser.runtime.js

@@ -1,4 +1,4 @@
-import { XMLHttpRequestInterceptor } from '@mswjs/interceptors/lib/interceptors/XMLHttpRequest'
+import { XMLHttpRequestInterceptor } from '@mswjs/interceptors/XMLHttpRequest'
 
 const interceptor = new XMLHttpRequestInterceptor()
 

test/modules/fetch/fetch-modify-request.runtime.js

@@ -1,4 +1,4 @@
-import { FetchInterceptor } from '@mswjs/interceptors/lib/interceptors/fetch'
+import { FetchInterceptor } from '@mswjs/interceptors/fetch'
 
 const interceptor = new FetchInterceptor()
 

test/modules/fetch/intercept/fetch.body.runtime.js

@@ -1,4 +1,4 @@
-import { FetchInterceptor } from '@mswjs/interceptors/lib/interceptors/fetch'
+import { FetchInterceptor } from '@mswjs/interceptors/fetch'
 
 const interceptor = new FetchInterceptor()
 interceptor.on('request', (request) => {

test/modules/fetch/intercept/fetch.browser.runtime.js

@@ -1,4 +1,4 @@
-import { FetchInterceptor } from '@mswjs/interceptors/lib/interceptors/fetch'
+import { FetchInterceptor } from '@mswjs/interceptors/fetch'
 
 const interceptor = new FetchInterceptor()
 interceptor.on('request', async (request, requestId) => {

test/modules/fetch/intercept/fetch.clone.runtime.js

@@ -1,4 +1,4 @@
-import { FetchInterceptor } from '@mswjs/interceptors/lib/interceptors/fetch'
+import { FetchInterceptor } from '@mswjs/interceptors/fetch'
 
 // Intentionally don't mock any responses
 // so that the original responses are sent.

test/modules/fetch/response/fetch-response-patching.runtime.js

@@ -1,4 +1,4 @@
-import { FetchInterceptor } from '@mswjs/interceptors/lib/interceptors/fetch'
+import { FetchInterceptor } from '@mswjs/interceptors/fetch'
 
 const interceptor = new FetchInterceptor()
 

test/modules/fetch/response/fetch.browser.runtime.js

@@ -1,4 +1,4 @@
-import { FetchInterceptor } from '@mswjs/interceptors/lib/interceptors/fetch'
+import { FetchInterceptor } from '@mswjs/interceptors/fetch'
 
 const interceptor = new FetchInterceptor()
 

tsconfig.json

@@ -1,16 +1,16 @@
 {
   "compilerOptions": {
     "strict": true,
-    "target": "es6",
-    "module": "commonjs",
+    "target": "es2018",
+    "module": "NodeNext",
     "sourceMap": true,
     "outDir": "lib",
     "declaration": true,
     "moduleResolution": "node",
     "removeComments": false,
     "esModuleInterop": true,
     "downlevelIteration": true,
-    "lib": ["dom", "dom.iterable"]
+    "lib": ["dom", "dom.iterable", "ES2018.AsyncGenerator"]
   },
   "include": ["src/**/*.ts"],
   "exclude": ["node_modules", "**/*.test.*"]

tsup.config.ts

@@ -0,0 +1,29 @@
+import { Options, defineConfig } from 'tsup'
+
+const nodeConfig: Options = {
+  entry: [
+    './src/index.ts',
+    './src/RemoteHttpInterceptor.ts',
+    './src/interceptors/ClientRequest/index.ts',
+    './src/interceptors/XMLHttpRequest/index.ts',
+    './src/interceptors/fetch/index.ts',
+  ],
+  outDir: './lib/node',
+  platform: 'node',
+  format: ['cjs', 'esm'],
+  dts: true,
+}
+
+const browserConfig: Options = {
+  entry: [
+    './src/index.ts',
+    './src/interceptors/XMLHttpRequest/index.ts',
+    './src/interceptors/fetch/index.ts',
+  ],
+  outDir: './lib/browser',
+  platform: 'browser',
+  format: ['cjs', 'esm'],
+  dts: true,
+}
+
+export default defineConfig([nodeConfig, browserConfig])