Class: View

View

A View can be used to embed additional web content into a Window. It is like a child window, except it is positioned relative to its owning window. It has the ability to listen for View-specific events.

By default, a View will try to share the same renderer process as other Views owned by its parent Application. To change that behavior, see the processAffinity view option.

A View's lifecycle is tied to its owning window and can be re-attached to a different window at any point during its lifecycle.

Methods

(async, static) create(options) → {Promise.<View>}

EXPERIMENTAL

Creates a new View.

Parameters:
Name Type Description
options View~options

View creation options
Tutorials:
Returns:
Type
Promise.<View>

(static) getCurrent() → {Promise.<View>}

EXPERIMENTAL

Asynchronously returns a View object that represents the current view

Tutorials:
Returns:
Type
Promise.<View>

(static) getCurrentSync() → {View}

EXPERIMENTAL

Synchronously returns a View object that represents the current view

Tutorials:
Returns:
Type
View

(async, static) wrap(identity) → {Promise.<View>}

EXPERIMENTAL

Asynchronously returns a View object that represents an existing view.

Parameters:
Name Type Description
identity Identity
Tutorials:
Returns:
Type
Promise.<View>

(static) wrapSync(identity) → {View}

EXPERIMENTAL

Synchronously returns a View object that represents an existing view.

Parameters:
Name Type Description
identity Identity
Tutorials:
Returns:
Type
View

attach(target) → {Promise.<void>}

EXPERIMENTAL

Attaches the current view to a the given window identity. Identity must be the identity of a window in the same application. This detaches the view from its current window, and sets the view to be destroyed when its new window closes.

Parameters:
Name Type Description
target Identity
Tutorials:
Returns:
Type
Promise.<void>

bindToElement(element) → {function}

EXPERIMENTAL

NOTE: Internal use only. Attaches this view to an HTML element in the current context. The view will resize responsively when the element bounds change.

Known issue: View.bindToElement does not track position changes, if the element has fixed px width and height values it is possible for the view to not update responsively.

Known issue: When View.bindToElement is used on a element that takes up the entire page in a platform window, the bound view will not respond responsively when the window is resized to be smaller.

Parameters:
Name Type Description
element HTMLElement

HTML element to attach the view to.
Tutorials:
Returns:
  • Cleanup function that will disconnect the element resize observer.
Type
function

capturePage(optionsopt) → {Promise.<string>}

Gets a base64 encoded image of the view or a part of it.

Parameters:
Name Type Attributes Description
options CapturePageOptions <optional>

Options for the capturePage call.
Tutorials:
Returns:
Type
Promise.<string>

destroy() → {Promise.<void>}

EXPERIMENTAL

Destroys the current view

Tutorials:
Returns:
Type
Promise.<void>

executeJavaScript(code) → {Promise.<void>}

Executes Javascript on the view, restricted to contents you own or contents owned by applications you have created.

Parameters:
Name Type Description
code string

JavaScript code to be executed on the view.
Tutorials:
Returns:
Type
Promise.<void>

findInPage(searchTerm, options) → {Promise.<number>}

Find and highlight text on a page.

Parameters:
Name Type Description
searchTerm string

Term to find in page
options FindInPageOptions

Search options
Tutorials:
Returns:
Type
Promise.<number>

focus() → {Promise.<void>}

EXPERIMENTAL

Focuses the view

Tutorials:
Fires:
  • event:focused
Returns:
Type
Promise.<void>

getBounds() → {Promise.<ViewBounds>}

EXPERIMENTAL

Gets the bounds (top, left, width, height) of the view relative to its window.

Tutorials:
Returns:
Type
Promise.<ViewBounds>

getCurrentStack() → {Promise.<TabStack>}

Retrieves the current TabStack of the view if it belongs to one.

Throws:

if this view does not belong to a TabStack or if the window has been destroyed.

Returns:

The TabStack this view belongs to.

Type
Promise.<TabStack>

