yjs / y-monaco Goto Github PK

With the example CSS from here https://github.com/yjs/yjs-demos/blob/ad78d0554de2407bcddb8b9ac09b9bd0e4dc3dbe/monaco/index.html#L12, all users will have orange cursors.

In my application, each user is given a unique color and it would be beneficial to have some way to set the color for the cursor inside Monaco. I can't seem to find any such feature at the moment as only yRemoteSelection is added to all cursors when there are many of them

Checklist

• Are you reporting a bug? Use github issues for bug reports and feature requests. For general questions, please use https://discuss.yjs.dev/
• Try to report your issue in the correct repository. Yjs consists of many modules. When in doubt, report it to https://github.com/yjs/yjs/issues/

Describe the bug
When a user has multiple selections, only one of the selections is included in the user's awareness, and only that one receives the CSS class decorations on other clients.

To Reproduce
Steps to reproduce the behavior:

1. Make multiple selections (e.g. middle click drag, alt click)
2. Attempt to view those selections from another client

Expected behavior
A user's awareness should include all of their selections, and all of a user's selections should be decorated.

Screenshots

Environment Information

• Chrome 109
• yjs 13.5.44
• y-monaco 0.1.4
• y-protocols 1.0.5

Please save me some time and use the following template. In 90% of all issues I can't reproduce the problem because I don't know what exactly you are doing, in which environment, or which y-* version is responsible. Just use the following template even if you think the problem is obvious.

Checklist

• Are you reporting a bug? Use github issues for bug reports and feature requests. For general questions, please use https://discuss.yjs.dev/
• Try to report your issue in the correct repository. Yjs consists of many modules. When in doubt, report it to https://github.com/yjs/yjs/issues/

Describe the bug
A clear and concise description of what the bug is.
The content is different under different operating systems. It seems that user under Win10 can see only a single new line when user under mac enter two new lines. Bug also appears after the syntax completion, see section below on how to reproduce. After some testing, the content under mac is the same as the content under Android and iOS, just different from the content under win10 and no matter which browser or computer we use.

To Reproduce
Steps to reproduce the behavior:

1. Open https://demos.yjs.dev/monaco/monaco.html under both windows and mac system
2. Under windows: Type "Text from Windows" then click "Ender" button (new line)
3. Under Mac: Click "Enter" button (new line) then type "Text from Mac"
4. The content is different
5. Clear all the content
6. Under windows, enter something like "bbb" then enter a new line
7. Start from the new line, enter "aaa" and click tab to accept the syntax completion (aaa -> AudioParam)
8. You can see the difference, on Mac it's "aAudioParam" but on Win10 it's "AudioParam"

Expected behavior
A clear and concise description of what you expected to happen.
The content on both end should look the same.

Screenshots
If applicable, add screenshots to help explain your problem.
Screen shot from Windows:

Screenshot from Mac:

Environment Information

• Browser / Node.js [e.g. Chrome, Firefox, Node.js]
  Chrome 87.0.4280.88 on both win10 and Mac

• Yjs version and the versions of the y-* modules you are using [e.g. yjs v13.0.1, y-webrtc v1.2.1]. Use npm ls yjs to find out the exact version you are using.
  [email protected]
  [email protected]
  [email protected]
  [email protected]
  [email protected]

Additional context
Add any other context about the problem here.

这里的y-websocket做了什么？能否将其替换为springboot web服务？

Describe the bug
If you select some text and delete it, then you are undoing previous action - another users connected via yjs will see incorrect selection

To Reproduce
Steps to reproduce the behavior:

1. Two collaborative users
2. First user selects some text
   
3. Second user sees the selected text
   
4. First user deletes text and then presses Ctrl+Z
5. First user sees correct text selection
   
6. Second user sees incorrect selection
   

Expected behavior
Second user should see exactly same text selection

Environment Information

• Browser / Node.js (Chrome, Angular)
• Yjs 13.5.50, y-monaco 0.1.4, y-websocket 1.5.0

Additional context
Add any other context about the problem here.

Undo/Redo doesn't work correctly anymore because remote changes are ignored by the UndoManager (see #8 ). When y-monaco is used, we should use Y.UndoManager instead of Monaco's UndoManager.

When trying to install this package with NextJS it will complain since MonacoEditor imports monaco-editor which has global css imports that NextJS does not support out of the box.

We use @monaco-editor/react to avoid bundling monaco, since that is slow and difficult to do with NextJS.

Describe the solution you'd like

I would like to be able to provide monaco as a parameter to the MonacoBinding constructor instead of importing it. Ex: new MonacoBinding(monaco, ...).

