Browser Link in Visual Studio 2013

Roshan Mehta, 28 August 2013

Many new features were announced for Visual Studio 2013 at the Build Conference in San Francisco with a lot of focus set on web development. The sessions presented by Scott Hanselman and Mads Kristensen were packed out with web developers wanting to get a sniff at what’s new. In this post, we will take a look at the new Browser Link feature in Visual Studio 2013.

We often need to build custom web portals which integrate with Microsoft Dynamics CRM 2011 that need to be tested in multiple browsers during development. It can be quite frustrating having to manually refresh each browser window when making small cosmetic changes to web pages. With Browser Link, you can easily refresh your web application in all browsers with one click!

To enable Browser Link, click on the arrow next to the browser link icon and select Enable Browser Link.

The screenshot below shows simple HTML code and what it looks like when it’s rendered in Internet Explorer.

I have changed the text inside the <h1> tag to “Testing Browser Link – Browser Link”. Instead of refreshing the browser in Internet Explorer, I can click on the Browser Link icon on the Visual Studio 2013 toolbar.

The screenshot below shows Browser Link in action with our web application running in both IE and Chrome. Again, we can simply refresh both browsers with the click of one button.

Browser Link can be extended to unleash additional functionality both from within Visual Studio and in the web browser itself. The Build Conference showcased a great feature where you can fill out a web form in one browser and automatically populate fields on the same form on another browser.

This feature will be extremely useful when testing your web applications. I will definitely be using it when building custom web portals for Microsoft Dynamics CRM.