Tips & Tricks : Mocking APIs With Playwright

Hello, everyone. This brief blog post is the first in a series of tips, tricks and best practices that QA engineers should be aware of to enhance their testing approach. I will highlight the benefits of mocking API responses and demonstrate how you can achieve this using Playwright.

As we are aware, in the testing pyramid, the largest portion of the system is covered by unit testing, followed by integration testing, and finally, end-to-end (e2e) testing. By efficiently maintaining this approach, our e2e testing can be more focused on high-priority, critical use cases, and user stories. Consequently, this approach helps us avoid overwhelming our backend with a multitude of API requests due to the high volume of test cases, leading to more efficient and effective testing.

Mocking APIs means simulating or manipulating the behavior of the API during testing. It allows you to intercept and control API requests and their responses without actually generating real network traffic, thereby avoiding overwhelming the backend especially if you want to scale up you tests.

Mocking APIs is an efficient technique that can enhance our E2E automation tests. It helps “isolate our test cases”, enabling them to focus on user stories and system behavior without relying on external services or API availability. Consequently, this approach makes our tests more stable, reliable, and less prone to flakiness.

Furthermore, mocking APIs facilitates the creation of more complex “test scenarios” that might be challenging to implement without mocking since these scenarios might rely on specific responses such as success, errors, timeouts, status codes, and specific data, which can be difficult to maintain through the frontend alone.

Using this approach enhances “test efficiency” since mocking APIs is faster than relying on live APIs. With full control over API responses, you can easily avoid delays. Additionally, this leads to “cost reduction” as it eliminates the need to use live APIs, which may consume expenses.

Playwright mocks APIs in a straightforward manner. I will demonstrate a couple of approaches through which we can learn how to do this. The first approach involves mocking the API response without making an actual request to the endpoint. Then, we’ll load the page associated with this mocked API.