Member Avatar for arunkumars

Hi,

I have a VS2005/C#/.NET 2.0 application in which i'm hosting a web browser control. I would like to offer a "record" and "playback" functionality for web page activity. Meaning- Say a user wants to record a certain sequence of actions like (just a raw example):

1) navigating into a certain web page
2) entering credential information
3) setting two radio buttons on that page
4) clicking login
5) [navigates to another page]
6) selecting a checkbox
7) clicking a button
8) [navigates to the final page]

when the user hits "record", I'd like to record these actions as the user browses and I'd also like to be able to play them back automatically when the user chooses to. I just want to make sure you understand: This is not some kind of hidden 'spy' application - the user chooses to do this while using my own special browser so there are no covert intentions whatsoever.

My question: how should I go about this. Trapping mouse and keyboard inputs and playing them back? comparing the HTML document from after initial loading, to pre-navigation to see what changed? how do I apply something like that back automatically? any help with direction would be greatly appreciated.

  • 2 Contributors
  • 2 Replies
  • 508 Views
  • 6 Days Discussion Span
  • Latest Post Latest Post by arunkumars

Dani AI

Generated

A practical, reliable approach is to record semantic DOM actions (Navigate, SetValue, Click, Select) rather than raw screen/video or low-level mouse/keyboard events. That makes files small, replayable, and robust across minor layout changes. As noted, full-featured automation tools exist, but inside your WinForms WebBrowser you can implement a lightweight recorder that (1) captures DOM events, (2) serializes a small action list, and (3) replays by driving the DOM and waiting for navigations — all triggered by your Start/Stop/Replay UI from .

Capture: on DocumentCompleted attach event handlers to inputs, selects, anchors and forms. Record an action object (type, selector/id, value, timestamp or relative delay). You can attach handlers with HtmlElement.AttachEventHandler or inject a tiny script that calls back to the host via window.external (host must be [ComVisible(true)]). Example (conceptual):

// on DocumentCompleted
foreach (HtmlElement el in webBrowser.Document.GetElementsByTagName("input"))
{
    string t = (el.GetAttribute("type") ?? "").ToLower();
    if (t == "text" || t == "password")
        el.AttachEventHandler("onchange", Element_Changed);
    else
        el.AttachEventHandler("onclick", Element_Clicked);
}

Persist: store a List<RecordedAction> and serialize with XmlSerializer (works well on .NET 2.0). A minimal RecordedAction might include ActionType, Selector (id/name or generated path), Value, and DelayMs.

Replay: load the action list and play them in order. For Navigate actions call webBrowser.Navigate(url) and wait for DocumentCompleted before continuing. For SetValue use element.SetAttribute("value", value); for Click use element.InvokeMember("click"). Always use timeouts and retries: dynamic pages or SPAs may require waiting for the element to appear or trying alternate selectors.

Cautions and tips: prefer stable selectors (id/name or a data- attribute you control). Be aware of frames/iframes, cross-domain restrictions, and IE security zone settings which can block injected script or scripting callbacks. Never store plaintext credentials — encrypt them and get explicit user consent. If you actually need a video of the session, that is much heavier (screen capture or media-encode) and usually unnecessary for automation; recording actions is simpler and more robust.

Recommended Answers

All 2 Replies

Member Avatar for Ketsuekiame

This sounds very much like Coded UI

So it might be worth checking that out first. Otherwise, I'd recommend that you decide on what possible actions you can have. Examples might include "EnterURL", "Click Hyperlink", "Submit Form Details" etc.
Then whenever a user did something on your built in control, you could capture that action (with the enum) and provide some data. So in the case of "EnterURL" you would record the hyper link.

The action of recording would probably need to be done as it happened, which should be able to be picked up in your host (Fire an event).

Member Avatar for arunkumars

i have added menu items with name Start, Stop and Replay which would on clicking these items would record the video and play it back to the user.

I do not want to use any free tool to record this video, is there any other option possible ?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.