@things-factory/board-ai 10.0.0-beta.108

package/server/service/apply-patch-drift.test.ts

@@ -0,0 +1,829 @@
+/**
+ * apply-patch drift 검증 — server (apply-patch.ts) 와 client (board-edit-patch.ts) 의
+ * 의도적 중복본이 동기 상태인지 자동 검증.
+ *
+ * 두 파일은 webpack 빌드 분리 (package.json browser/main 필드) 때문에 분리되어
+ * 있고, 진정한 단일화 (shared 디렉토리) 는 tsconfig + emit 경로 + browser 진입점
+ * 변경이 필요한 큰 구조 변경. 그 때까지 부채 부담을 자동 검증으로 대체:
+ *
+ *   - export 이름이 동일한지
+ *   - 같은 입력에 대해 같은 출력을 내는지 (round-trip 동등성)
+ *
+ * 한쪽만 변경하면 즉시 깨짐 → drift 영구 차단.
+ */
+import * as serverModule from './apply-patch'
+// 테스트 환경은 jest node — client 측 module 도 plain TS 라서 직접 import 가능
+// (Lit / @material/web 같은 ESM 의존 없음)
+import * as clientModule from '../../client/utils/board-edit-patch'
+
+describe('apply-patch drift 자동 검증 — server / client 사본 동기 보장', () => {
+  test('주요 함수 export 모두 양쪽에 존재', () => {
+    const required = [
+      'applyBoardEditPatch',
+      'applyBoardEditPatchVerbose',
+      'computeInverseOp',
+      'mergeComponent'
+    ]
+    for (const name of required) {
+      expect(typeof (serverModule as any)[name]).toBe('function')
+      expect(typeof (clientModule as any)[name]).toBe('function')
+    }
+  })
+
+  // 각 함수가 시그니처+동작 동일한지 — 같은 입력에 같은 출력.
+
+  describe('applyBoardEditPatch — 동작 동등성', () => {
+    test('add', () => {
+      const board = { width: 1000, height: 600, components: [] }
+      const patch: any = {
+        ops: [{ op: 'add', component: { refid: 1, type: 'rect' } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+    })
+
+    test('remove', () => {
+      const board = { width: 1000, height: 600, components: [{ refid: 1, type: 'rect' }] }
+      const patch: any = { ops: [{ op: 'remove', refid: 1 }], summary: '', confidence: 1 }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+    })
+
+    test('modify (deep merge)', () => {
+      const board = {
+        width: 1000,
+        height: 600,
+        components: [
+          {
+            refid: 1,
+            type: 'rect',
+            threeD: { material: { color: '#ff0000', metalness: 0.5 } }
+          }
+        ]
+      }
+      const patch: any = {
+        ops: [{ op: 'modify', refid: 1, patch: { threeD: { material: { color: '#00ff00' } } } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+    })
+
+    test('modifyBoard', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        fillStyle: '#fff',
+        components: [{ refid: 1, type: 'rect' }]
+      }
+      const patch: any = {
+        ops: [{ op: 'modifyBoard', patch: { fillStyle: '#0a1929' } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+    })
+
+    test('replace', () => {
+      const board = { width: 1000, height: 600, components: [{ refid: 1, type: 'rect' }] }
+      const patch: any = {
+        ops: [
+          { op: 'replace', board: { width: 800, height: 480, components: [] } }
+        ],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+    })
+
+    test('arrange — scene-only noop (양쪽 board 동일 reference 보존)', () => {
+      const board = { width: 1000, height: 600, components: [{ refid: 1, type: 'rect' }] }
+      const patch: any = {
+        ops: [
+          { op: 'arrange', refids: [1, 2], layout: { type: 'grid', cols: 2 } }
+        ],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(board, patch)
+      const r2 = clientModule.applyBoardEditPatch(board, patch)
+      // verbose 동등 — applied/missed 분류
+      const v1: any = serverModule.applyBoardEditPatchVerbose(board, patch)
+      const v2: any = clientModule.applyBoardEditPatchVerbose(board, patch)
+      expect(v1.applied.length).toBe(v2.applied.length)
+      expect(v1.applied.length).toBe(1)
+      expect(v1.missed.length).toBe(0)
+      expect(r1).toEqual(r2)
+    })
+
+    test('modifyBoard 가 fillStyle 외 root 키 (sky 등) 만 → 양쪽 applied (회귀 방지)', () => {
+      // server 측 componentsUnchanged 버그 fix 가 client 에도 sync 됐는지 검증.
+      // client 만 안 고쳤으면 missed 분류돼서 board 갱신 안 됨.
+      const board: any = { width: 1000, height: 600, components: [{ refid: 1, type: 'rect' }] }
+      const patch: any = {
+        ops: [{ op: 'modifyBoard', patch: { sky: 'color', exposure: 0.7 } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect((r1 as any).sky).toBe('color')
+      expect((r2 as any).sky).toBe('color')
+      expect(r1).toEqual(r2)
+    })
+
+    test('mixed multi-op', () => {
+      const board = {
+        width: 1000,
+        height: 600,
+        components: [
+          { refid: 1, type: 'rect', left: 10 },
+          { refid: 2, type: 'circle' }
+        ]
+      }
+      const patch: any = {
+        ops: [
+          { op: 'add', component: { refid: 3, type: 'text' } },
+          { op: 'modify', refid: 1, patch: { left: 100 } },
+          { op: 'remove', refid: 2 }
+        ],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+    })
+  })
+
+  describe('applyBoardEditPatchVerbose — applied/missed 동일', () => {
+    test('정상 + missed 혼합', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        components: [{ refid: 1, type: 'rect' }]
+      }
+      const patch: any = {
+        ops: [
+          { op: 'modify', refid: 1, patch: { left: 10 } },
+          { op: 'modify', refid: 999, patch: { left: 99 } } // missed
+        ],
+        summary: '',
+        confidence: 1
+      }
+      const r1: any = serverModule.applyBoardEditPatchVerbose(
+        JSON.parse(JSON.stringify(board)),
+        patch
+      )
+      const r2: any = clientModule.applyBoardEditPatchVerbose(
+        JSON.parse(JSON.stringify(board)),
+        patch
+      )
+      expect(r1.applied.length).toBe(r2.applied.length)
+      expect(r1.missed.length).toBe(r2.missed.length)
+      expect(r1.board).toEqual(r2.board)
+    })
+  })
+
+  describe('computeInverseOp — 동일 inverse', () => {
+    const cases: Array<{ name: string; board: any; op: any }> = [
+      {
+        name: 'remove',
+        board: { width: 1000, height: 600, components: [{ refid: 1, type: 'rect', left: 10 }] },
+        op: { op: 'remove', refid: 1 }
+      },
+      {
+        name: 'modify',
+        board: { width: 1000, height: 600, components: [{ refid: 1, type: 'rect', left: 10 }] },
+        op: { op: 'modify', refid: 1, patch: { left: 999 } }
+      },
+      {
+        name: 'modifyBoard',
+        board: { width: 1000, height: 600, fillStyle: '#fff', components: [] },
+        op: { op: 'modifyBoard', patch: { fillStyle: '#0a1929' } }
+      },
+      {
+        name: 'replace',
+        board: { width: 1000, height: 600, components: [{ refid: 1, type: 'rect' }] },
+        op: { op: 'replace', board: { width: 800, height: 480, components: [] } }
+      },
+      {
+        name: 'add (양쪽 모두 null — 모델 단계 계산 불가)',
+        board: { width: 1000, height: 600, components: [] },
+        op: { op: 'add', component: { refid: 9, type: 'rect' } }
+      },
+      {
+        name: 'remove 매칭 실패 → null',
+        board: { width: 1000, height: 600, components: [{ refid: 1, type: 'rect' }] },
+        op: { op: 'remove', refid: 999 }
+      },
+      // Phase 2 — Scene 조작 op 의 inverse 동등성
+      {
+        name: 'zorder forward → 자동 backward',
+        board: { width: 1000, height: 600, components: [{ refid: 1, type: 'rect' }] },
+        op: { op: 'zorder', refid: 1, direction: 'forward' }
+      },
+      {
+        name: 'zorder front → 자동 back',
+        board: { width: 1000, height: 600, components: [{ refid: 1, type: 'rect' }] },
+        op: { op: 'zorder', refid: 1, direction: 'front' }
+      },
+      {
+        name: 'align → null (호스트 책임)',
+        board: { width: 1000, height: 600, components: [{ refid: 1, type: 'rect' }] },
+        op: { op: 'align', refids: [1, 2], direction: 'left' }
+      },
+      {
+        name: 'distribute → null',
+        board: { width: 1000, height: 600, components: [] },
+        op: { op: 'distribute', refids: [1, 2, 3], axis: 'horizontal' }
+      },
+      {
+        name: 'group → null',
+        board: { width: 1000, height: 600, components: [] },
+        op: { op: 'group', refids: [1, 2] }
+      },
+      {
+        name: 'ungroup → null',
+        board: { width: 1000, height: 600, components: [] },
+        op: { op: 'ungroup', refid: 1 }
+      },
+      // Sugar layout — arrange 도 host 책임 → 양쪽 null
+      {
+        name: 'arrange grid → null (호스트 책임)',
+        board: { width: 1000, height: 600, components: [] },
+        op: { op: 'arrange', refids: [1, 2], layout: { type: 'grid', cols: 2 } }
+      },
+      {
+        name: 'arrange row → null',
+        board: { width: 1000, height: 600, components: [] },
+        op: { op: 'arrange', refids: [1, 2], layout: { type: 'row' } }
+      }
+    ]
+    for (const c of cases) {
+      test(c.name, () => {
+        const r1 = serverModule.computeInverseOp(JSON.parse(JSON.stringify(c.board)), c.op)
+        const r2 = clientModule.computeInverseOp(JSON.parse(JSON.stringify(c.board)), c.op)
+        expect(r1).toEqual(r2)
+      })
+    }
+  })
+
+  describe('mergeComponent — deep merge 동등성', () => {
+    test('top-level + nested + array 교체', () => {
+      const base = {
+        refid: 1,
+        type: 'rect',
+        left: 10,
+        threeD: { material: { color: '#f00', metalness: 0.5 } },
+        points: [
+          [0, 0],
+          [1, 1]
+        ]
+      }
+      const patch = {
+        left: 20,
+        threeD: { material: { color: '#0f0' } },
+        points: [[5, 5]]
+      }
+      const r1 = serverModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      const r2 = clientModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      expect(r1).toEqual(r2)
+    })
+
+    test('null = 키 제거 (서버 / 클라이언트 동일)', () => {
+      const base = { refid: 1, type: 'rect', threeD: { enabled: true } }
+      const patch = { threeD: null }
+      const r1 = serverModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      const r2 = clientModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      expect(r1).toEqual(r2)
+      expect('threeD' in r1).toBe(false)
+    })
+
+    test('nested null — deep merge 안에서도 키 제거 동일', () => {
+      // threeD 는 유지하되 그 안의 material 만 제거
+      const base = {
+        refid: 1,
+        type: 'rect',
+        threeD: { enabled: true, material: { color: '#f00', metalness: 0.5 } }
+      }
+      const patch = { threeD: { material: null } }
+      const r1 = serverModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      const r2 = clientModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      expect(r1).toEqual(r2)
+      // material 만 제거, threeD.enabled 는 보존
+      expect('material' in r1.threeD).toBe(false)
+      expect(r1.threeD.enabled).toBe(true)
+    })
+
+    test('mode 전환 케이스 — fillStyle: object → string 통째 replace', () => {
+      // 이번 세션의 실 발견 케이스 — gradient → solid 전환
+      const base = {
+        refid: 1,
+        type: 'rect',
+        fillStyle: { type: 'gradient', colorStops: [], rotation: 1.57 }
+      }
+      const patch = { fillStyle: '#ff0000' }
+      const r1 = serverModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      const r2 = clientModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1.fillStyle).toBe('#ff0000')
+    })
+
+    test('mode=none — fillStyle: null 으로 키 자체 제거', () => {
+      const base = {
+        refid: 1,
+        type: 'rect',
+        fillStyle: { type: 'pattern', image: 'x' }
+      }
+      const patch = { fillStyle: null }
+      const r1 = serverModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      const r2 = clientModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      expect(r1).toEqual(r2)
+      expect('fillStyle' in r1).toBe(false)
+    })
+
+    test('nested null + 다른 nested 변경 한 번에', () => {
+      const base = {
+        refid: 1,
+        type: 'rect',
+        threeD: {
+          material: { color: '#f00', metalness: 0.5, roughness: 0.3 }
+        }
+      }
+      const patch = {
+        threeD: {
+          material: { metalness: null, color: '#0f0' } // metalness 제거 + color 변경
+        }
+      }
+      const r1 = serverModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      const r2 = clientModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1.threeD.material).toEqual({ color: '#0f0', roughness: 0.3 })
+      expect('metalness' in r1.threeD.material).toBe(false)
+    })
+
+    test('배열은 deep-merge 안 함 — 통째 replace 동일', () => {
+      const base = {
+        refid: 1,
+        type: 'polyline',
+        points: [[0, 0], [10, 10], [20, 20]]
+      }
+      const patch = { points: [[5, 5]] }
+      const r1 = serverModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      const r2 = clientModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1.points).toEqual([[5, 5]])
+    })
+
+    test('base 에 없던 키 추가 — 양쪽 동일', () => {
+      const base = { refid: 1, type: 'rect' }
+      const patch = { left: 100, top: 50 }
+      const r1 = serverModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      const r2 = clientModule.mergeComponent(JSON.parse(JSON.stringify(base)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1).toEqual({ refid: 1, type: 'rect', left: 100, top: 50 })
+    })
+
+    test('input mutate 안 함 (양쪽 모두 pure)', () => {
+      const base = { refid: 1, type: 'rect', threeD: { material: { color: '#f00' } } }
+      const baseSnapshot = JSON.stringify(base)
+      const patch = { threeD: { material: { color: '#0f0' } } }
+      const patchSnapshot = JSON.stringify(patch)
+
+      serverModule.mergeComponent(base, patch)
+      expect(JSON.stringify(base)).toBe(baseSnapshot)
+      expect(JSON.stringify(patch)).toBe(patchSnapshot)
+
+      clientModule.mergeComponent(base, patch)
+      expect(JSON.stringify(base)).toBe(baseSnapshot)
+      expect(JSON.stringify(patch)).toBe(patchSnapshot)
+    })
+  })
+
+  describe('modifyBoard root-level merge — server (mergeBoardRoot) / client (mergeComponent reuse) 동등성', () => {
+    // 서버는 mergeBoardRoot/deepMergeRoot 별도 함수, 클라이언트는 mergeComponent 재사용.
+    // 결과는 동일해야 함.
+
+    test('root null = 키 제거', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        fillStyle: '#fff',
+        sky: 'studio',
+        components: []
+      }
+      const patch: any = {
+        ops: [{ op: 'modifyBoard', patch: { sky: null } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      expect('sky' in r1).toBe(false)
+    })
+
+    test('root nested object deep merge', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        translate: { x: 0, y: 0 },
+        components: []
+      }
+      const patch: any = {
+        ops: [{ op: 'modifyBoard', patch: { translate: { y: 50 } } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      // x 보존 + y 갱신
+      expect(r1.translate).toEqual({ x: 0, y: 50 })
+    })
+
+    test('root level fillStyle string replace', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        fillStyle: '#fff',
+        components: []
+      }
+      const patch: any = {
+        ops: [{ op: 'modifyBoard', patch: { fillStyle: '#0a1929' } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1.fillStyle).toBe('#0a1929')
+    })
+
+    test('root multi-key 동시 변경', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        fillStyle: '#fff',
+        sky: 'studio',
+        exposure: 1,
+        hemiIntensity: 4,
+        components: []
+      }
+      const patch: any = {
+        ops: [{
+          op: 'modifyBoard',
+          patch: {
+            sky: 'sunny',
+            exposure: 1.2,
+            hemiIntensity: 5,
+            dirLightColor: '#fff5e6'
+          }
+        }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+    })
+
+    test('modifyBoard 의 patch.components 는 무시됨 (자식은 별도 op)', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        components: [{ refid: 1, type: 'rect' }]
+      }
+      const patch: any = {
+        ops: [{
+          op: 'modifyBoard',
+          patch: { fillStyle: '#000', components: [] } // components 무시되어야
+        }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      // components 는 보존 (modifyBoard 의 components 무시)
+      expect(r1.components).toHaveLength(1)
+    })
+  })
+
+  describe('round-trip — applyOp ↔ computeInverseOp 으로 원본 복원', () => {
+    test('modify round-trip — 양쪽 동일하게 복원', () => {
+      const orig: any = {
+        width: 1000,
+        height: 600,
+        components: [{ refid: 1, type: 'rect', left: 10, top: 20, fillStyle: '#fff' }]
+      }
+      const op: any = { op: 'modify', refid: 1, patch: { left: 100, fillStyle: '#000' } }
+
+      // server
+      const sInv = serverModule.computeInverseOp(JSON.parse(JSON.stringify(orig)), op)!
+      const sAfter = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(orig)), {
+        ops: [op],
+        summary: '',
+        confidence: 1
+      })
+      const sRestored = serverModule.applyBoardEditPatch(sAfter, {
+        ops: [sInv],
+        summary: '',
+        confidence: 1
+      })
+
+      // client
+      const cInv = clientModule.computeInverseOp(JSON.parse(JSON.stringify(orig)), op)!
+      const cAfter = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(orig)), {
+        ops: [op],
+        summary: '',
+        confidence: 1
+      })
+      const cRestored = clientModule.applyBoardEditPatch(cAfter, {
+        ops: [cInv],
+        summary: '',
+        confidence: 1
+      })
+
+      // 원본과 일치
+      expect(sRestored).toEqual(orig)
+      expect(cRestored).toEqual(orig)
+      // 양쪽 동일
+      expect(sRestored).toEqual(cRestored)
+      expect(sInv).toEqual(cInv)
+    })
+
+    test('modify with new key — inverse 가 null (키 제거 시맨틱) 양쪽 동일', () => {
+      const orig: any = {
+        width: 1000,
+        height: 600,
+        components: [{ refid: 1, type: 'rect' }]
+      }
+      // 원본에 없던 fillStyle 추가
+      const op: any = { op: 'modify', refid: 1, patch: { fillStyle: '#ff0000' } }
+
+      const sInv: any = serverModule.computeInverseOp(orig, op)!
+      const cInv: any = clientModule.computeInverseOp(orig, op)!
+
+      // inverse 의 patch.fillStyle 가 null (원본에 없던 키 → 복원 시 제거)
+      expect(sInv.patch.fillStyle).toBeNull()
+      expect(cInv.patch.fillStyle).toBeNull()
+      expect(sInv).toEqual(cInv)
+
+      // round-trip — 원본 복원
+      const after = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(orig)), {
+        ops: [op], summary: '', confidence: 1
+      })
+      const restored = serverModule.applyBoardEditPatch(after, {
+        ops: [sInv], summary: '', confidence: 1
+      })
+      expect(restored).toEqual(orig)
+    })
+
+    test('remove → add inverse — 양쪽 동일 + round-trip 복원', () => {
+      const orig: any = {
+        width: 1000,
+        height: 600,
+        components: [
+          { refid: 1, type: 'rect', left: 10 },
+          { refid: 2, type: 'circle' }
+        ]
+      }
+      const op: any = { op: 'remove', refid: 1 }
+
+      const sInv = serverModule.computeInverseOp(JSON.parse(JSON.stringify(orig)), op)!
+      const cInv = clientModule.computeInverseOp(JSON.parse(JSON.stringify(orig)), op)!
+      expect(sInv).toEqual(cInv)
+
+      // round-trip
+      const after = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(orig)), {
+        ops: [op], summary: '', confidence: 1
+      })
+      const restored = serverModule.applyBoardEditPatch(after, {
+        ops: [sInv], summary: '', confidence: 1
+      })
+      // refid 1 컴포넌트 복원 (순서는 끝에 추가될 수 있음)
+      expect(restored.components.find((c: any) => c.refid === 1)).toEqual({
+        refid: 1,
+        type: 'rect',
+        left: 10
+      })
+    })
+  })
+
+  describe('nested components (group/container 자식) — deep search', () => {
+    const nestedBoard = () => ({
+      width: 1000,
+      height: 600,
+      components: [
+        { refid: 1, type: 'rect', left: 10 },
+        {
+          refid: 2,
+          type: 'group',
+          components: [
+            { refid: 3, type: 'rect', left: 20, fillStyle: '#fff' },
+            {
+              refid: 4,
+              type: 'group',
+              components: [{ refid: 5, type: 'circle', cx: 50 }]
+            }
+          ]
+        }
+      ]
+    })
+
+    test('modify 그룹 안 1단 자식 (refid 3) — 양쪽 동등', () => {
+      const board = nestedBoard()
+      const patch: any = {
+        ops: [{ op: 'modify', refid: 3, patch: { fillStyle: '#000' } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1.components[1].components[0].fillStyle).toBe('#000')
+      // 다른 가지 보존
+      expect(r1.components[0].refid).toBe(1)
+      expect(r1.components[1].components[1].refid).toBe(4)
+    })
+
+    test('modify 그룹 안 그룹 안 자식 (refid 5, 2단) — 양쪽 동등', () => {
+      const board = nestedBoard()
+      const patch: any = {
+        ops: [{ op: 'modify', refid: 5, patch: { cx: 999 } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1.components[1].components[1].components[0].cx).toBe(999)
+    })
+
+    test('remove 그룹 안 자식 — 자식만 제거, 부모 group 보존', () => {
+      const board = nestedBoard()
+      const patch: any = {
+        ops: [{ op: 'remove', refid: 3 }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      // group 자체는 보존, 자식은 1개만 (refid 4)
+      expect(r1.components[1].refid).toBe(2)
+      expect(r1.components[1].components).toHaveLength(1)
+      expect(r1.components[1].components[0].refid).toBe(4)
+    })
+
+    test('remove group 자체 — 그룹 + 자식들 모두 제거', () => {
+      const board = nestedBoard()
+      const patch: any = {
+        ops: [{ op: 'remove', refid: 2 }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      // top-level rect (refid 1) 만 남음
+      expect(r1.components).toHaveLength(1)
+      expect(r1.components[0].refid).toBe(1)
+    })
+
+    test('computeInverseOp modify nested — 양쪽 inverse 동등 + round-trip', () => {
+      const orig = nestedBoard()
+      const op: any = { op: 'modify', refid: 5, patch: { cx: 999 } }
+      const sInv = serverModule.computeInverseOp(JSON.parse(JSON.stringify(orig)), op)!
+      const cInv = clientModule.computeInverseOp(JSON.parse(JSON.stringify(orig)), op)!
+      expect(sInv).toEqual(cInv)
+      // 원래 cx 50 으로 복원
+      expect((sInv as any).patch.cx).toBe(50)
+
+      // round-trip
+      const after = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(orig)), {
+        ops: [op], summary: '', confidence: 1
+      })
+      const restored = serverModule.applyBoardEditPatch(after, {
+        ops: [sInv], summary: '', confidence: 1
+      })
+      expect(restored).toEqual(orig)
+    })
+
+    test('존재 안 하는 refid (그룹 자식 어디에도) — silent no-op', () => {
+      const board = nestedBoard()
+      const patch: any = {
+        ops: [{ op: 'modify', refid: 999, patch: { left: 0 } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1).toEqual(board)  // 변경 없음
+    })
+
+    test('빈 group — 그대로 보존', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        components: [{ refid: 1, type: 'group', components: [] }]
+      }
+      const patch: any = {
+        ops: [{ op: 'modify', refid: 999, patch: { left: 0 } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+    })
+  })
+
+  describe('edge cases — 양쪽 동일 동작 보장', () => {
+    test('빈 ops 배열 — 보드 변경 없음', () => {
+      const board: any = { width: 1000, height: 600, components: [] }
+      const patch: any = { ops: [], summary: '', confidence: 1 }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1).toEqual(board)
+    })
+
+    test('undefined board → 양쪽 동일 fallback', () => {
+      const patch: any = {
+        ops: [{ op: 'modifyBoard', patch: { fillStyle: '#000' } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(undefined, patch)
+      const r2 = clientModule.applyBoardEditPatch(undefined, patch)
+      expect(r1).toEqual(r2)
+    })
+
+    test('존재 안 하는 refid 로 modify — 양쪽 silent no-op', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        components: [{ refid: 1, type: 'rect' }]
+      }
+      const patch: any = {
+        ops: [{ op: 'modify', refid: 999, patch: { left: 100 } }],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      // 보드 변경 없음 (verbose 측에선 missed 분류)
+      const v1: any = serverModule.applyBoardEditPatchVerbose(
+        JSON.parse(JSON.stringify(board)),
+        patch
+      )
+      const v2: any = clientModule.applyBoardEditPatchVerbose(
+        JSON.parse(JSON.stringify(board)),
+        patch
+      )
+      expect(v1.missed.length).toBe(1)
+      expect(v2.missed.length).toBe(1)
+    })
+
+    test('동일 refid 에 대한 연속 modify — 누적 적용', () => {
+      const board: any = {
+        width: 1000,
+        height: 600,
+        components: [{ refid: 1, type: 'rect', left: 0, top: 0 }]
+      }
+      const patch: any = {
+        ops: [
+          { op: 'modify', refid: 1, patch: { left: 10 } },
+          { op: 'modify', refid: 1, patch: { top: 20 } },
+          { op: 'modify', refid: 1, patch: { left: 100 } }
+        ],
+        summary: '',
+        confidence: 1
+      }
+      const r1 = serverModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      const r2 = clientModule.applyBoardEditPatch(JSON.parse(JSON.stringify(board)), patch)
+      expect(r1).toEqual(r2)
+      expect(r1.components[0]).toEqual({
+        refid: 1,
+        type: 'rect',
+        left: 100, // 마지막 값
+        top: 20
+      })
+    })
+  })
+})