getCurrentWindow() → {Promise.<_Window>}

EXPERIMENTAL

Retrieves the window the view is currently attached to.

Returns:
Type
Promise.<_Window>

getInfo() → {Promise.<ViewInfo>}

EXPERIMENTAL

Gets the View's info.

Tutorials:
Returns:
Type
Promise.<ViewInfo>

getOptions() → {Promise.<ViewOptions>}

EXPERIMENTAL

Gets the View's options.

Tutorials:
Returns:
Type
Promise.<ViewOptions>

getParentLayout() → {Promise.<Layout>}

EXPERIMENTAL

Retrieves the layout for the window the view is attached to.

Tutorials:
Returns:
Type
Promise.<Layout>

getPrinters() → {Promise.Array.<PrinterInfo>}

Returns an array with all system printers

Deprecated:
  • use System.getPrinters instead
Tutorials:
Returns:
Type
Promise.Array.<PrinterInfo>

getProcessInfo() → {Promise.<EntityProcessDetails>}

Retrieves the process information associated with a view.

Tutorials:
Returns:
Type
Promise.<EntityProcessDetails>

getSharedWorkers() → {Promise.Array.<SharedWorkerInfo>}

Retrieves information on all Shared Workers.

Tutorials:
Returns:
Type
Promise.Array.<SharedWorkerInfo>

getZoomLevel() → {Promise.<number>}

Returns the zoom level of the view.

Tutorials:
Returns:
Type
Promise.<number>

hide() → {Promise.<void>}

EXPERIMENTAL

Hides the current view if it is currently visible.

Tutorials:
Returns:
Type
Promise.<void>

inspectServiceWorker() → {Promise.<void>}

Opens the developer tools for the service worker context.

Tutorials:
Returns:
Type
Promise.<void>

inspectSharedWorker() → {Promise.<void>}

Opens the developer tools for the shared worker context.

Tutorials:
Returns:
Type
Promise.<void>

inspectSharedWorkerById(workerId) → {Promise.<void>}

Inspects the shared worker based on its ID.

Parameters:
Name Type Description
workerId string

The id of the shared worker.
Tutorials:
Returns:
Type
Promise.<void>
EXPERIMENTAL

Navigates the view to a specified URL. The url must contain the protocol prefix such as http:// or https://.

Parameters:
Name Type Description
url string

The URL to navigate the view to.
Tutorials:
Returns:
Type
Promise.<void>

Navigates the view back one page.

Tutorials:
Returns:
Type
Promise.<void>

Navigates the view forward one page.

Tutorials:
Returns:
Type
Promise.<void>

print(optionsopt) → {Promise.<void>}

Prints the view's web page

Parameters:
Name Type Attributes Description
options PrintOptions <optional>

Printer Options
Tutorials:
Returns:
Type
Promise.<void>

reload() → {Promise.<void>}

Reloads the view current page

Tutorials:
Returns:
Type
Promise.<void>

setBounds(bounds) → {Promise.<void>}

EXPERIMENTAL

Sets the bounds (top, left, width, height) of the view relative to its window.

Parameters:
Name Type Description
bounds ViewBounds
Tutorials:
Returns:
Type
Promise.<void>

setZoomLevel(level) → {Promise.<void>}

Sets the zoom level of the view.

Parameters:
Name Type Description
level number

The zoom level
Tutorials:
Returns:
Type
Promise.<void>

show() → {Promise.<void>}

EXPERIMENTAL

Shows the current view if it is currently hidden.

Tutorials:
Returns:
Type
Promise.<void>

showDeveloperTools() → {Promise.<void>}

Shows the Chromium Developer Tools

Tutorials:
Returns:
Type
Promise.<void>

showPopupWindow(options) → {Promise.<PopupResult>}

Shows a popup window. If the window this view is currently attached to has a popup open, closes it.

Parameters:
Name Type Description
options PopupOptions
Tutorials:
Returns:
Type
Promise.<PopupResult>

