Feat: screenshot apis

[abose]

based on native platform api: phcode-dev/phoenix-desktop#685

📸 Screenshot Utilities

The Screenshot Utilities provide flexible APIs to capture screenshots of the current page or a specific region and return them in different formats for performance and convenience.

All methods accept the same capture target:

• Rect object: { x, y, width, height }
• DOM element (its bounding box is captured)
• Selector string (must resolve to exactly one element)
• Omitted to capture the full page

---

screenShotBinary(rectOrNodeOrSelector)

Captures a screenshot and returns raw PNG bytes.

Parameters

Name	Type	Description
rectOrNodeOrSelector	Object | HTMLElement | string (optional)	Area to capture (rect, DOM element, selector, or full page)

Returns

Promise<Uint8Array> — PNG image bytes

Examples

Capture a specific rectangle

const bytes = await screenShotBinary({
  x: 100,
  y: 100,
  width: 400,
  height: 300
});

Capture a DOM element

const element = document.getElementById("preview");
const bytes = await screenShotBinary(element);

---

screenShotToBlob(rectOrNodeOrSelector)

Captures a screenshot and returns a PNG Blob.

Parameters

Name	Type	Description
rectOrNodeOrSelector	Object | HTMLElement | string (optional)	Area to capture

Returns

Promise<Blob> — PNG Blob (image/png)

Examples

Display in an image element

const blob = await screenShotToBlob("#preview");

const url = URL.createObjectURL(blob);
document.getElementById("imgOutput").src = url;

Draw to a canvas

const blob = await screenShotToBlob();
const bitmap = await createImageBitmap(blob);
ctx.drawImage(bitmap, 0, 0);

---

screenShotToPNGFile(filePathToSave, rectOrNodeOrSelector)

Captures a screenshot and saves it directly as a PNG file.

Parameters

Name	Type	Description
filePathToSave	string	VFS path to write the PNG file to
rectOrNodeOrSelector	Object | HTMLElement | string (optional)	Area to capture

Returns

Promise<void>

Throws

• Error if filePathToSave is not a non-empty string

Examples

Save the full page

await screenShotToPNGFile("/project/output/screenshot.png"); // any VFS path. use /tauri if you neeed native paths

Save a specific element

await screenShotToPNGFile(
  "/project/output/preview.png",
  "#preview"
);

---

⚡ Performance Notes

Use Case	Recommended API
IPC / processing	screenShotBinary
UI rendering	screenShotToBlob
Exporting files	screenShotToPNGFile

• No base64 encoding is used
• Blob conversion is zero-copy
• Optimized for repeated captures (live preview workflows)

[sonarqubecloud]

Quality Gate passed

Issues
13 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud