OfficeDev/teams-toolkit

Teams on Chrome extremely slow and unresponsive - debugger goes crazy

Closed this issue · 4 comments

It took me a while to understand why sometimes running my bot was almost impossible: Teams (on Chrome) becomes very slow and, when dev tools are opened, the debugger goes crazy.

So hard to believe that I've made a recording of the behavior: https://youtu.be/DY9hMpFD_6s

To reproduce:

  • create a new Basic Bot from the Visual Studio Teams toolkit extension (Javascript)
  • add a breakpoint anywhere in index.js or teamsBot.js (same applies if the breakpoint is inside a method)
  • run Debug in Teams (Chrome)

Chrome opens and it takes a couple of minutes for the "Add bot" UI to appear. Meanwhile, if you open the Dev Tools, you'll see the debugger going crazy and somehow stopping and starting after each webpack chunk being loaded.

Workaround: remove all breakpoints from your code.

The weird behavior restarts when adding a breakpoint later (when everything is started for example)

Env:

  • macOS - sonoma 14.4
  • node: v20.11.1 or v18.20.3 (same for both)
  • package.json (fully standard):
    • "dependencies": {
      "botbuilder": "^4.20.0",
      "restify": "^10.0.0"
      },
    • "devDependencies": {
      "env-cmd": "^10.1.0",
      "nodemon": "^2.0.7"
      }

Duplicate from #6898 with more details.

Happy to provide more info if needed.

Thank you for contacting us! Any issue or feedback from you is quite important to us. We will do our best to fully respond to your issue as soon as possible. Sometimes additional investigations may be needed, we will usually get back to you within 2 days by adding comments to this issue. Please stay tuned.

I found a solution to the problem (thanks to microsoft/vscode-js-debug#597): setting "perScriptSourcemaps": "yes" on the Launch App (Chrome) configuration in launch.json fixes the issue and still allows me to debug.
Reading the property documentation and considering the number of scripts loaded, it seems the setting is required so that the debugger does not lose its mind.
Creating a PR, at least to document the fix, you can then discuss if you want it or not.

I found a solution to the problem (thanks to microsoft/vscode-js-debug#597): setting "perScriptSourcemaps": "yes" on the Launch App (Chrome) configuration in launch.json fixes the issue and still allows me to debug. Reading the property documentation and considering the number of scripts loaded, it seems the setting is required so that the debugger does not lose its mind. Creating a PR, at least to document the fix, you can then discuss if you want it or not.

Thanks for the suggested fix and PR! Let me test Typescript and other apps as well. Will create PR to cover as many apps as possible based on your changes.

Thanks @swatDong!