LeanMock - API Response Mocker

A Chrome extension for mocking REST and GraphQL API responses. Perfect for testing error handling, edge cases, and UI behavior without modifying your backend.

Features

• 🔄 Mock Status Codes - Change any API response status (200 → 400, 500, etc.)
• 🎯 URL Pattern Matching - Use wildcards (*) or regex patterns
• 📊 GraphQL Support - Filter by operation name
• ⏱️ Response Delays - Simulate slow network conditions
• 📝 Custom Response Bodies - Return custom JSON responses
• 🔌 Easy Toggle - Enable/disable mocking globally or per-rule

Installation

From Source (Developer Mode)

1. Clone or download this repository
2. Open Chrome and navigate to chrome://extensions/
3. Enable Developer mode (toggle in top-right corner)
4. Click Load unpacked
5. Select the LeanMock folder
6. The extension icon should appear in your toolbar

Usage

Creating a Mock Rule

1. Click the LeanMock extension icon in your toolbar
2. Click the + button to add a new rule
3. Fill in the rule details:

Field	Description
Rule Name	A descriptive name for your rule
URL Pattern	The URL pattern to match (supports wildcards and regex)
Method	HTTP method to match (GET, POST, PUT, etc.) or ANY
GraphQL Operation	(Optional) Match specific GraphQL operations
Mock Status	The status code to return
Delay	(Optional) Add response delay in milliseconds

4. Click Save Rule

URL Pattern Examples

Pattern	Matches
*/api/users*	Any URL containing /api/users
*/api/v1/login	Any URL ending with /api/v1/login
/.*\/graphql$/	Regex: URLs ending with /graphql
example.com	Any URL containing example.com

GraphQL Mocking

For GraphQL APIs, you can:

1. Set the URL pattern to match your GraphQL endpoint (e.g., */graphql)
2. Specify the GraphQL Operation name to mock specific queries/mutations

Example: Mock only the GetUser query while allowing other operations to pass through.

Example Mock Rules

Mock Login Error

• URL Pattern: */api/auth/login
• Method: POST
• Status: 401 Unauthorized

Mock Server Error

• URL Pattern: */api/*
• Method: ANY
• Status: 500 Internal Server Error

Mock Slow Response

• URL Pattern: */api/search*
• Method: GET
• Status: 200 OK
• Delay: 3000ms

Mock GraphQL Mutation Error

• URL Pattern: */graphql
• Method: POST
• GraphQL Operation: CreatePost
• Status: 400 Bad Request

How It Works

LeanMock intercepts fetch() and XMLHttpRequest calls in the browser. When a request matches one of your rules:

1. The original request may or may not be sent (depending on configuration)
2. The response is modified to return your specified status code
3. Optional custom response body is returned
4. Console logs show intercepted requests: [LeanMock] Intercepted GET /api/users → Status: 404

Development

The extension consists of:

• manifest.json - Extension configuration
• background.js - Service worker for state management
• content.js - Injects interceptor into pages
• interceptor.js - Actual fetch/XHR interception logic
• popup.html/js/css - Extension popup UI