Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
    Kevin Jahns
    Welcome Dmitry. The local undo/redo history does not work at the moment. I will work on it this week and let you know when I'm done
    Séverine Darlot
    Hello, we would like to try Yjs with ace. But when I follow the tutorial for Yjs 13 on https://github.com/y-js/yjs/blob/master/README.v13.md, the y-textarea repository is empty. Is it too soon to use Yjs 13? Or the documentation is out-of-date?
    What is your point of view? Thank you.
    Kevin Jahns
    Hi @severinedarlot
    I encourage you to use v13 (although it is still in beta). I need to work on the documentation - but the API documented in README.v13.md is stable and working.
    In the tutorial section I wanted to give an example of how to use Yjs. The y-textarea binding does not exist yet - currently we only have Monaco, QuillJS, and ProseMirror support. Next week I will add the missing bindings (the ones I already advertise in the README. I just haven't ported them to the new API).
    Séverine Darlot
    @dmonad Thank you for these advice and these information
    Kevin Jahns
    @dmikoss UndoManager just landed in Yjs https://github.com/y-js/yjs/blob/master/README.v13.md#YUndoManager
    I also added an undo plugin to y-prosemirror. https://github.com/y-js/yjs-demos/blob/master/prosemirror/index.js
    For the quill demo, you can actually just use their history plugin. For Quill, it really doesn't make a difference if you use Quills undo manager or Yjs undo manager. To enable selective undo in Quill, you basically just have to configure the undo plugin with userOnly: true (see https://github.com/y-js/yjs-demos/blob/master/quill/index.js).
    Dmitry Kostenkov
    @dmonad Thank you for your work. Can these demos work in edge and ie11? i got errors. See these issue: y-js/yjs-demos#1
    Kevin Jahns
    They can - but at the moment I don't convert the source to es5 which is why it doesn't work.
    Dmitry Kostenkov
    @dmonad what about Edge? It support es6 as i know
    Kevin Jahns
    I just debugged it with a friends computer - the problem with edge is that the url is created incorrectly. It tries to connect to wss:yjs-demos.now.sh instead of wss://yjs-demos.now.sh. Apparantly window.location works differently than in chrome and firefox.
    Thanks for noticing! I'd be happy to receive a PR for this. Otherwise I'm gonna fix it tomorrow. I'm off to my day-job.
    Dmitry Kostenkov
    @dmonad Hi Kevin. Find small bug in prosemirror demo (cursor and selection pops). https://youtu.be/OF_4_zSkuoI
    Kevin Jahns
    Thanks @dmikoss You can just report it to https://github.com/y-js/y-prosemirror
    Kevin Forest
    @dmonad . Hi Kevin, is the persistence db server working with https://github.com/y-js/y-websocket? The https://github.com/y-js/y-leveldb doesn't seem to have been updated for yjs v13?
    Kevin Forest
    const LevelDbPersistence = require('y-leveldb').LevelDbPersistence in y-websocket does not exist. Is there a reference implementation for that persistence function?
    Hi all, question about the 'y-websocket' package. Is this package still available through npm? I am trying to follow the tutorial but I am running into issues installing 'y-websocket'.
    Kevin Jahns
    @kevmegforest_gitlab You can enable persistence PORT=1234 YPERSISTENCE=./dbDir node ./node_modules/y-websocket/bin/server.js (see y-websocket docs). y-leveldb only works with v12
    @rafeautie Yes, it is available via npm. Can you give me a an error message.
    username$ npm i y-websocket
    npm WARN y-websockets-client@8.0.16 requires a peer of yjs@^11.0.0 || ^12.0.0 but none is installed. You must install peer dependencies yourself.
    npm WARN client@1.0.0 No description
    npm WARN client@1.0.0 No repository field.
    npm ERR! path /Users/username/Desktop/Projects/YJS/react-yjs-test/node_modules/y-websocket/bin/server.js
    npm ERR! code ENOENT
    npm ERR! errno -2
    npm ERR! syscall chmod
    npm ERR! enoent ENOENT: no such file or directory, chmod '/Users/username/Desktop/Projects/YJS/react-yjs-test/node_modules/y-websocket/bin/server.js'
    npm ERR! enoent This is related to npm not being able to find a file.
    npm ERR! enoent
    @dmonad Hey Kevin, thanks for the great work on Yjs, it's a really cool project. I've got a question: What's the recommended way to achieve persistent storage with Yjs 13? I'm trying to add persistent storage to y-prosemirror, and y-leveldb is not working (getting the same error as @kevmegforest_gitlab ).
    Kevin Forest
    @timweiland I created my own persistence with a y-leveldb.js file. You can take a look there. https://pastebin.com/5SuefhUC . I don't know if it's the right solution and if I will be able to update the y-websocket version with new yjs version once it's updated. (is the encodeStateAsUpdate method final? @dmonad )
    I slightly modified the old version of level db persistence lib in order to get it work with new yjs. Probably it should perform better than the lib proposed by @kevmegforest_gitlab because it doesn't write the whole document on every update, but only the update itself. Here you can get it https://gist.github.com/calibr/c8764d796db270c7c60460f254451580
    @rafeautie it's trying to grab the package y-websockets-client which is different. Try the command npm i y-websocket@next
    Thanks for all of your work on Yjs @dmonad! I've got a question on Authentication in v13. Is authentication functional like it was in v12, or is this still on your to-do list?
    Hi! Does anyone know how to find out how many clients there are in a yjs room?
    Using websockets
    Dominik Renzel
    Hey @dmonad, nice to see that yjs is still so active and popular after all those years! What is the preferred way of defining custom types in yjs 12? I assume, docs at https://github.com/y-js/yjs/wiki/Custom-Types are outdated? Is there any reference I could follow to implement an own custom type, nesting other custom types?
    Duane Johnson
    I wonder if yjs and Braid would make sense together: https://braid.news
      Braid is a proposal for a new version of HTTP that transforms it from
      a state *transfer* protocol into a state *synchronization* protocol.
      Braid puts the power of Operational Transform and CRDTs onto the web,
      improving network performance and robustness, and enabling
      peer-to-peer web applications.
      At the same time, Braid creates an open standard for the dynamic
      internal state of websites.  Programmers can access state uniformly,
      whether local or on another website.  This creates a separation of UI
      from State, and allows any user to edit or choose their own UI for any
      website's state.
    I tried to read the author's paper to understand the principle of Yjs, but it was too difficult for me. Is there any good suggestion or information recommendation, google has nothing to gain 💔
    Hi, I have integrated the Yjs library in my React Application, but can anyone help me out how can i get the data from the Quill and i want to save that data into my database Sql
    Hi, i have integrated Yjs and quill editor library V13 with y-websockets,but i can't able to get documentation related how to get users connected to same room and disconnection
    Kevin Jahns

    @rafeautie If you get issues like this I propose that you have a look at the versions I use in the demos. https://github.com/y-js/yjs-demos Documentation PRs are very welcome.

    @kevmegforest_gitlab Yes, the encodeStateAsUpdate is final. Everything in the v13 docs can be seen as final unless there is a good reason to change it before the stable release.

    @crazypenguinguy If you look at the y-websocket server implementation you can see that there are comments on where to put the authentication. The yjs-demos repository also gives an example on how you could implement your own server with dedicated authentication. The idea here would be to use cookies. But you could also adapt the implementation to use something else.

    @jylopez The awareness instance gives you the number of clients. Users can even propagate state (like user name, email, user-color, etc). The awareneness feature is supported by y-websocket and will be ported to the other connectors as well (v13 only). Documentation https://github.com/y-js/y-protocols

    @canadaduane I think they are proposing a different algorithm. IMO this should be not part of the HTTP specification, rather it should be implemented over websockets.

    Many of the other questions have been asked in the GitHub issue tracker already.

    Kevin Jahns
    @nmaster Hey Dominik, the docs you mentioned are still correct for v12. But custom types won't be supported anymore in v13. Yjs implements the basic types and you can build your application around it. I know some folks that create a wrapper around Yjs that basically act as custom types. For more information about the new API look here https://github.com/y-js/yjs/blob/master/README.v13.md
    Winston Fassett
    I hacked together a port of the drawing example to v13: https://codesandbox.io/s/yjs-v13-drawing-example-3fouz
    Previously YJS events had type and value properties that would indicate whether it was an insert and what was inserted
    For V13 I cobbled together a couple of functions, getInsertedItems and getDeletedItems.
    @dmonad is there a better way to determine the inserts and deletes that were applied to a type during a transaction?
    Kevin Jahns

    Really cool @WinstonFassett ! I love to see demos here. If you want you can also contribute the demo to yjs-demos repository
    The next release (>=v13.0.0-97) attaches a change object to the event that describes what happened during the transaction. I.e.

    array.observe(event => { 
      event.change.delta // similar to the quill delta format but works on all array-like types
      // e.g. [{retain: 4}, {delete: 3}, {insert: [1,2,3]}]
      event.change.added // Set of added items
      event.change.deleted // Set of deleted items
    map.observe(event => {
      event.change.keys // Maps from changed key to { action: 'update'|'delete'|'add', oldValue: any }

    Please note that the API for event changes is not final, hence also not yet in the documentation. But I'd appreciate your feedback

    Also a message of disturbance: I'm going to move all repositories to the github.com/yjs organization. Please let me know if this brakes anything.

    Important: I'm going to move all repositories to the github.com/yjs organization. Please let me know if this breakes anything.

    Kevin Jahns

    Now that we have a new organization-name, I also decided to move this chat-room to https://gitter.im/Yjs/community

    This chat-room moved to https://gitter.im/Yjs/community

    Please don't post anything here anymore.

    hi again! has anyone made an AceEditor binding for version 13? can seem to find it in the docs.
    lol just read the "This chat-room moved" message
    Damian Kaczmarek
    @rafeautie I made an integration by hand which wasn't very hard :)
    @rafeautie for example:
          for (const d of event.delta) {
            if (d.retain) {
              index += d.retain;
            } else if (d.insert) {
              const start = aceDocument.indexToPosition(index, 0);
              aceDocument.insert(start, d.insert);
            } else if (d.delete) {
              const start = aceDocument.indexToPosition(index, 0);
              const end = aceDocument.indexToPosition(index + d.delete, 0);
              const range = new Range(start.row, start.column, end.row, end.column);
    //there is an error :ReferenceError: WebSocket is not defined
    //at new WebsocketProvider (F:\node-yjs\demo\yjs-demos\prosemirror\node_modules\y-websocket\dist\y-websocket.cjs:194:25)

    const Y = require('yjs')
    const { WebsocketProvider } = require('y-websocket')

    const ydoc = new Y.Doc()

    const provider = new WebsocketProvider('wss://demos.yjs.dev', 'prosemirror-demo', ydoc)

    Hi, is there a way to set an initial state for Y.Text before the documents get synced?