Mock responses with the Microsoft Graph Developer Proxy

The Microsoft Graph Developer Proxy is a tool that can help you test applications which use Microsoft Graph and other APIs. You can use this tool to perform the following tests:

• Mocking responses
• Simulating errors
• Simulating throttling

In this blog post, we are going to see an example on how to use the Microsoft Graph Developer Proxy to mock API call responses without any code modification.

If you want more details about the Microsoft Graph Developer Proxy, you can go here: msgraph-developer-proxy.

Content

1. Getting started
2. Why mocking responses ?
3. Responses configuration
4. Start the proxy and test the application
5. Summary
6. References

Getting started

For this example, we will use:

• A Microsoft 365 demo tenant – you can get one by signing up to the Microsoft 365 Developer Program
• The Microsoft Graph Developer Proxy (obviously ;)) – you can install it by following the steps described here: Get started
• An application using the Microsoft Graph API – in this example, we will use a Viva Connection Adaptive Card Extension that you can find here: ImageCard-MostLikedPages

Why mocking responses ?

In our case, the application displays most liked pages out of a list of selected SharePoint sites using the Microsoft Graph API.

To test this adaptive card extension, as a developer, you need to create multiple pages across different sites and to log on as different users to like those pages. This can take a lot of time, especially if you want to test different scenarios (e.g.: hundred of pages with multiple likes each).

Of course you could create your own file containing sample data instead of your real API call response. But then you would have to make some changes in your code, so this is not an ideal solution.

The great benefit of using the Microsoft Graph Developer Proxy is that you can mock responses without making any changes to your code !

Responses configuration

To configure the responses to mock, we need to create a responses.json. The great thing with the Microsoft Graph Developer Proxy is that each application can have its own responses.json file.

In our example, let’s create this file at the root of our ACE solution:

{
  "responses": [
    {
      "url": "", // URL of our API endpoint
      "method": "", // Method of our API call
      "responseBody": {}, // Body to send as the response to the request
      "responseHeaders": {} // Headers to include in the response
    }
  ]
}

We now want to mock a response to the following API call: https://graph.microsoft.com/beta/sites/{site-id}/pages?$select=reactions,title,webUrl,thumbnailWebUrl to get all pages of a specific site, along with their respective numbers of likes.

Our file will look like this:

{
  "responses": [
    {
      "url": "https://graph.microsoft.com/beta/sites/{site-id}/pages*",
      "method":  "GET",
      "responseBody": {
        "@odata.context": "https://graph.microsoft.com/beta/$metadata#sites('{site-id}')/pages(reactions,title,webUrl,thumbnailWebUrl)",
        "value": [{
        "webUrl": "SitePages/Page-1.aspx",
        "title": "Microsoft Graph Developer Proxy",
        "thumbnailWebUrl": "",
        "reactions": {
            "likeCount": 42
        }
    },
    {
        "webUrl": "SitePages/Page-2.aspx",
        "title": "About blueberries",
        "thumbnailWebUrl": "",
        "reactions": {
            "likeCount": 33
        }
    },
    {
        "webUrl": "SitePages/Home.aspx",
        "title": "Home",
        "thumbnailWebUrl": "",
        "reactions": {}
    },
    {
        "webUrl": "SitePages/Page-3.aspx",
        "title": "Work from home",
        "thumbnailWebUrl": "",
        "reactions": {
            "likeCount": 12
        }
    }]
      },
      "responseHeaders": {
        "content-type": "application/json; odata.metadata=minimal"
      }
    }
  ]
}

It is important to define the absolute URL of the API endpoint. For example, here we define pages to return for a specific site ({site-id}).

Start the proxy and test the application

When you start the proxy, you define its settings depending on what you want to test.

In our case, we want to test successful API calls with mock responses. In a PowerShell console, we enter the following line:

m365proxy --mocks-file {root-folder-path}\ImageCard-MostLikedPages\responses.json --failure-rate 0

Now let’s load our application returning the SharePoint pages with their number of likes defined in the responses.json file.

We can also see on the PowerShell console that the request was successfully interpreted by the proxy.

Summary

In this blog post, we performed the necessary steps to use the Microsoft Graph Developer Proxy to mock API call responses. This feature can be used in multiple scenarios, for example to easily test specific responses or to test how an application handles a large amount of data. It is also possible to define unsuccessful responses with a specific error code to test how the application handles it.

References

Introducing the Microsoft Graph Developer Proxy community preview

Microsoft Graph Developer Proxy

Mock responses