Reference:

http://www.codeproject.com/Articles/105497/Automated-UI-tests-with-Watin-in-ASP-NET-MVC

http://blog.willbeattie.net/2011/06/getting-started-with-specflow-watin.html 

My Spectflow feature file

My Step files:
#region Fill fields in form and Submit UserAccountInfo Request

    [Given(@"I on the UserAccountInfo metadata UI test page")]
    public void GivenIOnTheUserAccountInfoMetadataUITestPage()
    {
        CurrentBrowser.GoTo(@"http://localhost:45166/TestWidgetAction?widgetName=BusinessCenterAdminWidgetUser&actionName=UserAccountInfo&returnFormat=HTML");
        CurrentBrowser.WaitForComplete();
    }

    [Given(@"I have entered All fields for UserAccountInfo Metedat UI")]
    public void GivenIHaveEnteredAllFieldsForUserAccountInfoMetedatUI()
    {

        CurrentBrowser.TextField(Find.ById("SessionID")).TypeText(RequestData.SessionID);
        CurrentBrowser.TextField(Find.ById("AccountNumber")).TypeText(RequestData.AccountNumber);
        CurrentBrowser.TextField(Find.ById("AccountContextID")).TypeText(RequestData.AccountContextID);
        CurrentBrowser.TextField(Find.ById("UserID")).TypeText(RequestData.UserID);
        CurrentBrowser.TextField(Find.ById("ConsumerID")).TypeText(RequestData.ConsumerID);
        CurrentBrowser.TextField(Find.ById("TransactionID")).TypeText(RequestData.TransactionID.ToString());
        CurrentBrowser.TextField(Find.ById("OutputType")).TypeText(RequestData.OutputType);
    }

    [When(@"I click submit button for UserAccountInfo Metedat UI")]
    public void WhenIClickSubmitButtonForUserAccountInfoMetedatUI()
    {
        CurrentBrowser.InjectAjaxMonitor();
        CurrentBrowser.Button(Find.ById("btnSubmit")).ClickNoWait();
        
    }

    [Then(@"The Request Url woll displayed in Request section of UserAccountInfo Metedat UI")]
    public void ThenTheRequestUrlWollDisplayedInRequestSectionOfUserAccountInfoMetedatUI()
    {
        CurrentBrowser.WaitForComplete();
        CurrentBrowser.WaitForAjaxRequest();
      var divRequest= CurrentBrowser.Div(Find.ById("divRequest"));
      Assert.IsTrue(((WatiN.Core.Element)(divRequest)).OuterText.Contains("AccountNumber="+RequestData.AccountNumber));//
    }

    [Then(@"The AccountInfo will be loaded in Response Section of UserAccountInfo Metedat UI")]
    public void ThenTheAccountInfoWillBeLoadedInResponseSectionOfUserAccountInfoMetedatUI()
    {
        var divResponse = CurrentBrowser.Div(Find.ById("divOutput"));
        Assert.IsTrue(divResponse.OuterText.Contains(RequestData.AccountNumber));

    }

    #endregion

 

WebBrowserHelper.cs
 [Binding]
    public  class WebBrowserHelper
    {
        public static Browser CurrentBrowser
        {
            get
            {
                if (!ScenarioContext.Current.ContainsKey("browser"))
                {
                    ScenarioContext.Current["browser"] = new IE();
                }
                return (Browser)ScenarioContext.Current["browser"];
            }
        }
        
        [AfterScenario]
        public static void Close()
        {
            if (ScenarioContext.Current.ContainsKey("browser"))
            {
                CurrentBrowser.Close();
            }
        }
    }

My Codes:

 BrowserExtension.cs (1.72 KB) WebBrowserHelper.cs (.85 KB) UserAdminStepHelper.cs (.75 KB) 
UserStoryForMetadataUI_LoadUserAccount.step.cs (5.74 KB) UserStoryForMetadataUI_LoadUserAccount.feature (1.25 KB)