cudr / slate-collaborative Goto Github PK

(Firstly, I'd like to reiterate my thanks for making this library. I'm making a lot of issues these days, and I would like to hop in and help fix them, not just raise problems!)

TL;DR: Transforms.collapse(editor, { edge: "end" }); seems to crash other subscribers (not the client that runs this code). Other clients throw Unknown docId errors. I was able to find an acceptable work-around, which was to replace it with Transforms.deselect(editor);

I have a link feature in my slate editor. When I use it, connected clients who are not the typer (subscribers), have the editor crash.

I can't quite pin down what the error is. The first that I see is Unknown docId which is thrown here

TypeError: Unknown docId: /db291db4-aced-4691-bee2-dc42957b0742!
    at _callee$ (automerge-editor.ts:63)
    at tryCatch (runtime.js:45)
    at Generator.invoke [as _invoke] (runtime.js:274)
    at Generator.prototype.<computed> [as next] (runtime.js:97)
    at asyncGeneratorStep (automerge-editor.ts:5)
    at _next (automerge-editor.ts:5)
    at automerge-editor.ts:5
    at new Promise (<anonymous>)
    at Object.<anonymous> (automerge-editor.ts:5)
    at Object.applySlateOps (automerge-editor.ts:53)
    at Object.e.onChange (withAutomerge.ts:75)
    at create-editor.ts:86

TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'Socket'
    |     property 'io' -> object with constructor 'Manager'
    |     property 'nsps' -> object with constructor 'Object'
    --- property '/db291db4-aced-4691-bee2-dc42957b0742' closes the circle
    at JSON.stringify (<anonymous>)
    at Object.get (node.ts:244)
    at Object.node (editor.ts:607)
    at editor.ts:761
    at Object.withoutNormalizing (editor.ts:1587)
    at Object.normalize (editor.ts:749)
    at apply (create-editor.ts:74)
    at e.apply (with-history.ts:110)
    at Object.e.apply (with-react.ts:52)
    at automerge-editor.ts:130
    at Array.forEach (<anonymous>)
    at automerge-editor.ts:129
    at Object.withoutNormalizing (editor.ts:1587)
    at Object.applyOperation (automerge-editor.ts:128)
    at Object.e.receiveOperation (withAutomerge.ts:100)
    at Object.e.receive (withSocketIO.ts:106)
    at Socket.<anonymous> (withSocketIO.ts:71)
    at Socket.Emitter.emit (index.js:133)
    at Socket.onevent (socket.js:278)
    at Socket.onpacket (socket.js:236)
    at Manager.<anonymous> (index.js:21)
    at Manager.Emitter.emit (index.js:133)
    at Manager.ondecoded (manager.js:345)
    at Decoder.<anonymous> (index.js:21)
    at Decoder.Emitter.emit (index.js:133)
    at Decoder.add (index.js:251)
    at Manager.ondata (manager.js:335)
    at Socket.<anonymous> (index.js:21)
    at Socket.Emitter.emit (index.js:145)
    at Socket.onPacket (socket.js:461)
    at WS.<anonymous> (socket.js:278)
    at WS.Emitter.emit (index.js:145)
    at WS.Transport.onPacket (transport.js:149)
    at WS.Transport.onData (transport.js:141)
    at WebSocket.ws.onmessage (websocket.js:160)

export const wrapLink = (editor, url) => {
  if (isLinkActive(editor)) {
    unwrapLink(editor);
  }

  const { selection } = editor;
  const isCollapsed = selection && Range.isCollapsed(selection);
  const link = {
    type: "link",
    href: url,
    children: isCollapsed ? [{ text: url }] : []
  };

  if (isCollapsed) {
    Transforms.insertNodes(editor, link);
  } else {
    Transforms.wrapNodes(editor, link, { split: true });
    // 👇 👇 👇 THIS CODE IS THE LINE THAT BROKE IT
    // Transforms.collapse(editor, { edge: "end" });
    // 👇 👇 👇 THIS IS WHAT I ADDED THAT WORKED.
    Transforms.deselect(editor);
  }
};

In my project when you make a new line at the beginning of a paragrah, other connected clients see the line repeating n times, where n is the number of new lines entered. It's hard to explain, here's a video:

https://www.loom.com/share/f629c804bdaf4e77bc24d190cb7b67fd

Is it possible to use the firebase realtime database as the backend ?

Hi! Love this plugin!! I cannot make it work with latest Slate API and the plugins example in the docs:
https://docs.slatejs.org/concepts/07-plugins

Will this plugin work with the latest Slate API? Can the plugin documentation be updated?

Thanks

Device (please complete the following information):

• OS: MacOS
• Browser: chrome 87.0.4280.88
• Version of slate 0.59.0
• Version of slate-collaborative 0.7.0

Describe the bug
When I import the slate-collaborative in my project, it's caught an error when running: ReferenceError: regeneratorRuntime is not defined. This error occurs at automerge-editor.ts and I can't solve this even I add transform-runtime at babel configuration.

