Easy way to add Keyboard and Mouse events to WebBrowser control

Today I dirtied my hands researching about how to add keyboard and mouse events to the .NET WebBrowser control. It is not as straight-forward as it might look at first instance. The WebBrowser control suppresses these events in one way or the other and you can’t trap them at the control level or at form level (by setting KeyPreview to True etc.).

However there are still ways to trap the mouse and keyboard events in the WebBrowser control. For this demo and to keep the code short, I’ll show only two events – the KeyDown event and the MouseDown event. But you can add any of the other events you wish to in just the same way.

Start Visual Studio and create a new VB.NET Windows Forms application.

Add a WebBrowser control and a Button to your form.

Add the following code:

Private Sub WebBrowser1_DocumentCompleted(ByVal sender As System.Object, ByVal e As Windows.Forms.WebBrowserDocumentCompletedEventArgs) Handles WebBrowser1.DocumentCompleted

    Dim document As HtmlDocument = WebBrowser1.Document

    'Attach KeyDown event handler

    AddHandler document.Body.KeyDown, New HtmlElementEventHandler(AddressOf WebBrowser1_KeyDown)

    'Attach MouseDown event handler

    AddHandler document.Body.MouseDown, New HtmlElementEventHandler(AddressOf WebBrowser1_MouseDown)

End Sub

Private Sub WebBrowser1_KeyDown(ByVal sender As Object, ByVal e As HtmlElementEventArgs)

    If e.CtrlKeyPressed And e.KeyPressedCode <> Keys.ControlKey Then

        'CTRL+SomeKey was pressed.

        Debug.WriteLine("CTRL + " & Chr(e.KeyPressedCode))

    ElseIf e.ShiftKeyPressed And e.KeyPressedCode <> Keys.ShiftKey Then

        'SHIFT+SomeKey was pressed.

        Debug.WriteLine("SHIFT + " & Chr(e.KeyPressedCode))

    ElseIf e.AltKeyPressed AndAlso e.KeyPressedCode <> Keys.Alt Then

        'ALT+SomeKey was pressed.

        Debug.WriteLine("ALT + " & Chr(e.KeyPressedCode))

    Else

        'SomeKey was pressed without any modifier keys.

        Debug.WriteLine(Chr(e.KeyPressedCode))

    End If

End Sub

Private Sub WebBrowser1_MouseDown(ByVal sender As Object, ByVal e As HtmlElementEventArgs)

    If e.MouseButtonsPressed = Windows.Forms.MouseButtons.Left Then

        'MouseDown event

        Debug.WriteLine("MouseDown at " & e.MousePosition.X & "," & e.MousePosition.Y)

    End If

End Sub

Run the code. Click the Button. This will open the Google website and add the mouse and keyboard event handlers.

Now press any key / key-combination or click anywhere in the WebBrowser control and watch is printed in the Debug window.

Enjoy

How the Code Works

The WebBrowser control does not expose the mouse and keyboard events directly. Even if you build your own control inherited from the WebBrowser class or the WebBrowserBase class, the events have been cleverly hidden. There might be some tricky way to expose the events I never know of (e.g. overriding the WndProc etc.).

Fortunately the HTMLDocument class provides ways to hook keyboard and mouse events to the document it is hosting. It is almost same as javascript events but with and added advantage of hooking up with managed code in our application.

Always take care to attach the event handlers when the page has fully loaded in your WebBrowser control. Otherwise, you will experience problems. So the best place to do that is the DocumentCompleted event.

References & Further Readings

HtmlDocument Class

HtmlElementEventHandler Delegate
Derived classes cannot raise base class events 

Keywords: WebBrowser Control, Keyboard events, mouse events, KeyUp, KeyDown, KeyPress, MouseDown, MouseUp, MouseMove, HtmlElementEventHandler, HtmlDocument