Merge pull request #35982 from overleaf/mg-history-ot-comments

HistoryOT - Fix comments being dropped and crashing on detached ranges

GitOrigin-RevId: 0906a55a51a6fda9ac828efcbe72989573161261

services/web/test/frontend/features/source-editor/extensions/history-ot.test.ts

@@ -1,12 +1,15 @@
 import { expect } from 'chai'
 import { EditorState, Transaction, TransactionSpec } from '@codemirror/state'
 import {
+  AddCommentOperation,
+  Range,
   StringFileData,
   TextOperation,
   TrackingProps,
 } from 'overleaf-editor-core'
 import {
   historyOT,
+  rangesState,
   setTrackChangesUserId,
 } from '@/features/source-editor/extensions/history-ot'
 import { DocumentContainer } from '@/features/ide-react/editor/document-container'
@@ -81,9 +84,28 @@ function setup(
     edit(spec: TransactionSpec) {
       state = state.update(spec).state
     },
+    getState() {
+      return state
+    },
   }
 }
 
+describe('historyOT rangesState', function () {
+  it('applies a tracked delete covering a commented range without crashing', function () {
+    const snapshot = snapshotWithTrackedDeletes('one two three')
+    new AddCommentOperation('c1', [new Range(4, 3)]).apply(snapshot)
+    const { edit, getState } = setup(snapshot)
+
+    // tracked-delete "two ": the comment's range is fully hidden, so no mark
+    edit({ changes: { from: 4, to: 8 } })
+
+    expect(getState().doc.toString()).to.equal('one three')
+    const { decorations } = getState().field(rangesState)
+    // the tracked-delete widget only — no empty comment mark
+    expect(decorations.size).to.equal(1)
+  })
+})
+
 describe('historyOT updateSender', function () {
   describe('when the transaction does not change the document', function () {
     it('should not submit an operation', function () {

services/web/test/frontend/features/source-editor/extensions/realtime.test.ts

@@ -1,8 +1,23 @@
 import sinon from 'sinon'
 import { expect } from 'chai'
+import { EventEmitter } from 'events'
 import { EditorFacade } from '../../../../../frontend/js/features/source-editor/extensions/realtime'
+import {
+  historyOT,
+  rangesState,
+} from '../../../../../frontend/js/features/source-editor/extensions/history-ot'
 import { EditorView } from '@codemirror/view'
 import { EditorState } from '@codemirror/state'
+import {
+  AddCommentOperation,
+  EditOperation,
+  Range,
+  SetCommentStateOperation,
+  StringFileData,
+  TextOperation,
+  TrackingProps,
+} from 'overleaf-editor-core'
+import { historyOTType } from '../../../../../frontend/js/features/ide-react/editor/share-js-history-ot-type'
 
 describe('CodeMirror EditorFacade', function () {
   let state: EditorState, view: EditorView
@@ -64,3 +79,171 @@ describe('CodeMirror EditorFacade', function () {
     expect(shareDoc.detach_cm6).to.be.a('function')
   })
 })
+
+describe('HistoryOTAdapter remote ops', function () {
+  const tick = () => new Promise(resolve => setTimeout(resolve, 0))
+
+  const snapshotWithTrackedDelete = (
+    content: string,
+    { pos, length }: { pos: number; length: number }
+  ) => {
+    const snapshot = new StringFileData(content)
+    const op = new TextOperation()
+    if (pos > 0) {
+      op.retain(pos)
+    }
+    op.retain(length, {
+      tracking: new TrackingProps(
+        'delete',
+        'user-1',
+        new Date('2025-01-01T00:00:00.000Z')
+      ),
+    })
+    if (pos + length < content.length) {
+      op.retain(content.length - pos - length)
+    }
+    snapshot.edit(op)
+    return snapshot
+  }
+
+  const setup = (contentOrSnapshot: string | StringFileData) => {
+    const snapshot =
+      typeof contentOrSnapshot === 'string'
+        ? new StringFileData(contentOrSnapshot)
+        : contentOrSnapshot
+
+    const shareDoc = Object.assign(new EventEmitter(), {
+      otType: 'history-ot',
+      snapshot,
+      getText: () =>
+        shareDoc.snapshot.getContent({ filterTrackedDeletes: true }),
+    })
+
+    const errors: unknown[] = []
+    shareDoc.on('error', (error: unknown) => errors.push(error))
+
+    // Emit a remote batch like sharejs `_otApply`: set the post-batch snapshot
+    // first, then pass the old snapshot as the 2nd arg (vendor/libs/sharejs.js).
+    const applyRemote = (operations: EditOperation[]) => {
+      const oldSnapshot = shareDoc.snapshot
+      shareDoc.snapshot = historyOTType.apply(oldSnapshot, operations)
+      shareDoc.emit('remoteop', operations, oldSnapshot)
+    }
+
+    const currentDoc = {
+      historyOTShareDoc: shareDoc,
+      doc: { _doc: shareDoc },
+    }
+    const state = EditorState.create({
+      doc: snapshot.getContent({ filterTrackedDeletes: true }),
+      extensions: [historyOT(currentDoc as any)],
+    })
+    const view = new EditorView({ state })
+    const editor = new EditorFacade(view)
+    editor.attachShareJs(shareDoc as any)
+
+    return { view, shareDoc, errors, applyRemote }
+  }
+
+  it('refreshes comment decorations when a remote AddCommentOperation arrives', async function () {
+    const { view, errors, applyRemote } = setup('hello world')
+    expect(view.state.field(rangesState).decorations.size).to.equal(0)
+
+    applyRemote([new AddCommentOperation('thread-1', [new Range(0, 5)])])
+
+    expect(view.state.field(rangesState).comments.length).to.equal(1)
+    expect(view.state.field(rangesState).decorations.size).to.equal(1)
+    await tick()
+    expect(errors).to.deep.equal([])
+  })
+
+  it('drops the decoration when a remote SetCommentStateOperation resolves it', async function () {
+    const snapshot = new StringFileData('hello world')
+    new AddCommentOperation('thread-1', [new Range(0, 5)]).apply(snapshot)
+    const { view, errors, applyRemote } = setup(snapshot)
+    expect(view.state.field(rangesState).decorations.size).to.equal(1)
+
+    applyRemote([new SetCommentStateOperation('thread-1', true)])
+
+    expect(view.state.field(rangesState).decorations.size).to.equal(0)
+    await tick()
+    expect(errors).to.deep.equal([])
+  })
+
+  it('interprets each operation against the document produced by the previous one', async function () {
+    const { view, shareDoc, errors, applyRemote } = setup('abc')
+
+    const opA = new TextOperation()
+    opA.remove(1)
+    opA.retain(2)
+
+    const opB = new TextOperation()
+    opB.retain(2)
+    opB.insert('X')
+
+    applyRemote([opA, opB])
+
+    expect(shareDoc.snapshot.getContent()).to.equal('bcX')
+    expect(view.state.doc.toString()).to.equal('bcX')
+    await tick()
+    expect(errors).to.deep.equal([])
+  })
+
+  it('maps positions through tracked deletes advanced by earlier operations', async function () {
+    const { view, shareDoc, errors, applyRemote } = setup(
+      snapshotWithTrackedDelete('AAAAddBBBB', { pos: 4, length: 2 })
+    )
+    expect(view.state.doc.toString()).to.equal('AAAABBBB')
+
+    const opA = new TextOperation()
+    opA.remove(4)
+    opA.retain(6)
+
+    const opB = new TextOperation()
+    opB.retain(6)
+    opB.insert('X')
+
+    applyRemote([opA, opB])
+
+    expect(
+      shareDoc.snapshot.getContent({ filterTrackedDeletes: true })
+    ).to.equal('BBBBX')
+    expect(view.state.doc.toString()).to.equal('BBBBX')
+    await tick()
+    expect(errors).to.deep.equal([])
+  })
+
+  it('stops applying a batch that does not fit the snapshot', async function () {
+    const { view, shareDoc, errors } = setup('abc')
+    // flush the attach-time content check while still in sync
+    await tick()
+
+    const opA = new TextOperation()
+    opA.remove(1)
+    opA.retain(2)
+
+    const opB = new TextOperation()
+    opB.retain(2)
+    opB.insert('X')
+
+    // an oldSnapshot the ops cannot apply to: the local advance throws and the
+    // rest of the batch must not reach the editor
+    shareDoc.emit('remoteop', [opA, opB], new StringFileData('xy'))
+
+    expect(errors).to.have.length(1)
+    expect(view.state.doc.toString()).to.equal('abc')
+  })
+
+  it('reports divergence between the editor and the snapshot after a remote op', async function () {
+    const { shareDoc, errors } = setup('abc')
+    // flush the attach-time content check while still in sync
+    await tick()
+    expect(errors).to.deep.equal([])
+
+    shareDoc.snapshot = new StringFileData('abcd')
+    shareDoc.emit('remoteop', [])
+
+    await tick()
+    expect(errors).to.have.length(1)
+  })
+})