stopFindInPage(action) → {Promise.<void>}

Stops any findInPage call with the provided action.

Parameters:
Name Type Description
action string

Action to execute when stopping a find in page:
"clearSelection" - Clear the selection.
"keepSelection" - Translate the selection into a normal selection.
"activateSelection" - Focus and click the selection node.
Tutorials:
Returns:
Type
Promise.<void>

stopNavigation() → {Promise.<void>}

Stops any current navigation the view is performing.

Tutorials:
Returns:
Type
Promise.<void>

triggerBeforeUnload() → {Promise.<boolean>}

EXPERIMENTAL

Triggers the before-unload handler for the View, if one is set. Returns true if the handler is trying to prevent the View from unloading, and false if it isn't. Only enabled when setting enableBeforeUnload: true in your View options. If this option is not enabled it will always return false.

Tutorials:
Returns:
Type
Promise.<boolean>

updateOptions(options) → {Promise.<void>}

EXPERIMENTAL

Updates the view's options.

Parameters:
Name Type Description
options Partial.<ViewOptions>
Tutorials:
Returns:
Type
Promise.<void>

Type Definitions

options

View creation options.

This is the options object required by View.create.

Note that name and target are the only required properties — albeit the url property is usually provided as well (defaults to "about:blank" when omitted).

Type:
  • object
Properties:
Name Type Attributes Default Description
experimental object <optional>

Configurations for API injection.

Properties
Name Type Attributes Description
childWindows boolean <optional>

Configure if the runtime should enable child windows for views.
accelerator object <optional>

Enable keyboard shortcuts for devtools, zoom, reload, and reload ignoring cache.

Properties
Name Type Attributes Default Description
devtools boolean <optional>
 false

If true, enables the devtools keyboard shortcut:
Ctrl + Shift + I (Toggles Devtools)
reload boolean <optional>
 false

If true, enables the reload keyboard shortcuts:
Ctrl + R (Windows)
F5 (Windows)
Command + R (Mac)
reloadIgnoringCache boolean <optional>
 false

If true, enables the reload-from-source keyboard shortcuts:
Ctrl + Shift + R (Windows)
Shift + F5 (Windows)
Command + Shift + R (Mac)
zoom boolean <optional>
 false

If true, enables the zoom keyboard shortcuts:
Ctrl + + (Zoom In)
Ctrl + Shift + + (Zoom In)
Ctrl + NumPad+ (Zoom In)
Ctrl + - (Zoom Out)
Ctrl + Shift + - (Zoom Out)
Ctrl + NumPad- (Zoom Out)
Ctrl + Scroll (Zoom In & Out)
Ctrl + 0 (Restore to 100%)
api object <optional>

Configurations for API injection.

Properties
Name Type Attributes Description
iframe object <optional>

Configure if the the API should be injected into iframes based on domain.

Properties
Name Type Attributes Default Description
crossOriginInjection boolean <optional>
 false

Controls if the fin API object is present for cross origin iframes.
sameOriginInjection boolean <optional>
 true

Controls if the fin API object is present for same origin iframes.
autoplayPolicy string <optional>
 "no-user-gesture-required"

Autoplay policy to apply to content in the window, can be no-user-gesture-required, user-gesture-required, document-user-activation-required. Defaults to no-user-gesture-required.
autoResize object <optional>

AutoResize options
bounds object <optional>

initial bounds given relative to the window.
backgroundColor string <optional>
 "#FFF"

Updatable. The view’s backfill color as a hexadecimal value. Not to be confused with the content background color (document.body.style.backgroundColor), this color briefly fills a view’s (a) content area before its content is loaded as well as (b) newly exposed areas when growing a window. Setting this value to the anticipated content background color can help improve user experience. Default is white.
contentNavigation object <optional>

Restrict navigation to URLs that match a whitelisted pattern. In the lack of a whitelist, navigation to URLs that match a blacklisted pattern would be prohibited. See here for more details.

