Motivation

There would be an oData service modeled before the developement phase, at least in an ideal world. We can then let our frontend ui5 developers use the mockserver instead of running oData service on SAP GW. The mockserver responds to all oData requests with some sample data, so our backend developers can feel free to experiment with SAP GW as much as they want and not to be afraid of stopping ui5 developers from work.

Using Mockserver

The mockserver can be found in library sap.ui.core.util.MockServer. The settings are quite simple, even though some mistake can take you hour(s) of debugging (like me).

  1. You need to include Mockserver’s library.
  2. You need to prepare you metadata in xml file. You can use existing service, grab its metadata with $metadata command in gateway client like this <gw-server>/<gw-service>/$metadata
  3. You need to prepare JSON sample data of your entities, you can use <gw-server>/<gw-service>/<entitySet>?$format=json and delete metadata.

Critical part of code

    jQuery.sap.require("sap.ui.core.util.MockServer");
    // Create mockserver
    var oMockServer = new sap.ui.core.util.MockServer({
        rootUri: "http://mymockserver/",
    });              
    oMockServer.simulate("model/metadata.xml", "model/");
    oMockServer.start();

    // setting up model
    var oModel = new sap.ui.model.odata.ODataModel("http://mymockserver/", true);
    sap.ui.getCore().setModel(oModel);

Running application

ui3.JPG

I used my example openui5 application that can manage(add, edit, delete) users and boosted it with mockserver.

You can try the application with mockserver by yourself herehttp://pmarcely.github.io/mockserver.html

All the codes are also in my github:

Remarks

  1. It seems strange to me that metadata are in XML, while sample data in JSON, it would be smooth to work with one format.
  2. There are some error messages from mockserver in my application, even though it is working properly. If you know what it is wrong let me know.
  3. For more sophisticated usage you can check source code of application Cart in UI5 demo apps.

Hope you enjoy it!

To report this post you need to login first.

19 Comments

You must be Logged on to comment or reply to a post.

  1. Nigel James

    I was having a conversation with some members of our team about this very subject not too long ago. It makes sense to be able to continue development when offline.

    Thanks for posting this – I look forward to trying it.

    Nigel

    (0) 
    1. Matt Harding

      Well I’d be one of those members Nigel refers to 🙂 . 

      One question about your post: Why you are doing the following:

      oModel.setCountSupported(false);


      Is this just to get rid of the annoying double fetch in your normal code or a limitation of the Mock Server?


      Also, John Patterson mentioned to look into the unit test cases of the mock server for some more detailed examples of the Mock Server (found in the SDK), but I’m liking your doco much more than reverse engineering that (though it shows plenty of possibilities).


      Would be especially interested if you’ve played around with putting logic behind POSTS to provide a more true API response (e.g. To simulate errors for certain data) with the Mock server since I got stuck trying to do this.


      Cheers,

      Matt

      (0) 
      1. Peter Marcely Post author

        Hi Matt,

        good point with that count. I thought it is a limitation of the Mockserver. I took an inspiration from Cart demo app and there is following comment which is apparently not valid anymore. The cart app is using deprecated library too.

        //if we do not set this property to false, this would lead to a synchronized request which blocks the ui

          oModel.setCountSupported(false);

        But it works now, though it is there twice as you said. Log from debugger:

        MockServer: incoming request for url: http://mymockserver/UserSet/$count –  sap-ui-core-dbg.js:14441

        MockServer: response sent with: 200, 3 – 

        I will correct it, if there are no more objections 🙂

        I have not played more with that, but I know it is used for automated tests, so why not to post a question to scn 🙂

        Thanks and regards,

        Peter

        (0) 
        1. Matt Harding

          Thanks Peter. I’ll spend a few hours debugging myself first on the plane then when I feel clued in enough to ask the question I will definitely do that 😉

          Cheers and keep up the great work,

          Matt

          (0) 
        2. John Patterson

          As far as i can see wrt ODataModel mocking, the Mockserver and the ODataModel are works in progress. Each release new features get added. Initially when i started using the Mockserver for testing (offline needs completely different techniques the JSON files are static by default) I found i had to write my own workarounds, with each new version i read the release notes and look at the tests for both the ODataModel and Mockserver and re-factor accordingly.

          Its a tough ask to have the Mockserver perform the full capabilities OData provides,

          . eg Matt had a requirement to POST Media Resource with his Entity i dont think you can even do this in XSOData.

          wrt the count issue

          https://github.com/SAP/openui5/issues/21

          some of the issues have been solved not all

          JSP

          (0) 
          1. Matt Harding

            Hi John,

            I wish it would do media resources, but my requirements are far more simplistic that that. e.g. Post a new Entity, and some default values get set when you do so; would be a good example of what would be nice (similarly, changing a value, may reset other properties).

            I still say we should have mock capability built into Gateway so that you can take your time building the back-end implementation, and if you could build that mock capability in a way that could be deployed as a separate set of JS and JSON files with a click of a button – then …that would be awesome! (I like to dream)…

            Cheers,

            Matt

            ps. Noisy bunch of Aussie people on this comment thread!

            (0) 
            1. John Patterson

              I completely agree

              My thought is a Nodejs SAP OData Server solution, lightweight can be run anywhere on any DB, similar to Jayserver but with the same scope of features as SAP OData.

              the dependency will break traditional TDD, but will work well for rapid development and E2E testing.


              I can see this is where RDE is heading, but River and XOData are very limited when compared SAP Gateway and think it will be hard to make them interchangeable.

              jsp

              (0) 
          2. Peter Marcely Post author

            Hi John,

            thanks for comment, I wanted to show the basic working example of mockserver, because there is no mention about it at all, except from few threads (where you participated) here on scn and some not explained codes on github.

            Regarding posting to media entity, there is control in SAPUI5 ( hacked by Matt 🙂 )- sap.ca.ui.fileupload. The mockserver is there used for posting file as well. Even though the file is not uploaded, but at least it the control works offline.

            Regards,

            Peter

            (0) 
  2. shivam shukla

    Hi Peter ,

    I tried to Create the Mock Server With the process you have posted , but I am getting my table on my view with NoData , I am not able to Check what i have Done wrong .

    Can you please suggest something .

    Thanks,

    Shivam

    (0) 
    1. Peter Marcely Post author

      Hi Shivam,

      It is hard to help you with the information you provided. Can you please post your question with more details as a discussion topic? More people will notice it.

      Best regards,

      Peter

      (0) 
      1. shivam shukla

        Hi Peter ,

        Thanks , My Problem got solved Actually I was referring the Model Wrongly , Now I am able to Execute the Application Correctly .

        Thanks for your posting such a nice blog for Mock Server .

        Thanks,

        Shivam

        (0) 
  3. Ramesh Shrestha

    Hi Peter,

    I have downloaded the code from your github site and tried working on it. I found the code for image upload, but it is not working for me.

    I am getting following error while pressing on upload.

    Can you please help me on this.

    2015-06-01 17:33:44 File upload failed:

    Cannot read property ‘addEventListener’ of undefined – 

    (0) 
  4. Sandor Veres

    Hi Peter,

    Is it works only when it is on http server, or it is doing the job too when it stored on local PC?

    I tried on my local PC, and not getting the datas.

    Thanks

    Sandor

    (0) 
  5. Rama Krishna Kilari

    Hi Peter,

    while simulating mock server it will generate the metadata automatically? or we need to write the metadata file manually?

    and my mockdata json file is in model folder hoe to load the data into server from json file

    (0) 

Leave a Reply