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)
 
Categories: Agile | C# | UnitTest

If the symbol is defined, the call is included; otherwise, the call is omitted. Conditional methods provide a cleaner, more elegant alternative to enclosing the method call in #if conditionalSymbol...#endif preprocessor directives.(http://msdn.microsoft.com/en-us/library/4xssyw96%28v=vs.71%29.aspx)
Using the Conditional attribute, you can isolate functions that should be part of your classes only when a particular environment variable is defined or set to a certain value.
The Conditional attribute generates more efficient IL than #if /#endif  does. It also has the advantage of being applicable only at the function level, which forces you to better structure your conditional code. (Effective C#:50 Specific Ways to Improve Your C# by Bill Wagner (Mar 15, 2010))


 
Categories: C# | IoC | MVC | Visual studio 10/up

December 14, 2012
@ 02:16 PM
To transfer the model object from MVC c# object to Knockout  javascript data object:
var modelData = @Html.Raw(Json.Encode(Model));
With the ModelData in js...you can do other as Knockout give to you.

reference url


 
Categories: JQuery | MVC

I saw many ppl have solution for add a watermaker to text fields.
 http://www.mkyong.com/jquery/jquery-watermark-effect-on-text-input/
 http://www.davidjrush.com/blog/2011/10/jquery-creating-a-textbox-text-watermark/

But their solution is not what I want, because it set the value to the text field..and it will be submit with real data when you click submit button.


So I make some improvement.
My solution is use a div to display watermaker message:
<style>
  .watermark { color#999position:absolute }

</style>
<script type="text/javascript">
    
function
SetWatermaker(targetId,text) { var target = $('#' + targetId); target.after('<div class="watermark" style="position: absolute;" id="wm' + targetId + '">' + text + '</div>'); var p = $('#' + targetId).offset(); p.left = p.left + 8; p.top = p.top + 3; var targetWm = $('#wm' + targetId); targetWm.offset(p); target.focusout(function() {
if(target.val()=="")   targetWm.show();
 else
   targetWm.hide();         }); target.focus(function() { targetWm.hide(); }); }

    $(document).ready(function () {        SetWatermaker("txtMACAddress""AA:BB:CC:DD:EE:FF");      });
</script>




 
Categories: JQuery