Working with the Web Browser Control in Visual Studio 2005 - IE7Clone.

• Download source files - 2614 Kb
• Download demo project - 692 Kb

Introduction

As many people know Microsoft has included a browser control with Visual Studio 2005.

The browser control is a managed wrapper around the internet explorer control found in earlier versions of visual studio (SHDocVW.DLL) and it exposes some functionality that was not always easy to get at, while at the same time leaving out some functionality that would have made the control truly great to work with.

The goal of this article and accompanying sample application is to show working with the new WebBrowser Control in Visual Studio 2005 by cloneing many of the features in Internet Explorer 7. It is not meant to replace your existing browser or be a 100% complete implementation of a browser, The features implemented are to show examples of working with various properties and events of the control and some idea's on what to do to write your own complete browser application. Every feature is not fully error checked as this is meant to be a "starting point" for working with the control and every user interaction possibility has not been addressed. That said with minimal effort you could make this example a complete browser based application. You will find some tips in the comments for certain events and routines on how to improve or use that routine in your own applications as well as some "stubs" such as download manager, phishing filter, rss reader, Document Explorer, Image Grabber etc.

This example was put together with out referencing the Active X (SHDocVW.DLL) directly. That said, It again needs to be pointed out that the browser control is a managed wrapper around the internet explorer control found in earlier versions of visual studio (SHDocVW.DLL) and you may find a mix of the 2 will best suit your purposes.

Getting Started...

To make our example application one of the 1st things we are going to need is closable tabs, not wanting to re-invent the wheel a suitable tab control is found. The tabs used in this example were written by Eduardo Oliveira and can be found here. (Updated Tab Control Code provided by the author of the control. Thanks Eduardo).

Extending the browser control...

The browser control falls short on some basic functionality we will want to use so we will need to extend the control, an example of this is the NewWindow event..

New Window event standard with the control.

Now take a look at what we have with the extended browser.

Please look at the extended browser control for how this was done, several MSDN articles were used in putting it together and you could certainly add a lot more.

Context Menus

One of the nicest features of the new control is the ability to override the built in context menu and create your own,not easily done in the past. In this example we will use our own context menu, which will show you a bit about working with the loaded document directly.

To disable the built in menu set the web browser property IsWebBrowserContextMenuEnabled to false, then create your own context menu and set the browsers context menu to your new custom menu.

This is a pretty powerful tool especially when used with the controls document property as demonstrated in the example application.

* In the example application I do not check parent and children of the selected element, this would not be hard to implement if you choose to and would allow more accurate or robust options in the context menu.

JavaScript Document.External...

One of the most powerful features you can use, especially when creating intranet browser based applications is the javascript window.external call in conjuction with your browser based application. You can build extremely powerful browser based applications using this functionality.

Lets take a look at the search provider code:

Our document might contain a link or onclick such as: window.external.AddSearchProvider

We can react to this call to window.external in whatever way we see fit, in this case we launch a form.

Public Sub AddSearchProvider(ByVal value As String)
   ' See: http://www.opensearch.org/ for more information.
   Dim ofrm As New frmAddSearchProvider
   ofrm.strXML = value
   ofrm.Show()
End Sub

As you can see we are reacting to a call from the document.

window.external.AddSearchProvider / Public Sub AddSearchProvider(ByVal value As String)

*Note - Make sure your routine signatures match as shown above in red.

Using this feature you can extend and add whatever type of feature you would want to provide...

Example:

<a href="#" onClick="window.external.ShowCalc">ShowCalculator</a>

Public Sub ShowCalc()
    Process.Start("Calc.exe")
End sub

This is also demostrated on the blocked site page to launch the settings form.

As you can see using this feature you can do just about anything you want to with the full power of a windows application.

Phishing Filters, Blocked Sites, Iterating the document etc...

The browser control exposes the loaded document making it easy to implement features such as a site blockers, phishing filters and simular types of features with a simple iteration through the documents elements allow you to check the document and perform actions based on it's contents.

Dim oEl As HtmlElement

For Each oEl In wb.Document.All
   'Do something based on the element.
Next

It should also be noted that the HtmlElement object and the document itself has a rich set of functions and features to work with, you will see some of these in the example application such as: GetAttribute, GetElementFromPoint etc...

Features in this Example

Most of the learning value is in the example application itself, there are many articles on MSDN and on the web dealing with working with the ShDocVW.DLL and MSHTML. I tried to provide as many starting points and examples of how to implement many features to show working with different the control in many ways, some of the features implemented either fully or partially are:

• Basic Browser functionality.
• Document explorer.
• Most of Internet Explorers Dialogs (properties, find, print dialogs, favorites, select all etc).
• Grabing images from a page.
• Blocking sites.
• Phishing Filter example.
• Working with VS2005 My.Settings.
• RSS Viewer + Detecting RSS.
• History / Cache Viewer.
• Cookie Viewer.
• Search Providers.
• Working with popups, implementing an info bar.
• Creating a ruler user control.
• Example of how you might deal with errors
• Alot more, just poke around in the code.

Background / Notes

The basic idea behind this example is to show a good overview of working with the new Web Browser control by cloning a lot of the features in Internet Explorer 7 as I have found one of the best ways to learn is to "clone" an existing application as well as to point out some idea's on where to go with your own browser based applications and some of the possibilities.

Many articles (including some on MSDN) recommend using on error resume next type error handling in your code due to the nature of connected applications that use browser controls. I have implemented some error handling in the example, but leave the rest up to you to determine how best to handle the many possibilities. All of the features implemented in the example application work for the sites I browse most often.

VS2005 provides application events such as when network connection state has changed, this could be handy for you depending on how your own browser based applications are intended to work.

Using the code

The code is pretty straight forward and is commented where I thought would be needed.

History

This is the 1st release of this example.