Describe the bug
Behavior 1: When two users are typing at the same time. The cursor that is farthest down the page moves up with every key press.

Behavior 2: When two users are typing at the same time. The text gets out of sync. (i.e. one user has many lines of line breaks, the other does not)

To Reproduce
Steps to reproduce the behavior:

1. Go to 'https://rafe-dev-bp41knwx5.vercel.app/code'
2. Click on 'Connect'
3. Connect two users to the same room
4. Type at the same time

Expected behavior
Behavior 1 and 2 do not happen. I expect one person type to not affect another persons cursor

Environment Information

• Chrome
• yjs ^13.3.0
• y-webrtc ^10.1.6
• y-monaco ^0.0.1
• react-monaco-editor ^0.39.1

Additional context
Im willing to assist in reproducing the issue. It might be difficult to do alone. Let me know so we can coordinate a time.

Checklist

• Are you reporting a bug? Use github issues for bug reports and feature requests. For general questions, please use https://discuss.yjs.dev/
• Try to report your issue in the correct repository. Yjs consists of many modules. When in doubt, report it to https://github.com/yjs/yjs/issues/

Describe the bug
Collaboratively editing in Monaco can break the ITextModel content (see screencast). It is reproducible if messages sent by the y-websocket are artificially delayed.

Note: the YText shared data type converges correctly. It's the Monaco editor that's not correctly reflecting the state of the shared type (see second screencast).

To Reproduce
Steps to reproduce the behavior:

1. Clone yjs-demos project to yjs-demos
2. (cd yjs-demos/demo-server && npm install)
3. (cd yjs-demos/monaco && npm install)
4. (cd yjs-demos/demo-server && npm install lib0)
5. Copy y-websocket/bin/utils.js to yjs-demos/demo-server/utils.js
6. Copy y-websocket/bin/callback.js to yjs-demos/demo-server/callback.js
7. Change const setupWSConnection = require('y-websocket/bin/utils.js').setupWSConnection in yjs-demos/demo-server/demo-server.js to const setupWSConnection = require('./utils.js').setupWSConnection
8. Wrap send in utils.js in a setTimeout with 15000 ms (https://github.com/yjs/y-websocket/blob/9fd8f41fa8f1e29e3d98e6de8156b4650a89c7f1/bin/utils.js#L217) to artificially delay sending messages to peer clients.
9. (cd yjs-demos/demo-server && npm start)
10. Change the WebsocketProvider in yjs-demos/monaco/monaco.js to connect to your local websocket server (i.e. const provider = new WebsocketProvider('ws://localhost:8080', 'monaco-demo', ydoc)
11. (cd yjs-demos/monaco && npm start)
12. Open Chrome and Firefox and navigate to http://localhost:8081/monaco/monaco.html in both browsers
13. Edit in one Monaco editor (similar to what is shown in the screencast) and once the updates come in in the other Monaco editor, start editing concurrently.

Expected behavior
It is expected that both Monaco editors show the same content.

Screenshot

Screencast
https://user-images.githubusercontent.com/489051/103810010-583c2400-500f-11eb-99f2-35e58e5c9d70.mp4

Screencast (with YText content logged to console)
https://user-images.githubusercontent.com/489051/103834425-36a36280-5038-11eb-9456-d528c5c789e7.mp4

Environment Information

• Node.js v10.16.3
• Chrome Version 87.0.4280.88 (Official Build) (x86_64)
• Firefox 84.0.1 (64-bit)
• Yjs version and the versions of the y-* modules are the same as in the yjs-demos repo as of today

Describe the bug
In next.js, import * as YMonaco from "y-monaco"; will (eventually) cause an error:

./node_modules/monaco-editor/esm/vs/base/browser/ui/actionbar/actionbar.css
Global CSS cannot be imported from within node_modules.
Read more: https://err.sh/next.js/css-npm
Location: node_modules/monaco-editor/esm/vs/base/browser/ui/actionbar/actionViewItems.js

To Reproduce
Steps to reproduce the behavior:

1. Create/clone a bog-standard next.js app
2. Add npm i y-monaco
3. Copy/paste the example code into pages/index.js
4. See error

Expected behavior
Some way of potentially delaying the import of monaco may help with the issue

Environment Information

• next.js ~10

   "y-monaco": "^0.1.2",
   "y-webrtc": "^10.1.8",
   "yjs": "^13.5.5"

Happy to help track this down, I know dealing with Monaco can be challenging in certain environments (though it is quite amazing once it's up and running!).