Best practice mocking with DataSource

6 posts, 1 answers
  1. David
    David avatar
    60 posts
    Member since:
    Nov 2012

    Posted 07 Jan 2013 Link to this post

    I have been using an older version of kendo ui mobile, due to a bug I found in the old version of Kendo ui mobile, I had to upgrade to the latest in the latest one (went from v2012.2.913 to v2012.3.1114).  I have been using the mockjax library to mock the server responses to ajax calls, however in the latest version the mock is not getting hit.  Am I doing something improper in the code or is there a better way to accomplish this testing?

    Here is an example of my previous setup:
    mockjax:
    $.mockjax({
        url: '/url',
            dataType:"json",
            responseText: {
                status: "ok",
                results: [
                    {
                        name: "blah",
                        value: "blah",                 
                    },{
                        name: "blah2",
                        value: "blah2",
                    }
                ]
            }
    });

    View model code with a datasource
    var VM= kendo.observable({
      data: new kendo.data.DataSource({
        transport: {
          read: {
            url: '/url',
            dataType: "json"
          },
          parameterMap: function(options) {
            return {
              maxResults: 15
            }
          }
        },
        schema: {
          data: "results"
        }
      })
    });
  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2894 posts

    Posted 09 Jan 2013 Link to this post

    Hello David,

    The problem might be connected with the jQuery version.

    KendoUI v2012.3.1114 requires jQuery 1.8.2 while according to the mockjax docs "current version of Mockjax has been tested with jQuery 1.3.2 through 1.7.0 with QUnit unit tests" (link). Are you sure that mockjax plug-in is compatible with 1.8.2? Please test this with a standard jQuery ajax request.

    In case it is working fine, please send me a small jsBin/jsFiddle example that demonstrates the issue and I will do my best to help.
    Thank you in advance for the cooperation.

    Regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. David
    David avatar
    60 posts
    Member since:
    Nov 2012

    Posted 09 Jan 2013 Link to this post

    It works fine if I don't use the dataSource ... here is a js fiddle that illustrates the issue http://jsbin.com/efucir/1/edit.  If I have in the header the old kendo UI scripts as well as the new ones (commented out by default).  If you look at the output you can see the DataSource fetch gets caught by mockjax, and then if you press the button you can see the $.post getting intercepted.

    If you comment out the old kendo source and put the new ones in, you can see that the data source no longer works but the manual approach still does (which leads me to believe it is not a jQuery issue).

    My heart is not set on using mockjax, I am sure there are other ways to mock the server data if there is a better approach to solving this I would love to hear about it.  Perhaps using a spy from Jasmine would work ...
     
    Thanks for your help.
      -David
  4. Answer
    Alexander Valchev
    Admin
    Alexander Valchev avatar
    2894 posts

    Posted 11 Jan 2013 Link to this post

    Hi David,

    To fix the problem please include the mockjax script before Kendo JavaScript files.
    Here is a link to the updated example: http://jsbin.com/efucir/13/edit

    Regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. David
    David avatar
    60 posts
    Member since:
    Nov 2012

    Posted 11 Jan 2013 Link to this post

    Works like a charm thanks for the help Alexander.

    On a related note does this seem like a decent way to mock server responses with DataSources, or is there a better way people typically use when developing with KendoUI?

    -David
  6. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2894 posts

    Posted 11 Jan 2013 Link to this post

    Hello David,

    This is a decent way to test Ajax requests. Actually we use it for some of our tests too.

    Kind regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top