I think the onDocumentLoad() return type needs to be Promise<Element[]> | Element[]
https://github.com/cudr/slate-collaborative/blob/master/packages/backend/src/SocketIOConnection.ts#L23

I cloned the repo and installed respective packages as per the instruction

yarn
yarn dev

After compilation, it opens a new window but http://localhost:3000 returns the timeout. Since it uses react-scripts underneath, I'm not sure why I'm unable to see the app and it gives timeout!

Please help on above so I can run and check the example locally

Hey! Im trying to set up the "@slate-collaborative/backend" side of the project with "yarn add @slate-collaborative/backend". but after it runs it throws this error : Can't resolve 'uws' in '/Users////' @ dll renderer renderer[138] ' & ERROR in ./node_modules/engine.io/lib/server.js
Module not found: Error: Can't resolve 'uws' in '/Users/////node_modules/engine.io/lib'

Stack: Electron 7, Node.js, and "slate": "^0.58" .

Thanks.

If I load up two different browsers with slate-collaborative's demo open and each with their own slug, I see socket traffic in Browser 2 for every keystroke I make in Browser 1.

Any plans to add a license?

This is awesome!

Are there any plans to port this to Slate 0.5x?

Automerge 1.0dramatically change theAPI`:

https://github.com/automerge/automerge

https://github.com/automerge/automerge/blob/main/CHANGELOG.md

Thus, what has been deployed here has to be upgraded accordingly

Thank you for the great work. This is more of a question. I started playing with the lib and discovered that the webSocket server plays a central role. As Automerge is pitched as a "serverless" solution compared to OT, I'm trying to figure out how a serverless slate-collaborative could look like.

Right now, the server is responsible for the initial coordination. When clients connect to it. It creates an Automerge doc out of a Slate Value, creates an Automerge connection, then sets the doc with setDoc.
setDoc (on the server) fires an operation message with the initial Clock. Doing so, it's guaranteed that clients starts off the same clock. (correct me if I'm wrong)

In a serverless world, let's say we use PubSub to send and subscribe to operations, how could we possibly start off the same clock? Clients need to run setDoc but, by doing so, they send different initial clocks to each other.
Is it impossible to achieve this setup?

Thank you

Hi there!

I'm really enjoying playing around with this project. I think it'd be great if there were a way to resolve the cursor name on the backend instead of the frontend. In my case, I want to send a jwt to the backend over a websocket and then use that to resolve a name, instead of trusting the client.

Strange behavior when editing text online and offline at the same time

1. @cudr can I use the real time database Read data once capability to read the initial data then listen for updates on the documents.

2. Is this possible and where would I connect the function ?

3. Instead of having real time updates how do I implement the sync with a click of a button ?

Welcome any ideas about plugin and microservice API

Is there any plan to support AWS AppSync as backend?

Or any advice and guidance for implementing that?

Hi, thank you for making a great plugin.

We previously created our own plugin for our company based on this repository.
I'd like to share some points we noticed when we created it. We deleted it in the end because we no longer need collaborative editing features, though.
This is not an issue, so you can close this “issue” after you read it. I just want to pay you back.
I'm sorry I haven't had time to put out PRs.

Scalability of backend servers

As mentioned in this issue, there is a demand for making backend servers scalable.
We've scaled our servers through Redis.
Use this if you need it. https://github.com/kazekyo/automerge-spider

Eliminating the use of catch

https://github.com/cudr/slate-collaborative/search?q=catch&unscoped_q=catch
catch is used in this repository. I think this is dangerous.
Those catch break the synchronization of Automerge <=> Slate or Client <=> Backend(especially, vector clock synchronization in Automerge.Connection). In most cases, there is no automatic recovery.
This leads to claims like "Hey, the text I wrote wasn't saved!".
If there are errors that you can't resolve as a result of removing the catch, I will be happy to help you with your investigation.

Eliminating the use of temporary tree

https://github.com/cudr/slate-collaborative/blob/master/packages/bridge/src/convert/index.ts#L30-L35
I know this is not your idea, but I don’t think the temporary tree is a good idea.
If the create operation is not included in the Diff, no elements will be created in the temporary tree. So set_node may not work properly.
Also, using a temporary tree makes the code more complex.
Anyway, it is safer to generate slate operations with the docs before and after applying Diff.
I'll share the code.
https://github.com/kazekyo/collaborative-editing-fragment/blob/master/generateSlateOperation.ts#L198-L235

This is a part of our code that we can share. We didn't use cursors, so we don't have any code associated with them.
https://github.com/kazekyo/collaborative-editing-fragment

Again, thank you so much! You've saved us a lot of time.

Hi @cudr

I am very appreciate your work about this project.

We are currently using SlateJS 0.47.9 in JS.

If we would like to use your plugin how could I do it?

Do you know what is the implementation which is just to compare the Slate json object by using Automerge offline.

Thank you very much.

If I have mulitple backend server, how can I sync the docment state between them.
Use redis pub/sub, or other?