Retrieving your database is an important step in creating a complex Angular application. This allows testing without access to the backend, you don’t check things twice, and there are fewer dependencies to worry about.
Angular Multimocks is an easy way to test how your application behaves with various API responses.
It allows you to define mock API response sets for different scenarios as JSON files.
It also makes it easy to modify scripts. It does this, allowing you to compose "scripts" from different layout files.
How to add it to your application
After adding the necessary files to your page, just add scenario as a function of your application:
angular .module('yourAppNameHere', ['scenario'])
Once you have added this to your application, you can start creating mocks for API calls.
Let's say your application calls the following API call:
$http.get('/games').then(function (response) { $scope.games = response.data.games; });
You can create a default mock file:
someGames.json example
{ "httpMethod": "GET", "statusCode": 200, "uri": "/games", "response": { "games": [{"name": "Legend of Zelda"}] } }
When the application loads, calls to /games return 200 and {"games": [{"name": "Legend of Zelda"}]}
Now let's say that you want to return a different answer for the same API call, you can put the application in a different script by changing the URL, for example. ?scenario=no-games
In the no-games script, you can use a different file layout, let's say this:
noGames.json example
{ "httpMethod": "GET", "statusCode": 200, "uri": "/games", "response": { "games": [] } }
Now, when you download the application, calls to /games return 200 and {"games": []}
Scripts consist of various JSON mocks in a manifest like this:
{ "_default": [ "games/someGames.json" ], "no-games": [ "games/noGames.json" ] }
You can then exclude the fake files and split the scenario dependency in your production application.