Skip to Content
Technical Articles
Author's profile photo Jacek Wozniczak

UI5: not so random mock data

The good thing in generating random oData using UI5’s MockServer is that they are automatically generated and random. The bad thing is...well, randomness. Sometimes they are too meaningless and unrelated, for example, when values of one property should be related to other to have any sense, not to mention their impact on UI elements and behavior. They can be prepared manually as required, but in the early stage of development, when I start with creating metadata.xml from scratch, there is way too much work in keeping them valid. But still I would like to have them generated with one command. This led me to the solution presented below, available as a part of Brackets-UI5 plugin or as an extension for SAP Web IDE.

Let’s take Northwind test service (https://services.odata.org/V3/OData/OData.svc/$metadata) as a base service; after generating data in a standard way we have:

“Rating”: 416

“Rating”: 2584

and so on. Not good, let’s make them random, but more predictable.

By putting .mockconfig.json in the target folder for mock data, I will control the values I would like to receive for Product/Rating:

{
    "predefined": {
        "Product": {
            "Rating": [1, 2, 3, 5, 6, 7, 8, 9, 10]
        }
    }
}

Generating mock data again gives random values but from the predefined set:

[{
"ID": 9,
"Name": "Name 1",
"Description": "Description1",
"ReleaseDate": "/Date(967835910000)/",
"DiscontinuedDate": "/Date(1114283910000)/",
"Rating": 7,
"Price": 0.00985394674611232,
...
}, {
"ID": 416,
"Name": "Name 2",
"Description": "Description 2",
"ReleaseDate": "/Date(1264191510000)/",
"DiscontinuedDate": "/Date(1509218310000)/",
"Rating": 4,
"Price": 0.4163109025208215,
...
}, {
"ID": 6671,
"Name": "Name 3",
"Description": "Description 3",
"ReleaseDate": "/Date(1149189510000)/",
"DiscontinuedDate": "/Date(1224703110000)/",
"Rating": 6,
"Price": 6.671921353592035,
...
}
...

Much better. Now I would like to have the same set of ProductID for Product and ProductDetails properties. I could just copy the same array of IDs, but it’s better to have it re-usable and reference whenever ProductID is required.

{
  "variables": {
    "productID": ["ID1", "ID2", "ID3"]
  },
  "predefined": {
    "Product": {
    "Rating": [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
    "ID": "$ref:productID"
    },
    "ProductDetails": {
      "ProductID": "$ref:productID"
    }
  }
}

Now in Products.json:

[{
  "ID": "ID2",
  "Name": "Name 1",
  ...
}, {
  "ID": "ID1",
  "Name": "Name 2"
  ...
}, {
  "ID": "ID3",
  "Name": "Name 5",
...

and in ProductDetails.json:

[{
  "ProductID": "ID2",
  "Details": "Details 1",
  ...
}, {
  "ProductID": "ID1",
  "Details": "Details 2",
  ...
}, {
  "ProductID": "ID1",
  "Details": "Details 3",
  ...

Now I want to have this “Details” text related with ID1 and ID2, for the rest of the IDs default random text is fine:

.mockconfig.json:

{
  "variables": {
    "productID": ["ID1", "ID2", "ID3", "ID4"]
  },
  "predefined": {
    "Product": {
      "Rating": [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
      "ID": "$ref:productID"
    },
  "ProductDetail": {
    "ProductID": "$ref:productID",
    "Details": {
      "reference": "ProductID",
      "values": [{
         "key": "ID1",
         "value": "Custom details text for Product with ID1"
      }, {
         "key": "ID2",
         "value": "Custom details text for Product with ID2"
      }]
     }
    }
  }
}

ProductDetails.json result:

[{
  "ProductID": "ID2",
  "Details": "Custom details text for Product with ID2",
  ...
}, {
  "ProductID": "ID3",
  "Details": "Details 2",
  ...
}, {
  "ProductID": "ID3",
  "Details": "Details 3",
  ...
}, {
  "ProductID": "ID2",
  "Details": "Custom details text for Product with ID2",
  ...

Having all above options I can build randomly selected, but limited and related set of data. And, last but not least – to skip generation of data for given entities (for example I’ve them already manually prepared) I can add the below to the .mockconfig.json:

...
"skipMockGeneration": ["Persons", "Suppliers"],
...​

I hope that examples give the idea – with such prepared configuration a lot of manual edition of data is not required and more advanced and business-relevant data can be generated.

As I said at the beginning, this feature is available in two flavors and there are little differences in the configuration options, please check the documentation below.

– Brackets-UI5 plugin (https://github.com/wozjac/brackets-ui5) for Brackets editor, section oData Mock Generator

– an extension for SAP Web IDE (https://github.com/wozjac/sap-web-ide-mock-gen), check README for installation & usage.

 

 

Assigned Tags

      2 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Mauricio Lauffer
      Mauricio Lauffer

      Good post, thanks for sharing.

      I've created an UI5 library which improves mock data with no hardcoded values.

      Smart MockServer works based on OData annotations or simple parameters you pass to the mockserver. Have a look.

       

      https://blogs.sap.com/2019/05/14/make-fiori-testing-smart-again-openui5-smart-mockserver-to-the-rescue/

      Author's profile photo Jacek Wozniczak
      Jacek Wozniczak
      Blog Post Author

      Thanks for sharing your solution, very handy!