I am creating an Office App (Outlook addin/web-app). While debugging, the app is always launching in IE desktop version. I want to start debugging the app in non-IE browser - FF, Chrome. I couldn't find any settings related to this within the project. How can I achieve that?
Any help will be appreciated.
Thanks.
Microsoft Visual Studio: Currently you will be able to debug you project in Visual studio 2015 or later only using IE browser. By "debugging in VS" I meant you set breakpoints directly in IDE for your JS code. As of VS2017 RC release you will be able to debug your project in two browsers (IE and Chrome), even today, Edge coming as well. Please see Client-side debugging of ASP.NET projects in Google Chrome.
If you need just to start your project in yet another browser (Chrome, Edge, Firefox) you need to use this article to switch your Browser in IDE: Testing with an Alternate Browser. After you switch to another browser, please restart VS; I have tried this myself and it works, your project will be started in the browser of your choice by pressing F5. With this approach you would need to debug your code with development tools of this browser (F12) or some 3rd party extension.
Visual Studio Code: (VS community edition) Looks like have support for debugging your code in Chrome and setting up break points directly in VS Code IDE. Please refer to Introducing Chrome Debugging for VS Code. You would require to install VS extension as described in the article.
Other options: If you are using yet another Tool please refer to the following blog about different methods of debugging office add-ins: The many ways of office web add-ins debugging
I finally figured out the solution. Select the Manifest project, hit F4 to open Properties window. Choose your preferred Start Action. Here is a screenshot.
Start Action image
Related
I can't figure out how to get the DOM Explorer or JS Console to show on my Office Add-In I'm dev in VS 2017. They used to work and one day, just stopped.
So far I've tried the following:
Test Proj at home and copied source files to non working work computer
Removed 100% Visual Studio and re-installed
Started working w/ new template in VS 2017 vs my existing Project
Tried messing w/ .Net versions
Updated all available Nuget packages
Other settings too likely, I'm willing to start fresh if anyone has suggestions that don't work first try for me.
I'm at a loss what the issue could be. My Add-Ins load and behave correctly, but I can't see the DOM or JS console which is the whole reason I use VS 2017, any ideas what I can try?
I was able to resolve by uninstalling the Microsoft Edge WebView2 Runtime...
I used Visual Studio to create an office project,
I try to see were is written the console.log text.
Looking around stackoverflow and internet I tried to attach debugger to my project or any other things related in so many posts, but nothing works.
In the code provided by the Office Add in template, there is a banner to show the error directly in the taskpane. But there is also a console.log to show in the console ? Well... I can't see where this texte is written.
In the image below, on "1" they catch the error, on "2" they show the error on the banner in html, and in "3" they show the console.log error ...
As you can see, my taskpane well display the error banner, so logically, the console.log is displayed somewhere.
Below images of the different consoles and terminals that can be the most logical to show error, but still nothing
In all the other tabs there is nothing, and I tried ctrl+Q to activate Javascript console or whatever that could be useful for debugging.
The JavaScript console was removed from Visual Studio 2019. You have basically 2 options:
Install Visual Studio 2017 side-by-side Visual 2019 (or install Visual 2017 on another computer) and use VS 2017 to develop Office Add-ins.
Use the Dev Tools of the browser that the add-in is using to run. For which browser your add-in is using, see Browsers used by Office Web Add-ins.
I remember reading that newer Office versions use Edge for the Addin UI.
Thus for Edge you can now use the Microsoft Edge DevTools Preview to have the normal "F12 experience" when running the Addin in a client office.
This works for me with a MS Word on Office 365 x64 when using the "yoman office" scaffolding. I don't have much experience for any other variants.
Visual Studio 2019 Team Explorer for Builds opens builds in external browser.
How can I make it open in Another browser than default?
I want open in it in Internet Explorer
You can only the browser in one place – the browser you set to launch when debugging web apps.
Anywhere that does not use that setting will use the default browser.
(Personally I just navigate within the Azure DevOps web site – reviewing PRs means I just keep the key projects open!)
I've recently been using Visual Studio Online 'Monaco' to edit an AngularJS application that I have hosted as an Azure website. I want to use Monaco as it has in-browser typescript support.
As far as I can tell the only place to get to Visual Studio Online 'Monaco' is via a well hidden link on an associated Azure Website's Dashboard, down the bottom of the page on the right hand side.
E.g. the final access url ends up being:
https://your-website-dev.scm.azurewebsites.net/dev/wwwroot/app/scripts/services/sampleService.ts
Is this the only place to get to Monaco?
It appears to be a good alternative to Cloud 9 and Nitrous.io for development of Typescript and .Net solutions but I'd like a more Nitrous.io style way of setting up dev environments. e.g. log in, clone from github, start coding.
Edit: From replies over time to this question...
As of Dec 2015 Visual Studio Code is an excellent locally hosted version similar to Atom but with a Visual Studio vibe, and cross platform:
https://code.visualstudio.com/
As of July 2015 an option in the Azure Web App Dashboard has appeared.
To enable Visual Studio Online for a web app:
Go to the 'configure' tab of the web app
Switch the 'EDIT IN VISUAL STUDIO ONLINE' on, click Save
An 'Edit in Visual Studio' option appears on the dashboard tab under the 'quick glance' area
Clicking on this takes you to the VSO pointing at your web app
Note: If you deploy via git etc your vso changes may be overwritten
As of July 2016 in the new portal
This has been renamed to App Service Editor.
App Services => Your App => Tools => App Service Editor (Preview)
Click go in the panel that opens up to navigate to
https://yourapp.scm.azurewebsites.net/dev/wwwroot/
Update to add pic (by Luke)
At this point in time, the only way you can edit code online is via the link in the Azure portal (or by using the url directly as you've done).
I presume that Monaco will show up on other Microsoft properties at some point in time, but that's just a guess.
UPDATE: A lot has changed since this answer was given. The summary added to the the question provides a good overview of Monaco's usage, though you should also add to the Typescript Playground. The VSCode team is even looking to make Monaco available as a standalone tool you can use in your own apps (see GH issue)
P.S. VSCode is built on top of Electron and, being open source, you can look at the code of the Monaco editor today.
As of today, it is accessed by adding the Visual Studio Online extension to your website and then clicking "Browse" at the top when the extension is selected. It is unclear why Monoco is so hidden, perhaps they want to wait until it is "done" before doing a big push?
UPDATE 11/23/2015: The Monaco editor was open sourced last week (as part of vscode). The vscode repository is also the repository for Monaco.
Visual Studio Code is Microsoft's new desktop editor that is built on web technologies and the editor component is Monaco.
See: What is the Visual Studio Code editor built on
As of January 2016 in the new portal
App Services => Your App => Tools => Extensions => Add + => Visual Studio Online
Going back through that chain and selecting "Browse" will navigate you to
https://yourapp.scm.azurewebsites.net/dev/wwwroot/
I have tried page inspector in web forms development and it works fine,
But in MVC it opens and in the console area it say's
"Javascript Must be enabled in internet explorer"
now i'v checked everything and javascript is enabled,
Rebooted, Reinstalled, Nothing helps this issue...
working with page inspector should be a refreshing thing since
MVC doesnt have a Designer view,
Does anyone had this problem?
I've had the same issue and folowing this steps resolved it:
Enabled JS Debugging in Explorer as the message said
and followed by this link:
http://support.microsoft.com/gp/howtoscript
added this setting to the web.config
at the
<appSetting> section
<add key='PageInspector:ServerCodeMappingSupport' value='Enabled'/>
picked it up from this link:
http://msdn.microsoft.com/en-us/library/jj204395.aspx
closed the visual studio and the Developement server