Mock Editor

The Mock Editor is where you define exactly how Mock Studio should respond to intercepted requests.

Request Configuration

The top section configures which requests to intercept:

HTTP Method

Select the HTTP method to match: GET, POST, PUT, DELETE, PATCH, or OPTIONS.

URL Pattern

Define the URL to intercept. Choose a matching strategy:

• Equal — Exact URL match (e.g., /api/users/123)
• Contains — Matches if the URL contains the pattern (e.g., /users)
• Regex — Full regular expression matching (e.g., ^/api/users/\d+$)

Mock Name

Give your mock a descriptive name (3-50 characters) for easy identification.

Folder Assignment

Assign the mock to a folder for organization. You can also create new folders directly from the editor.

Response Configuration

The editor has four tabs for configuring the response:

Body Tab

The main editor powered by Monaco (the same editor behind VS Code):

• Full JSON syntax highlighting and validation
• Auto-formatting and code folding
• Diff highlighting when editing variants (green highlights show changes from the default)

Headers Tab

Configure custom response headers as key-value pairs. Default: Content-Type: application/json.

Rules Tab

Define advanced matching rules for conditional responses.

Delay Tab

Add artificial delay (in milliseconds) to simulate real-world latency.

Variants

Variants let you define multiple response alternatives for the same mock:

1. The Default variant is always present
2. Click "+" to add a new variant
3. Each variant has its own response body, status code, and headers
4. Switch between variants by clicking on them
5. The active variant is what Mock Studio returns for matching requests
6. Double-click a variant name to rename it

Diff View: When editing a variant, the editor highlights differences from the Default response in green — making it easy to see what changed.

Use Cases for Variants

• Test success vs error responses (200 vs 404 vs 500)
• Simulate different data states (empty list, single item, paginated)
• Toggle between user roles (admin vs regular user)

cURL Integration

Import from cURL

1. Click the ⋮ menu → Import cURL
2. Paste a cURL command
3. Mock Studio extracts the method, URL, headers, and body

Copy as cURL

1. Click the ⋮ menu → Copy cURL
2. The mock's method and URL are exported as a cURL command

AI Generation

Generate realistic mock data using AI:

1. Click the AI button (sparkle icon) in the editor
2. Describe what data you want in natural language
3. Mock Studio generates JSON data matching your description
4. The generated data replaces the current response body

Examples:

• "Generate a list of 10 users with name, email, and avatar"
• "Create a paginated response with 3 products and metadata"
• "Add error details for a 422 validation error"

See AI-Powered Mocking for setup and configuration.