Appearance
Overview
💡 Disclaimer
This API is still in development and is not yet available for public sign-up. If you are interested in using this API, please reach out to us at hello@launchbrightly.com for further info.
Debugging
There might be situation where your screenshots are failing and the error messages returned by the API are not enough.
The screenshot API allows you to visually debug at different steps by capturing snapshots of the page.
Enabling Debugging
Set the stepImages
attribute to either onError
or all
to enable capturing snapshots.
Value | Description |
---|---|
onError | Capture snapshots only when screenshot capture fails. |
all | Capture snapshots regardless if screenshot capture is successful or fails. |
When the stepImages
is not explicitly specified, no snapshots are captured.
Example 1 : Capturing snapshots when a step fails
Request:
POST /screenshot
json
{
"stepImages": "all",
"elementSelector": [
"body"
],
"steps": [
{
"type": "navigate",
"url": "https://example.org"
},
{
"selectors": [
"#fake"
],
"timeout": 10000,
"type": "waitForElement"
}
]
}
Response:
json
{
"id": "b79f639c-fcd7-4b4d-8326-7496efb310b3",
"status": "failed",
"message": "The following selector(s) associated with step 'waitForElement' were either not found or timed out: #fake",
"createdAt": "2024-07-03T19:17:52.660Z",
"updatedAt": "2024-07-03T19:18:11.599Z",
"filesize": {
"raw": null,
"styled": null
},
"url": {
"raw": null,
"styled": null
},
"snapshots": {
"steps": [
{
"description": "navigate",
"type": "navigate",
"data": "https://launchbrightlyf9ff5e67329842e1a3a8fc00d5a7569c145137-prod.s3.us-east-1.amazonaws.com/debug/2024-07-03/b74c93c172803c11cf60f8d4492569e1db06af5497e231d5d7a44ed0447ea788_navigate.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIASH5PNXSCN5O7E7U2%2F20240703%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20240703T191813Z&X-Amz-Expires=86400&X-Amz-Signature=0203572c26614639fd6ccd00375cbda25ef2125cf8b31c5a4af0d9d868d88224&X-Amz-SignedHeaders=host&x-id=GetObject",
"url": "https://example.org/"
},
{
"description": "waitForElement",
"type": "waitForElement",
"selectors": [
"#fake"
],
"data": "https://launchbrightlyf9ff5e67329842e1a3a8fc00d5a7569c145137-prod.s3.us-east-1.amazonaws.com/debug/2024-07-03/b74c93c172803c11cf60f8d4492569e1db06af5497e231d5d7a44ed0447ea788_waitForElement.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIASH5PNXSCN5O7E7U2%2F20240703%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20240703T191813Z&X-Amz-Expires=86400&X-Amz-Signature=2dd11bd985f14e070ec2ea64659a13ddb50b616d6419b128f76c93393335fa5f&X-Amz-SignedHeaders=host&x-id=GetObject",
"message": "The following selector(s) associated with step 'waitForElement' were either not found or timed out: #fake",
"url": "https://example.org/"
}
]
}
}
Example 2 : Capturing snapshots when an annotation fails
Request:
POST /screenshot
json
{
"stepImages": "onError",
"deviceScaleFactor": 1,
"elementSelector": [
"body"
],
"steps": [
{
"type": "navigate",
"url": "https://example.org"
},
{
"value": 3000,
"type": "waitFor"
}
],
"annotate": [
{
"type": "modifyText",
"selectors": [
".fake",
"xpath/html/body/div/fake"
],
"value": "Hello World!!"
}
]
}
Response:
json
{
"id": "3cb78689-d421-49fd-81d8-990bc8d5ac6a",
"status": "failed",
"message": "The following selector(s) associated with the annotate type 'modifyText' were either not found or timed out: .fake,xpath/html/body/div/fake",
"createdAt": "2024-07-03T19:20:21.002Z",
"updatedAt": "2024-07-03T19:20:26.302Z",
"filesize": {
"raw": null,
"styled": null
},
"url": {
"raw": null,
"styled": null
},
"snapshots": {
"steps": [
{
"description": "navigate",
"type": "navigate",
"data": "https://screenshot-prod.s3.us-east-1.amazonaws.com/debug/image1.png",
"url": "https://example.org/"
},
{
"description": "waitForExpression",
"type": "waitFor",
"data": "https://screenshot-prod.s3.us-east-1.amazonaws.com/debug/image2.png",
"url": "https://example.org/"
}
],
"annotate": [
{
"description": "modifyText",
"type": "modifyText",
"selectors": [
".fake",
"xpath/html/body/div/fake"
],
"data": "https://screenshot-prod.s3.us-east-1.amazonaws.com/debug/2024-07-03/cf696.png",
"message": "The following selector(s) associated with the annotate type 'modifyText' were either not found or timed out: .fake,xpath/html/body/div/fake",
"url": "https://example.org/"
}
]
}
}