Merge pull request #41 from Automattic/fix/collab-debounce

Collab: Remove debounce
Automattic · Aug 23, 2021 · 110d5e3 · 110d5e3
2 parents 572c438 + 6e26cd0
commit 110d5e3
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 11 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -9,6 +9,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - Fix handling of initial content from `onLoad` when collaborative editing is enabled
+- Improved reliability of collaborative editing when multiple peers are typing simultaneously
 
 ## [2.3.0] - 2021-07-29
 

diff --git a/src/components/block-editor-contents/use-yjs/index.js b/src/components/block-editor-contents/use-yjs/index.js
@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { v4 as uuidv4 } from 'uuid';
-import { debounce, noop, sample } from 'lodash';
+import { noop, sample } from 'lodash';
 import { createDocument } from './yjs-doc';
 import { postDocToObject, updatePostDoc } from './algorithms/yjs';
 
@@ -23,7 +23,6 @@ const debug = require( 'debug' )( 'iso-editor:collab' );
 /** @typedef {import('../../..').EditorSelection} EditorSelection */
 /** @typedef {import('..').OnUpdate} OnUpdate */
 
-const DEBOUNCE_WAIT_MS = 800;
 const defaultColors = [ '#4676C0', '#6F6EBE', '#9063B6', '#C3498D', '#9E6D14', '#3B4856', '#4A807A' ];
 
 /**
@@ -182,11 +181,13 @@ export default function useYjs( { blocks, onRemoteDataChange, settings } ) {
 				disconnect();
 			};
 
-			applyChangesToYjs.current = debounce( ( blocks ) => {
+			applyChangesToYjs.current = ( blocks ) => {
+				if ( doc.getState() !== 'on' ) {
+					return;
+				}
 				debug( 'local changes applied to ydoc' );
-
 				doc.applyDataChanges( { blocks } );
-			}, DEBOUNCE_WAIT_MS );
+			};
 		} );
 
 		return () => onUnmount();

diff --git a/src/components/formats/collab-caret/style.scss b/src/components/formats/collab-caret/style.scss
@@ -27,7 +27,7 @@ mark.iso-editor-collab-caret.is-shifted::before {
 mark.iso-editor-collab-caret::after {
 	position: absolute;
 	top: -14px;
-	left: -4px;
+	right: -4px;
 	overflow: hidden;
 	min-width: 8px;
 	max-width: 140px;
@@ -46,8 +46,3 @@ mark.iso-editor-collab-caret::after {
 	font-style: normal;
 	font-weight: normal;
 }
-
-mark.iso-editor-collab-caret.is-shifted::after {
-	left: auto;
-	right: -4px;
-}