Accelerate frontend development with these Requestly features
Requestly helps accelerate frontend development & testing. Requestly helps reduce dependency on backend developers, environments, and QAs to make their frontend development cycle faster. In this article, we will talk about the most important features of Requestly that you can learn quickly and save ~2 hours every week and, more importantly, ship your code faster with confidence.
Setup Redirects (URL Rewrite | Map Remote | Map Local)
Redirect Rule helps you set up client-side 307 redirects from one endpoint to another endpoint. This can be used for the following use cases –
- Redirect JS/APIs from Production to Local Environment (Map Remote) .. Read More
- Redirect HTTP calls to local system files (Map Local) … Read More
- Redirect Backend/Third Part API calls to mock server. … Read More
This feature is also very helpful when your JS is deployed on external websites (e.g., your customer’s website); you can use the Redirect Rule to swap the script invoked by your customer’s website with the script running on your local machine or your staging server.
Redirect Rule helps you test your local JS/API changes very quickly without deploying them on the production environment.
More Details → Documentation • Demo Video
Swap HostNames (Replace Rule)
Replace String rule works like typical “Find & Replace” feature of text/code editors. You just need to define search string and replace string under “Replace” & “With” respectively.
Following are the popular use cases –
- Replace
prod.checkout.company.com
withstag.checkout.company.com
to test prod application with a staging service. .. Read More - Replace
api.thirdparty.com
withmock_server.requestly.tech
to redirect third party api calls to mock server (Learn how to create API Mocks), without modifying your application. .. Read More - Replace
.min.js
With.js
to debug with non-minified versions of Java Scripts.
More Details → Documentation • Demo Video
Modify Request & Response Headers
Modify Headers rule helps you add, remove or override existing headers in a few clicks. Simply define the Source condition and add header modifications as key-values. This can be used in following cases –
- Bypass CORS error by modifying values of
Access-Control-Allow-Origin
& other in response headers .. Read More - Remove
Content-Security-Policy
header to add external scripts to a web page .. Read More - Modify Authorization Headers to bypass the authentication while testing .. Read More
- Open web pages in iFrame by removing/modifying
X-Frame-Options
&Content-Security-Policy
.. Read More
Modify Headers rule is very helpful in bypassing CORS to test local script on prod environment without any deployment.
More Details → Documentation • Demo Video
Override API Request Body / Payload
This rule helps in changing the request body/payload with static data or dynamic(programatic) payload based on the conditions like URL, Hostname or Path. Use source filters if you want conditions on Resource Type(like XHR, JS, CSS, Image etc) & Method(GET, POST etc). Some of the popular use cases are as follows:
- Test Edge cases during API testing by sending different types of data .. Read More
- Send additional data in an API to test different scenarios .. Read More
- Run negative test cases by sending invalid or large amount of data in a request body .. Read More
- Modify GraphQL: GraphQL queries can be modified and tested with Requestly .. Read More
GraphQL Support is available in Requestly, HTTP Rules can be used to debug GraphQL APIs.
More Details → Documentation
Override API Response Body
Modify API Response rule helps in modifying the response body of the requests with static or dynamic(programatic) payload. This rule also helps in changing the status code of the response, which comes in handy in various use cases. Few of them are listed below:
- Work on Front-end while back-end is still under development. Read more
- Test the application behaviour in different scenarios of returned data. Read more
- Simulate errors by returning different error codes. Read more
- Speed up the development by caching responses on local and reduce the response time of slow staging servers.
This feature helps in your Agile Development goals by making Front-end and back-end team independent. It also helps in Functional testing by allowing modification of status codes and dynamic responses to cover all the edge cases, which are difficult to replicate in real scenarios.
More Details → Documentation • Demo Video
Inject Scripts & Stylesheets
Using Insert Scripts Rule, you can make on-the-fly changes to a webpage content. It allows you to automate, scrape & change webpages behaviour without needed to access the page source code. Below are some of the popular use-cases:
- Inject popular libraries or hosted scripts or execute custom code-snippet before or after page load using a simple rule builder. Read more
- Create custom or personalized demos by injecting your JavaScripts & CSS’s in customer’s websites. Read more
- Test custom code on Prod website, without deploying. Read more
You can test third party widgets on your website using Inject Script Rule with just few clicks.
More Details → Documentation • Demo Video
Override GraphQL Query & Response
Modify API Response rule helps in testing GraphQL APIs by defining a matching condition based on URL, Host or Path along with GraphQL operation to override. If the graphQL queries matches the condition defined it will be served with the response configured in Requestly. The following are the popular use cases:
- Test query performance optimisation by reducing the time of query, application behaviour can be analysed. Read more
- Minimise query size by removing unnecessary fields and arguments and their impact on the application. Read more
- Modify queries to use fragments & aliases more effectively and observe the impact on overall performance. Read more
More Details → Documentation
Creating API Mocks
Mock Server helps in creating API mocks which are required in day to day development, it can be internal APIs which are still under development or an unreliable third party API. Mock APIs can be created easily by entering the path, method, status code, response header & response body. It can be used for following use cases –
- Develop frontend with mocked backend APIs, while BE APIs are in development parallel. Read more
- Test third party APIs integration using mock APIs without touching third party service. Read more
- Run CI/CD pipelines with mocks of third party APIs. Read more
- Test application behaviour in slow responses by adding latency to the responses. Read more
More Details → Documentation • Demo Video
Creating developer-friendly bug reports by Recording browser sessions
If you are testing a website or just surfing something online and found a bug in the interface like clicking a button not working, page not loading properly etc. SessionBook makes the reporting and debugging such issues such an easy process that bugs are reported and fixed in no time. It includes screen recording, network logs, console logs & environment details.
Following are some of the popular use-cases among Requestly users:
- QA teams configure sessionbooks to automatically record activities on the websites they are testing. They report bugs with sessions replay links as they stumble upon a bug. Read more
- Developers ask for recorded sessions when they are not able to reproduce a bug using the reproductions steps as in some cases bugs are specific to a given system or user. Read more
Teams have observed 90% reduction in bugs resolution time after using Sessionbook for bug reporting.
More Details → Documentation • Demo Video
API Client (Send API Requests like Postman)
API Client helps you to easily test your API responses by hitting the API endpoints directly from Requestly without relying on your browser or client app. To hit an API endpoint and see the response, you need to specify the URL and other request attributes like method, query parameters, body and headers. Following are some use-cases –
More Details → Documentation
Requestly APIs - Creating HTTP Rules via API
The Requestly API endpoints let you integrate Requestly into your CI/CD Pipelines. It allows you to create and work with your rules.
- You can add, update, delete, and read rules with the API.
- Programmatically access data stored in your Requestly account
- Integrate Requestly with your CI/CD workflow.
- Easily test changes related to a PR without needing a staging environment Automatically create staging JS bundles on PR creation followed by creating a Requestly Rule programmatically using Requestly API in a team workspace. The user can then name the rule depending on their PR name.
- Streamline developer and QA testing flows & if coupled with sessions recording your whole SDLC is optimised.
More Details → Documentation
Collaboration (Team Workspaces / SharedLists)
Shared Workspace allows you to collaborate with your team and work together in real-time on your rules. Workspaces can be helpful in multiple ways following are some of the important areas where they come handy –
- Teams can collaborate on same set of rules in real-time, ensuring everyone is on the same page.
- Mock APIs are shared across team members reducing the time consuming export-imports and syncing.
- Access to Session recordings are available to team members only eliminating the security risk of sharing outside.
Workspaces comes with its own User Roles, providing 360 degree control over the workspaces.
More Details → Documentation • Demo Video
Contents​
- Setup Redirects (URL Rewrite | Map Remote | Map Local)
- Swap HostNames (Replace Rule)
- Modify Request & Response Headers
- Override API Request Body / Payload
- Override API Response Body
- Inject Scripts & Stylesheets
- Override GraphQL Query & Response
- Creating API Mocks
- Creating developer-friendly bug reports by Recording browser sessions
- API Client (Send API Requests like Postman)
- Requestly APIs - Creating HTTP Rules via API
- Collaboration (Team Workspaces / SharedLists)