An experimental implementation of how to take the open source ProseMirror rich text editor and enable real-time coauthoring using the Fluid Framework.
If you want to run this example follow the following steps:
- Run
npm installfrom theFluidFrameworkroot directory - Navigate to this directory
- Run
npm run start
ProseMirror uses the following distributed data structures:
- SharedDirectory - root
- SharedString - storing ProseMirror text
This implementation stores the HTML output of the ProseMirror editor onto the SharedString. While this enables collaboration it does not provide for a complete editor. Because rich editing features (ex. bold/italic) are stored as HTML tags along with the text this can cause conflicts with multiple users applying conflicting styles resulting in lost opening/closure tags.
A more complete solution would use the SharedString property bag to apply styles across text ranges. This allows for styles to be merged in a more deterministic way.