refactor: ban JSON.stringify (#180)

Author: dinwwwh

eslint.config.js

@@ -1,15 +1,24 @@
 import antfu from '@antfu/eslint-config'
+import pluginBan from 'eslint-plugin-ban'
 
 export default antfu({
   react: true,
   formatters: true,
 }, {
+  plugins: { ban: pluginBan },
   rules: {
     'ts/consistent-type-definitions': 'off',
     'react-refresh/only-export-components': 'off',
     'react/prefer-destructuring-assignment': 'off',
     'react/no-context-provider': 'off',
     'ts/method-signature-style': ['off'],
+    'ban/ban': [
+      'error',
+      {
+        name: ['JSON', 'stringify'],
+        message: 'JSON.stringify can return undefined, use stringifyJSON instead',
+      },
+    ],
   },
 }, {
   files: ['**/*.test.ts', '**/*.test.tsx', '**/*.test-d.ts', '**/*.test-d.tsx', 'apps/content/shared/**', 'playgrounds/**', 'packages/*/playground/**'],
@@ -18,6 +27,7 @@ export default antfu({
     'antfu/no-top-level-await': 'off',
     'react-hooks/rules-of-hooks': 'off',
     'no-alert': 'off',
+    'ban/ban': 'off',
   },
 }, {
   files: ['apps/content/shared/**', 'apps/content/docs/**', 'apps/content/examples/**', 'playgrounds/**', 'packages/*/playground/**'],
@@ -26,6 +36,7 @@ export default antfu({
     'perfectionist/sort-imports': 'off',
     'import/first': 'off',
     'react-hooks/rules-of-hooks': 'off',
+    'ban/ban': 'off',
   },
 }, {
   files: ['apps/content/examples/**'],

package.json

@@ -34,6 +34,7 @@
     "@vitest/coverage-v8": "^3.0.4",
     "@vue/test-utils": "^2.4.6",
     "eslint": "^9.15.0",
+    "eslint-plugin-ban": "^2.0.0",
     "eslint-plugin-format": "^0.1.2",
     "eslint-plugin-react-hooks": "^5.0.0",
     "eslint-plugin-react-refresh": "^0.4.14",

packages/client/src/adapters/fetch/rpc-link.ts

@@ -2,7 +2,7 @@ import type { Value } from '@orpc/shared'
 import type { StandardBody } from '@orpc/standard-server'
 import type { ClientContext, ClientLink, ClientOptionsOut } from '../../types'
 import type { FetchWithContext } from './types'
-import { isAsyncIteratorObject, trim, value } from '@orpc/shared'
+import { isAsyncIteratorObject, stringifyJSON, trim, value } from '@orpc/shared'
 import { toFetchBody, toStandardBody } from '@orpc/standard-server-fetch'
 import { ORPCError } from '../../error'
 import { createAutoRetryEventIterator, type EventIteratorReconnectOptions } from '../../event-iterator'
@@ -226,7 +226,7 @@ export class RPCLink<TClientContext extends ClientContext> implements ClientLink
     ) {
       const getUrl = new URL(url)
 
-      getUrl.searchParams.append('data', JSON.stringify(serialized) ?? '') // stringify can return undefined
+      getUrl.searchParams.append('data', stringifyJSON(serialized) ?? '')
 
       if (getUrl.toString().length <= this.maxUrlLength) {
         return {

packages/client/src/rpc/serializer.ts

@@ -1,4 +1,4 @@
-import { isAsyncIteratorObject } from '@orpc/shared'
+import { isAsyncIteratorObject, stringifyJSON } from '@orpc/shared'
 import { ErrorEvent } from '@orpc/standard-server'
 import { ORPCError, toORPCError } from '../error'
 import { mapEventIterator } from '../event-iterator'
@@ -53,7 +53,7 @@ export class RPCSerializer {
 
     const form = new FormData()
 
-    form.set('data', JSON.stringify({ json, meta, maps }))
+    form.set('data', stringifyJSON({ json, meta, maps }))
 
     blobs.forEach((blob, i) => {
       form.set(i.toString(), blob)

packages/server/src/adapters/standard/rpc-codec.ts

@@ -20,7 +20,7 @@ export class RPCCodec implements StandardCodec {
 
   async decode(request: StandardRequest, _params: StandardParams | undefined, _procedure: AnyProcedure): Promise<unknown> {
     const serialized = request.method === 'GET'
-      ? parseEmptyableJSON(request.url.searchParams.getAll('data').at(-1) as any) // this prevent duplicate data params
+      ? parseEmptyableJSON(request.url.searchParams.getAll('data').at(-1)) // this prevent duplicate data params
       : await request.body() as any
 
     return this.serializer.deserialize(serialized)

packages/shared/src/json.test-d.ts

@@ -0,0 +1,6 @@
+import { stringifyJSON } from './json'
+
+it('stringifyJSON', () => {
+  expectTypeOf(stringifyJSON(undefined)).toEqualTypeOf<string | undefined>()
+  expectTypeOf(stringifyJSON({})).toEqualTypeOf<string>()
+})

packages/shared/src/json.test.ts

@@ -1,7 +1,15 @@
-import { parseEmptyableJSON } from './json'
+import { parseEmptyableJSON, stringifyJSON } from './json'
 
 it('parseEmptyableJSON', () => {
+  expect(parseEmptyableJSON(undefined)).toBeUndefined()
+  expect(parseEmptyableJSON(null)).toBeUndefined()
   expect(parseEmptyableJSON('')).toBeUndefined()
   expect(parseEmptyableJSON('{}')).toEqual({})
   expect(parseEmptyableJSON('{"foo":"bar"}')).toEqual({ foo: 'bar' })
 })
+
+it('stringifyJSON', () => {
+  expect(stringifyJSON(undefined)).toBeUndefined()
+  expect(stringifyJSON({})).toEqual('{}')
+  expect(stringifyJSON({ foo: 'bar' })).toEqual('{"foo":"bar"}')
+})

packages/shared/src/json.ts

@@ -1,7 +1,12 @@
-export function parseEmptyableJSON(text: string): unknown {
+export function parseEmptyableJSON(text: string | null | undefined): unknown {
   if (!text) {
     return undefined
   }
 
   return JSON.parse(text)
 }
+
+export function stringifyJSON<T>(value: T): undefined extends T ? undefined | string : string {
+  // eslint-disable-next-line ban/ban
+  return JSON.stringify(value)
+}

packages/standard-server-fetch/src/body.ts

@@ -1,5 +1,5 @@
 import type { StandardBody } from '@orpc/standard-server'
-import { isAsyncIteratorObject, parseEmptyableJSON } from '@orpc/shared'
+import { isAsyncIteratorObject, parseEmptyableJSON, stringifyJSON } from '@orpc/shared'
 import { contentDisposition, parseContentDisposition } from '@orpc/standard-server'
 import { toEventIterator, toEventStream } from './event-source'
 
@@ -95,5 +95,5 @@ export function toFetchBody(
 
   headers.set('content-type', 'application/json')
 
-  return JSON.stringify(body)
+  return stringifyJSON(body)
 }

packages/standard-server-fetch/src/event-source.ts

@@ -1,4 +1,4 @@
-import { isTypescriptObject, parseEmptyableJSON } from '@orpc/shared'
+import { isTypescriptObject, parseEmptyableJSON, stringifyJSON } from '@orpc/shared'
 import {
   encodeEventMessage,
   ErrorEvent,
@@ -90,7 +90,7 @@ export function toEventStream(
         controller.enqueue(encodeEventMessage({
           ...getEventMeta(value.value),
           event: value.done ? 'done' : 'message',
-          data: JSON.stringify(value.value),
+          data: stringifyJSON(value.value),
         }))
 
         if (value.done) {
@@ -101,7 +101,7 @@ export function toEventStream(
         controller.enqueue(encodeEventMessage({
           ...getEventMeta(err),
           event: 'error',
-          data: err instanceof ErrorEvent ? JSON.stringify(err.data) : undefined,
+          data: err instanceof ErrorEvent ? stringifyJSON(err.data) : undefined,
         }))
 
         controller.close()