Properties
Name Type Attributes Default Description
whitelist Array.<string> <optional>
 []

List of whitelisted URLs.
blacklist Array.<string> <optional>
 []

List of blacklisted URLs.
contentRedirect object <optional>

Restrict redirects to URLs that match a whitelisted pattern. In the lack of a whitelist, redirects to URLs that match a blacklisted pattern would be prohibited. See here for more details.

Properties
Name Type Attributes Default Description
whitelist Array.<string> <optional>
 []

List of whitelisted URLs.
blacklist Array.<string> <optional>
 []

List of blacklisted URLs.
contextMenuSettings object <optional>

Updatable. Deprecated - superseded by contextMenuOptions, which offers a larger feature-set and cleaner syntax. Configure the context menu when right-clicking on a view.

Properties
Name Type Attributes Default Description
enable boolean <optional>
 true

Should the context menu display on right click.
devtools boolean <optional>
 true

Should the context menu contain a button for opening devtools.
reload boolean <optional>
 true

Should the context menu contain a button for reloading the page.
contextMenuOptions object <optional>

Updatable. Configure the context menu when right-clicking on a view. Supported menu items: 'separator' 'cut' 'copy' 'paste' 'spellCheck' 'inspect' 'reload' 'navigateForward' 'navigateBack' 'print'

Properties
Name Type Attributes Default Description
enabled boolean <optional>
 true

Should the context menu display on right click.
template Array.<string> <optional>
 []

List of context menu items to display on right-click.
customData any <optional>
 ""

Updatable. A field that the user can attach serializable data to be ferried around with the view options. When omitted, the default value of this property is the empty string ("").
customContext any <optional>
 ""

Updatable. A field that the user can use to attach serializable data that will be saved when Platform.getSnapshot is called. When omitted, the default value of this property is the empty string (""). As opposed to customData, this is meant for frequent updates and sharing with other contexts. Example
hotkeys Array.<object> <optional>
 []

Updatable. Defines the list of hotkeys that will be emitted as a hotkey event on the view. For usage example see example. Within Platform, OpenFin also implements a set of pre-defined actions called keyboard commands that can be assigned to a specific hotkey in the platform manifest.

Properties
Name Type Attributes Default Description
keys string

The key combination of the hotkey, i.e. "Ctrl+T"
preventDefault boolean <optional>
 false

preventDefault will prevent the page keydown/keyup events from being emitted.
isClosable boolean <optional>
 true

Platforms Only. If false, the view will be persistent and can't be closed through either UI or Platform.closeView. Note that the view will still be closed if the host window is closed or if the view isn't part of the new layout when running Layout.replace.
name string

The name of the view.
detachOnClose boolean <optional>
 false

Updatable. Platforms Only. If true, will hide and detach the View from the window for later use instead of closing, allowing the state of the View to be saved and the View to be immediately shown in a new Layout.
manifestUrl string <optional>

Platforms Only. Url to a manifest that contains View Options. Properties other than manifestUrl can still be used but the properties in the manifest will take precedence if there is any collision.
preloadScripts Array.<preloadScript> <optional>

Inheritable A list of scripts that are eval'ed before other scripts in the page. When omitted, inherits from the parent application.
preventDragOut boolean <optional>
 false

Platforms Only. If true, the tab of the view can't be dragged out of its host window.
processAffinity string <optional>
 <application uuid>

A string to attempt to group renderers together. Will only be used if pages are on the same origin.
spellCheck boolean <optional>
 false

Enable spell check in input text fields for the view.
target Identity <optional>

The identity of the window this view should be attached to.
url string <optional>
 "about:blank"

The URL of the view.
uuid string <optional>
 <application uuid>

The uuid of the application, unique within the set of all Applications running in OpenFin Runtime. If omitted, defaults to the uuid of the application spawning the view. If given, must match the uuid of the application spawning the view. In other words, the application's uuid is the only acceptable value, but is the default, so there's really no need to provide it.