dmerson
1/13/2014 - 5:20 AM

Testing Telerik Kendo View Model

Testing Telerik Kendo View Model

Test Kendo View Model Example
content_copyfile_download
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>QUnit Example</title>
  <link rel="stylesheet" href="qunit.css">
     <link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.common.min.css" rel="stylesheet" />
        <link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.default.min.css" rel="stylesheet" />
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"> </script>
        <script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.all.min.js"> </script>
</head>
<body>
  <div id="qunit"></div>
    <div id="qunit-fixture">
        <div id="view">
            <input id="myName" data-bind="value: name" />
            <input  id="test" data-bind="value:test" />
            <input data-bind="value: obj.name" />
            <button data-bind="click: displayGreeting">Display Greeting</button>
        </div>
        
    </div>
  <script src="qunit.js"></script>
  <script src="tests.js"></script>
</body>
</html>

test.js-----
test( "hello test", function() {
    $( "#test" ).kendoDatePicker();
    var viewModel = kendo.observable( {
        name: "John Doe",
        test: "1/1/2014",
        obj: { name: "test" },
        displayGreeting: function ()
        {
            var name = this.get( "name" );
            alert( "Hello, " + name + "!!!" );
        }
    } );
    kendo.bind( $( "#view" ), viewModel );
    console.log("test");
    console.log( $( "#myName" ).val() );
    ok( $( "#myName" ).val() == "John Doe", "test input mvvm" );
    ok( viewModel.name == "John Doe", "test view model" );
    $( "#myName" ).val( "Jane Doe" );
    ok( viewModel.name == "John Doe", "test view model change" );
   // ok( $( "#myName" ).val() == "John Doe", "Check input in kendo mvvm" );
});