# Mocking HTTP/S Requests

When we need to ensure a decent user experience we do not only test the designed flow, but also exceptional cases. We have to check that the application responds to problems gracefully. Let’s say we have a feedback form. The typical scenario would be: user submits the filled out form and gets notified when it’s done. But what if a problem happens on the server side? The application is supposed to warn the user. How do we test such cases? We cannot reproduce the issue until everything is fine with the server side. However, we can use `page.mockRequest` to intercept submission request sent to the server and replace it with our own.

On [demo page](https://puppetry.app/demo) you can find a demo form. When user submits it the page emulates sending data:

```javascript
fetch( … )
  .then(function( rsp ){
    rsp.status !== 200 && showAlert();
  })
  .catch( showAlert );

```

If the response from the server has got status code different from `200` (OK) the form displays alert box: 

![Form error message](https://3461068122-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LdyKJ-zzeS2hB7DF04J%2F-Lv5VKmz7SAdW3B6SPcC%2F-LvAbIx0bwoo2nZSnJ7A%2Fmock-01.png?alt=media\&token=ad929105-04d9-4e27-9479-dcdfdf2f5a17)

In the example server always responds with status 200, unless it's down. If we want to simulate this particular case we need to replace the response from the server with our own. Overridden response will have status 500.

The test case for the exceptional behavior may look like that:

![Testing exception behavior](https://3461068122-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LdyKJ-zzeS2hB7DF04J%2F-Lvtv_zByNci5JsrYzXv%2F-LvtxcjtIRxkDHfqo-Te%2Fmock-request1.png?alt=media\&token=38085590-6c6c-47bb-b6bc-7ee59984499b)

Here we make Puppetry listening to the next request containing “response.json” in the URL and replace it with errored one "500 Internal Server Error":

![Mocking HTTP/S request](https://3461068122-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LdyKJ-zzeS2hB7DF04J%2F-Lvtv_zByNci5JsrYzXv%2F-LvtxZdaIKeZaq-Te7ai%2Fmock-request2.png?alt=media\&token=9ee102d1-4353-496b-bba1-535a3cba225c)

Then the test fills out the form and submits it. At the end we assert that user gets warned about the problem (`ALERT_BOX` is visible).

As you see, we can test exceptional behaviour. We can entirely emulate the server by mocking requests when it's not available. We can seed the client with predefined data when testing pages with dynamic content. And we can do much more.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.puppetry.app/testing-techniques/mocking-http-s-requests.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.