Add clip parameter for viewport cropping
Some checks failed
Build & Deploy to Staging / Build & Deploy to Staging (push) Has been cancelled

- Add clip object parameter to crop rectangular areas from screenshots
- Support POST body: clip {x, y, width, height} number fields
- Support GET query: clipX, clipY, clipW, clipH params
- Validation: all fields required, x/y >=0, width/height >0, max 3840x2160
- Mutually exclusive with fullPage and selector
- Update OpenAPI docs with clip examples
- Update Node.js and Python SDK READMEs with clip usage
- Add comprehensive test coverage (11 new tests)
- Tests: missing fields, negative coords, zero dimensions, max limits, mutual exclusivity
This commit is contained in:
SnapAPI Developer 2026-03-05 15:13:12 +01:00
parent 9290c759da
commit 3e9336ae67
4 changed files with 109 additions and 0 deletions

View file

@ -163,6 +163,28 @@ const complexCapture = await snap.capture({
});
```
### Crop Specific Areas (Clip)
```typescript
// Crop a specific rectangular area from the screenshot
const croppedScreenshot = await snap.capture({
url: 'https://example.com',
clip: {
x: 100, // X coordinate (pixels from left)
y: 50, // Y coordinate (pixels from top)
width: 800, // Width of the crop area
height: 600, // Height of the crop area
},
});
// Useful for capturing specific UI elements or sections
const headerScreenshot = await snap.capture({
url: 'https://example.com',
clip: { x: 0, y: 0, width: 1280, height: 120 }, // Top banner only
format: 'png',
});
```
## API Reference
### `new SnapAPI(apiKey, config?)`
@ -192,6 +214,7 @@ Returns a `Promise<Buffer>` containing the screenshot image.
| `darkMode` | `boolean` | `false` | Emulate prefers-color-scheme: dark |
| `hideSelectors` | `string \| string[]` | — | CSS selectors to hide before capture |
| `css` | `string` | — | Custom CSS to inject before capture (max 5000 chars) |
| `clip` | `object` | — | Crop rectangle: `{x, y, width, height}` (mutually exclusive with fullPage/selector) |
### `snap.health()`

View file

@ -167,6 +167,28 @@ complex_capture = snap.capture(
)
```
### Crop Specific Areas (Clip)
```python
# Crop a specific rectangular area from the screenshot
cropped_screenshot = snap.capture(
"https://example.com",
clip={
"x": 100, # X coordinate (pixels from left)
"y": 50, # Y coordinate (pixels from top)
"width": 800, # Width of the crop area
"height": 600, # Height of the crop area
},
)
# Useful for capturing specific UI elements or sections
header_screenshot = snap.capture(
"https://example.com",
clip={"x": 0, "y": 0, "width": 1280, "height": 120}, # Top banner only
format="png",
)
```
### Error Handling
```python
@ -201,6 +223,7 @@ except SnapAPIError as e:
| `dark_mode` | `bool` | `False` | Emulate prefers-color-scheme: dark |
| `hide_selectors` | `list` | — | CSS selectors to hide before capture |
| `css` | `str` | — | Custom CSS to inject before capture (max 5000 chars) |
| `clip` | `dict` | — | Crop rectangle: `{"x": int, "y": int, "width": int, "height": int}` (mutually exclusive with full_page/selector) |
### `snap.health() -> dict`