Parrot API mocking

Hassle-free mocking of xhr and fetch calls.

什么是Parrot API mocking?

Parrot API mocking是由Ruud Landman开发的Chrome扩展程序,该扩展的主要功能是“Hassle-free mocking of xhr and fetch calls.”。

扩展截图

screenshot
screenshot
screenshot
screenshot
screenshot

下载Parrot API mocking扩展crx文件

下载Parrot API mocking扩展crx格式的文件,手动将Chrome插件安装到浏览器中,也可以将crx文件分享给朋友,轻松安装Chrome插件。

扩展使用说明

                        Mocking your API responses like a pro. Parrot allows you to mock any asynchronous API call you want. It does this by patching both Fetch and XMLHttpRequest in such way that the actual call will always be done, but the response will be substituted by the mock data you specified.

💡 When to use this extension?

🔸 You are developing a front end that needs to connect to some back end API, but that back end API has not yet been developed or is down.

🔸 You want to give a live demo but the back end API needed is currently not available or broken.

🔸 You would not only like to test the happy flow, but would also like to see how your front end behaves given any possible alternate scenario or edge case.

🔸 You are experiencing a nasty bug but have no way of reproducing it easily using the real back end system. You would like to tweak the response to check if any unexpected response could be the cause of your issue.

💡 How to use this extension?

Start by just pressing the Add button to define a mocked response for a specific request. A line will show up on which you can define the HTTP verb/method and the URL-fragment of the request you would like to be mocked. The URL fragment is defined with a regular expression, allowing you to make any matching requirement as loose or strict as you would like it to be.

NB
In cases where the request also has a payload (like POST), the content of that payload can be used for determining if mocking should take place. 

On that same line you can then define the status code of your response, the exact response type and the payload to be returned. 

Once the extension detects the method/URL you expressed, the regular call will still be done. However, once the actual response has been received, no matter it's actual result, it will be replaced by the mocked response you defined.

NB
Next to being JSON, for any response also SCRIPTcan be specified. In this case plain JavaScript statements can be defined with which the original response can be modified (you can just reference the contextual variable "response").Parrot will wrap your Javascript in a function that receives the response and returns the response after modification.

Example (note that no function or return statement is needed):

   response.someProperty = 'someValue';
   response.someArray.push('blabla');

💡 Multiple mock rules

When determining the mock data to be substituted, there can be multiple rules matching the given URL and method. In this case, Parrot will just use the last available mock rule in top-down order.

💡 Timing your calls by adding a delay

Particularly for checking for, or debugging of, potential race condition issues, for any request a delay (expressed in milliseconds) can be specified. This delay will be taken into account before the response is returned to the client that made the request. By carefully timing request/response cycles you can make sure that responses will be received in the exact order you would like them to be.

💡 Export and Import your mock rules

The set of mock rules can also be exported to the file system using the Export button. This allows you to share your mock data with others and also allows you to create/maintain sets of mock rules. Exported files can easily be reimported by using the Import button. Imported files will be appended to any currently existing mock rules in the extension, allowing you to stack multiple sets on top of each other.

💡 Notification when mock data has been used

Every time mock data has been substituted, a small notification will show up. This behavior can be turned off using the popup dialog. The notification will show the path that's being mocked, the number of mock rules applied on it's response and, if applicable, the delay that was taken into account.

💡 Network viewer

Parrot will show all asynchronous calls in a compact view directly attached to your content page. This network view offers you the possibility to show and mock any response with the click of one single button. The overview also directly shows which responses were mocked and which responses were original. In case of a mocked response, opening the mock dialog will show you the response that resulted after applying all involved mock rules.

💡 Localhost

Localhost resources will not be mocked by Parrot.                    

扩展基本信息

名称 Parrot API mocking Parrot API mocking
ID ccakibballjagidfebldkmghgndangdk
官方URL https://chromewebstore.google.com/detail/parrot-api-mocking/ccakibballjagidfebldkmghgndangdk
简介 Hassle-free mocking of xhr and fetch calls.
文件大小 3.67 MB
安装次数 248
当前版本 8.2.2
更新时间 2024-03-01
上架时间 2020-12-26
评分 5.00/5 共4次评分
开发者 Ruud Landman
电子邮箱 [email protected]
付费类型 free
支持的语言 en-US
manifest.json
{
    "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
    "manifest_version": 3,
    "name": "Parrot API mocking",
    "description": "Hassle-free mocking of xhr and fetch calls.",
    "version": "8.2.2",
    "author": "Ruud Landman",
    "background": {
        "service_worker": "background\/js\/background.js"
    },
    "options_ui": {
        "page": "options\/options.html",
        "open_in_tab": true
    },
    "action": {
        "default_icon": "images\/parrot.png",
        "default_popup": "popup\/popup.html"
    },
    "web_accessible_resources": [
        {
            "resources": [
                "images\/parrot.png"
            ],
            "matches": [
                "http:\/\/*\/*",
                "https:\/\/*\/*"
            ]
        }
    ],
    "content_scripts": [
        {
            "matches": [
                "http:\/\/*\/*",
                "https:\/\/*\/*"
            ],
            "run_at": "document_start",
            "js": [
                "generic\/js\/alert.js",
                "content\/js\/content-start.js"
            ],
            "css": [
                "generic\/css\/css-variables.css",
                "generic\/css\/alert.css"
            ]
        },
        {
            "matches": [
                "http:\/\/*\/*",
                "https:\/\/*\/*"
            ],
            "run_at": "document_end",
            "js": [
                "content\/js\/webcomponents-bundle.js",
                "content\/js\/mock-data-dialog.js",
                "content\/js\/network-viewer.js",
                "content\/js\/content-end.js"
            ],
            "css": [
                "generic\/css\/css-variables.css",
                "generic\/css\/alert.css"
            ]
        }
    ],
    "icons": {
        "128": "images\/parrot.png"
    },
    "host_permissions": [
        ""
    ],
    "permissions": [
        "storage",
        "scripting"
    ]
}