feat: improved serialization

Author: skoshx

package.json

@@ -54,6 +54,7 @@
 	},
 	"devDependencies": {
 		"@babel/types": "^7.21.4",
+		"@happy-dom/global-registrator": "^9.20.3",
 		"@nuxtjs/eslint-config-typescript": "latest",
 		"@supabase/supabase-js": "^2.21.0",
 		"@trpc/server": "^10.21.1",

pnpm-lock.yaml

@@ -1,4 +1,8 @@
 import { SourceType } from './types'
 
 export const NO_SOURCE: SourceType = { filePath: 'unknown', lineNumber: -1 }
+
 export const FLYTRAP_UNSERIALIZABLE_VALUE = 'FLYTRAP_UNSERIALIZABLE_VALUE'
+export const FLYTRAP_FUNCTION = 'FLYTRAP_FUNCTION'
+export const FLYTRAP_DOM_EVENT = 'FLYTRAP_DOM_EVENT'
+export const FLYTRAP_CIRCULAR = 'FLYTRAP_CIRCULAR'

src/core/constants.ts

@@ -1,41 +1,59 @@
 import SuperJSON from 'superjson'
-import { FLYTRAP_UNSERIALIZABLE_VALUE } from './constants'
-import { ignoreCircularReferences } from './util'
+import { FLYTRAP_CIRCULAR, FLYTRAP_DOM_EVENT, FLYTRAP_FUNCTION } from './constants'
+
+function superJsonRegisterCustom() {
+	// handle functions
+	SuperJSON.registerCustom<any, string>(
+		{
+			isApplicable: (v): v is Function => typeof v === 'function',
+			serialize: () => FLYTRAP_FUNCTION,
+			deserialize: () => FLYTRAP_FUNCTION
+		},
+		'functions'
+	)
+
+	// handle DOM events
+	SuperJSON.registerCustom<any, string>(
+		{
+			isApplicable: (v): v is Event => {
+				return typeof window !== 'undefined' ? v instanceof window.Event : false
+			},
+			serialize: () => FLYTRAP_DOM_EVENT,
+			deserialize: () => FLYTRAP_DOM_EVENT
+		},
+		'dom events'
+	)
+}
 
 /**
  * Stringifies an object, and removes all cyclical dependencies. When parsing, cyclical values become `null`.
  * @param obj object to stringify
  * @returns stringified object with cyclical dependencies removed
  */
 export function stringify(obj: any): string {
-	// handle functions appropriately
-	SuperJSON.registerCustom<any, string>(
-		{
-			isApplicable: (v): v is Function => typeof v === 'function',
-			serialize: () => FLYTRAP_UNSERIALIZABLE_VALUE,
-			deserialize: () => FLYTRAP_UNSERIALIZABLE_VALUE
-		},
-		'unserializable functions'
-	)
+	superJsonRegisterCustom()
 
 	const serialized = SuperJSON.serialize(obj)
 	if (serialized.meta?.referentialEqualities) {
 		delete serialized.meta.referentialEqualities
 	}
 
+	function ignoreCircularReferences() {
+		const seen = new WeakSet()
+		return (key: any, value: any) => {
+			if (key.startsWith('_')) return // Don't compare React's internal props.
+			if (typeof value === 'object' && value !== null) {
+				if (seen.has(value)) return FLYTRAP_CIRCULAR
+				seen.add(value)
+			}
+			return value
+		}
+	}
+
 	return JSON.stringify(serialized, ignoreCircularReferences())
 }
 
 export function parse<T = unknown>(stringified: string): T {
-	// handle functions appropriately
-	SuperJSON.registerCustom<any, string>(
-		{
-			isApplicable: (v): v is Function => typeof v === 'function',
-			serialize: () => FLYTRAP_UNSERIALIZABLE_VALUE,
-			deserialize: () => FLYTRAP_UNSERIALIZABLE_VALUE
-		},
-		'unserializable functions'
-	)
-
+	superJsonRegisterCustom()
 	return SuperJSON.parse<T>(stringified)
 }

src/core/stringify.ts

@@ -1,6 +1,9 @@
 import { expect, it } from 'vitest'
-import { stringify } from '../src/core/stringify'
+import { parse, stringify } from '../src/core/stringify'
 import SuperJSON from 'superjson'
+import { FLYTRAP_DOM_EVENT } from '../src/core/constants'
+import { GlobalRegistrator } from '@happy-dom/global-registrator'
+GlobalRegistrator.register()
 
 it('removes cyclical dependencies', () => {
 	const a = {
@@ -26,3 +29,7 @@ it('removes cyclical dependencies', () => {
 		}
 	})
 })
+
+it('doesnt stringify DOM events', () => {
+	expect(parse(stringify(new MouseEvent('click')))).toEqual(FLYTRAP_DOM_EVENT)
+})