Capturing Screen Snippets of DOM elements

Overview

Using OpenFin, you can capture a Screen Snippet of individual DOM element as base64 encoded strings.  This is achieved by using a combination of using the JavaScript standard API method getBoundingClientRect() and and OpenFin API method getSnapshot.

Prerequisites

• Runtime v9.61.36.46 or newer

Example

The OpenFin API method, Window.getSnapshot(), takes an optional area parameter, which when provided will return base64 encoded string data of the image contained within the area.  The following code example uses getBoundingClientRect() to obtain the Area information of a DOM element, which is then passed to Window.getSnapshot():

function getElementScreenshot(finWindow, id){
  rect = document.getElementById(id).getBoundingClientRect();
  const area = {
   height: rect.height,
   width: rect.width,
   x: rect.x,
   y: rect.y
  };
 finWindow.getSnapshot(area, console.log, console.error);
}