CaptureScreenshot Method

In This Topic

Description

Captures the screenshot of an HTML element. Requires Settings.remote_debugging_port to be set.

Syntax

Visual Basic
Public Function CaptureScreenshot( _ ByVal Selector As String, _ Optional ByVal Destination As String = "base64", _ Optional ByVal Scale As Single = 1 _ ) As String

Visual Basic

Public Function CaptureScreenshot( _
   ByVal Selector As String, _
   Optional ByVal Destination As String = "base64", _
   Optional ByVal Scale As Single = 1 _
) As String

Parameters

Selector

The CSS3 selector of the element to capture its screenshot.

If you are unfamiliar with CSS3 Selectors have a look in Finding the correct CSS3 Selector article.

Destination

This can be one of the following:

base64 return screenshot as Base-64 URL encoded PNG bytes (data:image/png;base64,)
base64+clipboard copy Base-64 URL encoded PNG bytes to clipboard (data:image/png;base64,)
clipboard copy PNG image to clipboard
Filename save image as .PNG or .JPEG or .BMP file

Scale

The scale of the captured image.

Normally this should be 1 but for high-dpi images you can use any number between 1 and 5.

For thumbnails you can use decimal number between 0.1 and 1.

Return Type

When Destination is base64 the return value is Base-64 URL encoded PNG bytes string. For the other destinations there is no return value.

Remarks

This method attempts to calculate the bounding rectangle of the element, scrolls the window to (0,0) and uses DevTools Page.captureScreenshot command to capture the screenshot. Then the page is scroll offset is restored. As a result of this sequence of actions you will experience a slight screen flickering, which is absolutely normal given the circumstances.

You can even use this method to capture a screenshot of the entire BODY element, which works quite well. However, the memory requirements for such PNG image are considerable and for vast pages this could lead to memory allocation related crashes during the return of the bytes. Please use caution and monitor memory usage.

You must set Settings.remote_debugging_port to enable the DevTools Inspector Protocol, which is not a good idea for production code due to security concerns, so please consider this feature as a testing or documentation aid and not as a production feature.

Example

Example (Visual Basic)

Private Sub ElementScreenshot(ByVal Selector As String)

    ' Copy Element Screenshot to Clipbaord as Bitmap
    WebKitX1.CaptureScreenshot Selector, "clipboard", 2
    
    ' Copy Element Screenshot to Clipbaord and Base64 encoded PNG24 URL
    WebKitX1.CaptureScreenshot Selector,  "base64+clipboard", 1
    
    ' Return Element Screenshot as Base64 encoded PNG24 URL String
    Debug.Print WebKitX1.CaptureScreenshot(Selector, "base64", 1)
    
    ' Save Element Screenshot as PNG file
    WebKitX1.CaptureScreenshot Selector, App.Path + "\element.png", 1

End Sub