search

microsoft / live-share

Real-time collaborative development from the comfort of your favorite tools
http://aka.ms/vsls
Creative Commons Attribution 4.0 International
2.28k stars 253 forks source link

Popup when someone marks something #5031

Open IamGroot212 opened 8 months ago

IamGroot212 commented 8 months ago

Product and Version [VS/VSCode]: Most recent OS Version[macOS/Windows]: macOS Sonoma 14.4 Live Share Extension Version: v1.0.5905

Steps to Reproduce / Scenario:

  1. When my friend in Live Share marks sth there is a popup like u can see below in the screenshot. I really don't know where it comes from. It's extremely disturbing cause it is a text input and it takes the focus. So it always takes me there.

Please attach logs to this issue:

logs.zip

Screenshots Bild 06 03 24 um 00 46

derekbekoe commented 8 months ago

That popup does not appear to be coming from Live Share. Can you share the list of extensions you have installed and when you started seeing the issue? This may help to narrow down which extension is causing that UI to show up.

IamGroot212 commented 8 months ago

Like the guy mentioned in #5032 I am also working on a vue/ TypeScript project.

Relevant Extensions for this project are probably the following:

JavaScript and TypeScript Nightly npm inetellisense Vue Official Vue Snippets - hollowtree AutoImport - steoates Auto Rename Tag - Jun Han Error Lens - Alexander htmltagwrap - Brad Gashler

Maybe you can figure something out. Im going to start to disable all extensions, so i might be able to find the one relating this issue.

richmondjoy commented 8 months ago

Our team is also experiencing this on a vue/TypeScript project, though it doesn't seem to be limited to when both people are typing. It is only occurring on the host's IDE, and only while in Read/Write mode, not in ReadOnly mode. It is making LiveShare unworkable.

Extensions: Vue Official Tailwind CSS Intellisense ESLint Prettier Prettier ESLint PostCSS Language Support CSS Variable Autocomplete

derekbekoe commented 8 months ago

The extension in common is "Vue Official" extension. Looking at the changelog, a new 2.x.x version of the extension was released on 2024-03-02 (earlier this week). Since then, there have been many issues opened against the extension in the last few days. This comment on one of the issues provides steps to downgrade to a 1.x.x version of the extension.

Hopefully that resolves your issue but it doesn't seem to be caused by Live Share.

johnsoncodehk commented 8 months ago

When the user selects HTML code in the SFC template and executes the Extract into new dumb component command, the Vue extension client will intercept the refactor.move.newFile.dumb command and pop up a popup naming the new component. This is behavior that exists since v1.x.

Does one client executing Extract into new dumb component cause all connections to execute the middleware code? (Please let me know if I can help with this issue.)

https://github.com/search?q=repo%3Avuejs%2Flanguage-tools%20refactor.move.newFile.dumb&type=code

xollaborator commented 7 months ago

@johnsoncodehk it seems that something else is triggering this behaviour. Here is my reproduction:

  1. I open in VS Code a random vue file and move my cursor somewhere into script setup where I could write code in TS.
  2. I start Live Share (Read/Write) and open the link in the browser.
  3. I log in as myself using github there.
  4. Session is joined and in the browser I see that only 2 extensions were installed Prettier and Vue - Official.
  5. I come back to my host instance of VS Code, type a character and within a second the popup appears.

I do not need to do anything else like selecting any code or executing a command so there is something else that is triggering this refactor. In non-vue file the IntelliSense popup appears and stays, while in vue files it is quickly closed and the popup appears.

richmondjoy commented 7 months ago

Reverting the Vue - Official extension to v1.8.27 resolved the issue for our team.

johnsoncodehk commented 7 months ago

@johnsoncodehk it seems that something else is triggering this behaviour. Here is my reproduction:

  1. I open in VS Code a random vue file and move my cursor somewhere into script setup where I could write code in TS.
  2. I start Live Share (Read/Write) and open the link in the browser.
  3. I log in as myself using github there.
  4. Session is joined and in the browser I see that only 2 extensions were installed Prettier and Vue - Official.
  5. I come back to my host instance of VS Code, type a character and within a second the popup appears.

Thank you for your explanation. As far as I know, step 5 is incorrect. It should be triggered when selecting a piece of code in the <template> on the browser side.

I have thought of two ways to solve this problem.

xollaborator commented 7 months ago

@johnsoncodehk I see that none of those options is possible in near future so I appreciate that you've added vue.codeActions.askNewComponentName setting to turn off the feature. I've just check that after disabling the option I no longer get the popup with version 2.0.11 so thank you for this workaround.

While I see much bigger value in pair/mob programming than in easy component extraction I hope that at some point VSCode/Live Share team will provide a solution that is not limiting capabilities for Vue ecosystem and will let you implement the proper solution for this issue.

I wish you all the best :)