I have an Electron app that I'm debugging in VSCode. In my app, I create a BrowserView and load one of my websites: browserView.webContents.loadURL(myUrl);
Sometimes, I want to debug this website that's loaded in my BrowserView.
How I've been doing that is I open devtools in Electron and set breakpoints in the Chrome devtools that appears.
However, I wonder if I can spin up the localhost server from Visual Studio that hosts my website, and then debug my site directly from Visual Studio instead of through the devtools.
Is there a way to do this?
It seems like that won't work since the Visual Studio debugger is already attached and attaching it to the BrowserView's renderer process didn't work, but I wanted to check.
Is there a way to do this? It seems like that won't work since the
Visual Studio debugger is already attached and attaching it to the
BrowserView's renderer process didn't work, but I wanted to check.
I am afraid that you cannot get what you want.
Actually in Visual Studio, you cannot debug the renderer process. It does not support that. You have to use the Chrome devtools.
Besides, if you want this feature, you can suggest a feature on our User Voice Forum and hope the team will give you a satisfactory reply.
When I start a newly created Typescript Project in Visual Studio 2017 theres some strange behaviour going on.
-The debugger breaks on the very first line
-The output shows:
code:-32000
message:Debugger agent is not enabled
-Many scripts in solution explorer (see screenshot)
-Node output:
Debugger listening on wb://127.0.0.1:5858/03dde2a0-7ae8-44fc-8b29-53b99c072de7
For help see https://nodejs.org/en/docs/inspector
Debugger attached.
Screenshot:
Edit: Seems to be a problem with the new node version. If I switch back to 5.4.1.0 (included in VS2017) everything works fine. I read that there has been a change in debugger protocol maybe it has something to do with that... gotta wait for an update.
To show the Console, we can use: Debug -> Windows -> JavaScript Console.
Michael Braude showed two suggestions for the similar issue:
1.Use JavaScript Console of Visual Studio. Frankly, this way is OK for me when I am developing on PC with two displays (I runs emulator on
one screen and debug with Visual Studio on another), but a bit
uncomfortable when I am developing on Notebook with one screen.
2.Run a solution without debugging (CTRL+F5), in this case VS's debugger isn't attached to browser. This looks as simple solution, but
you need to be aware that in this case breakpoints don't stop run-time
and you have to use debugger; keyword.
For detailed information:
Visual Studio Tools for Apache Cordova stops work correct after update
I got it working again by using the included node version of VS2017. There seems to be a problem with the new version <8.
You can choose which version to use by putting the path to the exe folder on top of the list here: Tools > Options > Projects and Solutions > Web Package Management > External Web Tools
I am in the process on selecting suitable cross-platform development tools for my next mobile project (react-native or ionic 2). I like ionic because of its out-of-the-box use of typescript. I have setup a simple project following basic tutorial and I am able to launch the application via the Ripple emulator.
Now I am asking: is it possible to hit breakpoints in the typescript files?
So far I have been unsuccessful. There is a app.bundle.js (and a corresponding sourcemap) generated after compilation and placed in the .www/build/js folder.
I added this line in my tsconfig.json:
"sourceMap": true
When I place a breakpoint in the app.ts for example, it is not hit.
How is debugging done? through Chrome browser dev tools or directly from within visual studio? Most of the solutions I have found apply to Visual Studio Code. I am using Visual Studio 2015 Enterprise edition
Thanks in advance for any help, suggestion and direction
You can set breakpoints in .ts files and debug using Chrome remote debugging on an android device. Just issue ionic run android to build and deploy on the real android device, open Chrome and use chrome://inspect to view the sources and set breakpoints.
Note that you may need to configure to add the source maps inline - see Ionic 2: Application running on the android device can't be debugged
I really like the idea of working with Visual Studio, C# and Unity on OS X.
Has anyone made debugging with C# in Unity work with Visual Studio Code on OS X?
Yes it works absolutely fine. Unity is C#, JavaScript or Boo. So, you don't need .NET for it. Unity uses Mono runtime. So, an existing VS project can be opened in Unity for Mac OS X.
EDIT
Here is a link that helps you to attach a debugger to the VS endpoint.
http://www.yunspace.com/2015/01/19/integrating-visualstudio-with-unity3d-on-mac-using-vstools/
You can try VS Tools for Unity too.
http://unityvs.com
UPDATE
There is this awesome Unity Plugin by dotBunny that solves the problem and integrates Code with Unity tools.
Hi the solution is https://github.com/dotBunny/VSCode This plugin works on both MacOS and Windows and gives you the following capabilities:
•An option to enable VS Code integration (Editor –> Assets –> Enable Integration), this updates your solution files and (more importantly) keeps them in sync. This also sets the preferred external tool editor in the Unity preferences.
*Note, the old “Sync MonoDevelop” option is now gone in the Unity editor from V5.2
•It writes out the necessary (and sometimes hard to find) VS Code configuration files, including the ability to hide “non-code” files in the editor (hides things like .sln, .csproj and the ever present unity .meta files)
There are a couple of other settings in there to help speed up the integration.
•Automatically launches VS Code direct to your project folder, EVERY-TIME. no longer do you have to worry about keeping that window open, or switching around if you work on multiple projects
One thing to be aware of, once you enable the VSCode integration, changing your preferred code editor in the External Tools preferences will have no effect as the plugin takes over opening code files. If you want to use another editor, you’ll have to disable the integration first.
These are just the main highlights as there are more features in there as well.
Currently you need to download the plugin files from GitHub
An existing Visual Studio solution can be build and debugged with Visual Studio Code on the Mac with Mono. You have to use the launch.json and tasks.json files.
I described it on my blog: Compile and Debug
To build Unity in Visual Studio Code, you can hook up Mono xbuild compiler as a task runner, so you don't even have to leave IDE to have errors and warnings.
See https://twitter.com/_eppz/status/846859856787259392 for more.
It's a little unstable. But it's possible from recent VSC version.
1) Install this VSC Unity plugin-in.
https://github.com/dotBunny/VSCode/
2) Follow these commands. (Step 1, 2 and 3)
https://code.visualstudio.com/Docs/runtimes/unity
3) After you complete the settings, launch the VSC using Unity menu.
Assets/Open C# Project in Code
4) Play the Unity project.
You can see the debug port number on the unity console.
And the project's launch.json file will be renewed automatically.
To open launch.json, click option icons.
the file exists in this folder.
.vscode/launch.json
sample.
{
"version":"0.1.0",
"configurations":[
{
"name":"Unity",
"type":"mono",
"address":"localhost",
"port":56621
}
]
}
5) Start debug in VSC debug tab.
That's it. Hope this help.
Update, 2016 - the petition was popular enough that some VS Code extensions have been written for it: https://marketplace.visualstudio.com/search?term=unity&target=VSCode&sortBy=Relevance
Petition for it on the Visual Studio UserVoice page: http://visualstudio.uservoice.com/forums/293070-visual-studio-code/suggestions/7752702-unity-integration
[Feb 2017] It is now possible to do this without the dotBunny plugin.
i.e. Support is built into Unity natively.
Just to repeat, you don't need to fiddle with Unity, just VSCode.
Instructions here
Instructions are incomplete though, and I didn't take screenshots (please do!), but basically what I did was:
(...and please improve these instructions as you go, I'm working from memory...)
I deleted/renamed my .vscode/Launch.json file, as per the link.
Double-click on some file to bring up the project in VSCode (maybe first make sure that in Unity's settings you have selected VSCode as your default code editor)
clicking the bug icon then the cogwheel, as per the link.
I had to install that vscode-unity-debug plugin in VSCode, just filtering the search with 'unity' found it.
I then had to press the green 'play' triangle.
I set a breakpoint in my code.
Now over to unity and press play, and the breakpoint gets hit.
The Unity Debugger for Visual Studio Code is working, but doesn't work well enough when doing any kind of serious work for now. I really hope they will improve it in the future as I prefer VS Code over VS.
Current problems I encountered
-Sometimes I cannot step in a function, the debugger will hang until you detach
-no local variable, you have to watch everything
-some more complex variable have no support, so you can't see what is inside
-A bit overall unstable with unexpected behaviours.
What I love about it,
Attaching & Detaching is a breeze. Just press a button, allowing to attach and detach quickly as needed. e.g. At the beginning of the program I work on, there will be an bunch of exception. I can detach and attach quickly to skip the exceptions.
The problems with it are too constraining as it currently stands, I had to go back to the classic Visual Studio.
I'm writing a Windows 8.1 HTML5/Javascript store app and posts about this refer to using source map files in a supported browser. Just curious if anyone has gotten this working seamlessly by placing a breakpoint in their .ts file in Visual Studio.
Windows 8.1 project
If you are facing issues with debugging TypeScript in Win8.1, I'd suggest to download and run sample/working project first. E.g. Encyclopaedia works for me, see:
The trick is in JavaScript mapping files. So, if this works for you, copy important parts from Encyclopedia.jsproj (like TypeScriptSourceMap at the very end of file and Import of TypeScript .targets) to your jsproj. Hope this helps.
Web project
To debug JavaScript or TypeScript run your application using an Internet Explorer:
In Standard toolbar change a Debug target to IE
Navigate to your .ts file and place the breakpoint
Press the green arrow :o)
If it still doesn't work, install the Web Essentials extension.
I have it tested also with Chrome and FF, but it doesn't work.