How to create mock Card services for prototyping

When creating new cards you might find that API data you wish to use is not ready. Perhaps the API is still being built, or maybe you're creating a quick prototype as a proof of concept. For cases like these Digital Assistant provides a way to inject the card with mock data responses in JSON format. Later on in development or production mock services can be replaced with real data.

You can follow this guide, if you need some assistance to get started with card creation.

How it works

When creating a new card you can select to use a test data response as the service for your card:

Select test data response as a service

This will generate a default.test.json file when the card is created, which will hold the mock data for your card. To illustrate, let's edit this file and add a "name" field:

Add a name field in the mock json service

The field will be accessible to our card's template in the Designer mode:

Preview of the data from mock service

Make sure you select Live data preview mode in the Settings tab to see the data from the file.

Using variables

An important thing to note is that card notifications only appear when there are changes in the card data. Therefore, if we wish to trigger notifications, simply passing static values like in the example above is not going to work.

Luckily, Digital Assistant allows you to define variables in your mock data, which would return a different value each time your card requests information. The above example can be rewritten in the following way:

Mock service with variable name field

Now instead of always returning the name "Jeff", our mock service will randomly return either "Jeff", "John" or "Jim", which will change the card data and trigger a card notification.

Variable parameters

The following gives a description of the variables that can be used in your mock service.

Current time and date e.g. "2017-11-14T12:49:52Z" String
Where x is a number between 1-60. Returns the current time with x minutes subtracted String
Number of the current calendar month e.g. "11" String
Number of the next calendar month e.g. "12" String
Number of the previous calendar month e.g. "10" String
Randomly generated integer number in a provided 'minVal' and 'maxVal' range e.g. "{{%random-int(5...8)}} => 5". If no range is provided, then returns a number between 0-99 String
Randomly generated decimal number in a provided 'minVal' and 'maxVal' range e.g. " {{%random-int(5.5...8.8)}} => 6.2". If no range is provided, then returns a number between 0-99.99 String
{{%random-text(word1 | word2)}}
Random string from a provided set of strings e.g. "{{%random-text(Bicycle|Bugatti Veyron|Rent a car)}} => Rent a car" String
Returns a random company name String
Returns a random issue (can be used for help desk tickets) e.g. "Global project hangs" String
Returns a mock contact name e.g. "Alec Ryan" String
Returns mock contact initials e.g. "AR" String
Returns a random city in the US e.g. "Filomenaside, Colorado" String
Returns a ZIP code of a random city in the US e.g. "32064-3453" String

Using multiple sources

If you wish to mock several responses, you can use the _files attribute in your default.test.json file. This allows you to specify an array of files to choose from when returning mock data to a card. For example in our default.test.json file:

Specifying files to read

We are specifying 2 JSON files. We will create these 2 files in our card component folder:

We create 2 separate mock JSON responses

File names have to have '.test.json' suffix.

Inside of each file we can specify data and use our variable parameters:

Inside the file test file

As a result a different JSON file will be returned randomly on each data request from the card.