Skip to main content

Getting Started

Our extension works as a customizable API mock server in a chrome extension that allows you to effortlessly mock HTTP requests by defining a set of configurations/rules that will dictate what requests in your webpage get a mocked response inputted by you in the extension. tweak listens for outgoing HTTP requests to match them against your configurations, if there's a match tweak will re-write the request for you, you have all the power!

Here's how the extension looks like.

tweak anatomy

1. Global settings#

  • Search on/off: read more about the Request Autocomplete functionality
  • Delete all: deletes all the configurations and the request autocomplete cache. Re-trigger in the browser tab the requests that you wish to search in the URL field.
  • Collapse all rows: minimizes all the rows
  • Run/Pause the extension: click on the Run button when you are ready to start intercepting requests. You can also achieve this through a shortcut.
  • Create a new configuration: adds a new empty configuration as a row

2. Import/Export#

You can use the export functionality to save configurations and test cases that can be imported back later on.

3. Label#

When writing a free form label under the Label text field it will be reflected on top of the URL input field. This will allow you to quickly differentiate the various configurations you might have in the extension, since it's visible even if the configuration is collapsed.

4. Regular expression toggle#

When toggled on, you can specify a regular expression to match against the request URL. Don't worry about typos, we will give you instant feedback on whether your regular expression is valid or not.

5. Number of requests intercepted#

The number of requests intercepted by a given row are reflected in the counter near the activation toggle. This serves only as an indicator, it can also help you understand how many times that request was triggered by the page. Additionally, when intercepting requests the timestamp of the last request intercepted by a given row is displayed in the counter tooltip.

tooltip timestamp
Use the counter to debug

If you're seeing the 0 value after trying to intercept a request it means that you might have a mismatch on your configuration, double check the request URL and the selected HTTP method to ensure everything is ok.

6. More options & actions#

Certain actions to manipulate configs such as delete or duplicate a config can be reached through this icon.

7. Status code#

Write here the status code you want for your request response.

8. Delay by#

In this field you can introduce artificial delays on the resolution of a given request (or requests). We wrote this blog post to explain this in detail.

9. Editor area#

In this are you can specify the following:

  • Response payload that will be resolved with the intercepted request.
  • Request payload, it does not send out the request payload to the server, but instead it acts like a filter. You can combine a config URL + request payload to target a specific POST request, this is .particularly useful for use cases such as GraphQL where it's usual to hit the same endpoint /graphql but changing the request payload sent out to the server. This allows you to narrow your config to intercept and mock a specific request.
  • Response headers, a table where you can write the headers you want in your response.

A small note on the HTTP method field. We've been receiving a lot of feedback around the number of supported methods. Note that all HTTP methods are available (as well as a wildcard option), but for chrome users it might not be clear that the select menu is scrollable. We'll work on making that clear.

Was this page helpful?