From 714d34e34abe9a38110dcd22ab095fe38bd73211 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Thu, 26 Dec 2024 16:14:26 +0900
Subject: [PATCH 1/2] fix(diff): truncate to avoid crash on diff large objects

---
 packages/utils/src/diff/index.ts | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/packages/utils/src/diff/index.ts b/packages/utils/src/diff/index.ts
index d69d33f99f3f..2fe0e76aee78 100644
--- a/packages/utils/src/diff/index.ts
+++ b/packages/utils/src/diff/index.ts
@@ -57,7 +57,7 @@ const FORMAT_OPTIONS = {
 }
 const FALLBACK_FORMAT_OPTIONS = {
   callToJSON: false,
-  maxDepth: 10,
+  maxDepth: 8,
   plugins: PLUGINS,
 }
 
@@ -97,8 +97,18 @@ export function diff(a: any, b: any, options?: DiffOptions): string | undefined
     const { aAnnotation, aColor, aIndicator, bAnnotation, bColor, bIndicator }
       = normalizeDiffOptions(options)
     const formatOptions = getFormatOptions(FALLBACK_FORMAT_OPTIONS, options)
-    const aDisplay = prettyFormat(a, formatOptions)
-    const bDisplay = prettyFormat(b, formatOptions)
+    let aDisplay = prettyFormat(a, formatOptions)
+    let bDisplay = prettyFormat(b, formatOptions)
+    // even if prettyFormat prints successfully big objects,
+    // large string can choke later on (concatenation? RPC?),
+    // so truncate it to a reasonable length here.
+    // (For example, playwright's ElementHandle can become about 200_000_000 length string)
+    const MAX_LENGTH = 100_000
+    function truncate(s: string) {
+      return s.length <= MAX_LENGTH ? s : (`${s.slice(0, MAX_LENGTH)}...`)
+    }
+    aDisplay = truncate(aDisplay)
+    bDisplay = truncate(bDisplay)
     const aDiff = `${aColor(`${aIndicator} ${aAnnotation}:`)} \n${aDisplay}`
     const bDiff = `${bColor(`${bIndicator} ${bAnnotation}:`)} \n${bDisplay}`
     return `${aDiff}\n\n${bDiff}`

From 9ebe2fe705509ce1f13a3356836567e08d85a9a8 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Thu, 26 Dec 2024 17:01:18 +0900
Subject: [PATCH 2/2] test: add test

---
 test/core/test/diff.test.ts | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/test/core/test/diff.test.ts b/test/core/test/diff.test.ts
index 9512d7578ba5..e033f4f2985f 100644
--- a/test/core/test/diff.test.ts
+++ b/test/core/test/diff.test.ts
@@ -331,7 +331,13 @@ test('getter only property', () => {
   `)
 })
 
-function getErrorDiff(actual: unknown, expected: unknown, options?: DiffOptions) {
+test('truncate large diff', () => {
+  const diff = getErrorDiff(Array.from({ length: 500_000 }).fill(0), 1234)
+  expect(diff.length).lessThan(200_000)
+  expect(diff.trim()).toMatch(/\.\.\.$/)
+})
+
+function getErrorDiff(actual: unknown, expected: unknown, options?: DiffOptions): string {
   try {
     expect(actual).toEqual(expected)
   }
@@ -339,5 +345,5 @@ function getErrorDiff(actual: unknown, expected: unknown, options?: DiffOptions)
     const error = processError(e, options)
     return error.diff
   }
-  expect.unreachable()
+  return expect.unreachable()
 }