AboutSupportDeveloper GuideVersion 36.122.80.26

A basic window that wraps a native HTML window. Provides more fine-grained control over the window state such as the ability to minimize, maximize, restore, etc. By default a window does not show upon instantiation; instead the window's show() method must be invoked manually. The new window appears in the same process as the parent window. It has the ability to listen for window specific events.

Hierarchy

Properties

entityType: "view" | "window"

The type of the WebContents.

identity: Identity

The identity of the WebContents.

Accessors

  • get me(): Identity
  • Provides access to the OpenFin representation of the current code context (usually a document such as a View or Window), as well as to the current Interop context.

    Useful for debugging in the devtools console, where this will intelligently type itself based on the context in which the devtools panel was opened.

    Returns Identity

Methods

  • Adds a listener to the end of the listeners array for the specified event.

    Type Parameters

    • EventType extends "blurred" | "certificate-selection-shown" | "crashed" | "did-change-theme-color" | "focused" | "navigation-rejected" | "url-changed" | "did-fail-load" | "did-finish-load" | "page-favicon-updated" | "page-title-updated" | "resource-load-failed" | "resource-response-received" | "child-content-blocked" | "child-content-opened-in-browser" | "child-view-created" | "child-window-created" | "file-download-started" | "file-download-progress" | "file-download-completed" | "found-in-page" | "certificate-error" | "will-redirect" | "hidden" | "hotkey" | "shown" | "close-requested" | "view-attached" | "view-detached" | "auth-requested" | "begin-user-bounds-changing" | "bounds-changed" | "bounds-changing" | "context-changed" | "closed" | "closing" | "disabled-movement-bounds-changed" | "disabled-movement-bounds-changing" | "embedded" | "end-user-bounds-changing" | "external-process-exited" | "external-process-started" | "initialized" | "layout-initialized" | "layout-ready" | "maximized" | "minimized" | "options-changed" | "performance-report" | "preload-scripts-state-changed" | "preload-scripts-state-changing" | "reloaded" | "restored" | "show-requested" | "user-movement-disabled" | "user-movement-enabled" | "will-move" | "will-resize" | "show-all-downloads" | "download-shelf-visibility-changed" | "view-blurred" | "view-certificate-selection-shown" | "view-crashed" | "view-did-change-theme-color" | "view-focused" | "view-navigation-rejected" | "view-url-changed" | "view-did-fail-load" | "view-did-finish-load" | "view-page-favicon-updated" | "view-page-title-updated" | "view-resource-load-failed" | "view-resource-response-received" | "view-child-content-blocked" | "view-child-content-opened-in-browser" | "view-child-view-created" | "view-child-window-created" | "view-file-download-started" | "view-file-download-progress" | "view-file-download-completed" | "view-found-in-page" | "view-certificate-error" | "view-will-redirect" | "view-created" | "view-destroyed" | "view-hidden" | "view-hotkey" | "view-shown" | "view-target-changed" | "view-host-context-changed" | "view-added-to-layout" | "view-removed-from-layout"

    Parameters

    Returns Promise<Window>

  • Performs the specified window transitions.

    Parameters

    • transitions: Transition

      Describes the animations to perform. See the tutorial.

    • options: TransitionOptions

      Options for the animation. See the tutorial.

    Returns Promise<void>

    Example

    async function animateWindow() {
    const transitions = {
    opacity: {
    opacity: 0.7,
    duration: 500
    },
    position: {
    top: 100,
    left: 100,
    duration: 500,
    relative: true
    }
    };
    const options = {
    interrupt: true,
    tween: 'ease-in'
    };

    const win = await fin.Window.getCurrent();
    return win.animate(transitions, options);
    }

    animateWindow()
    .then(() => console.log('Animation done'))
    .catch(err => console.error(err));
  • Provides credentials to authentication requests

    Parameters

    • userName: string

      userName to provide to the authentication challenge

    • password: string

      password to provide to the authentication challenge

    Returns Promise<void>

    Example

    fin.Application.wrap({uuid: 'OpenfinPOC'}).then(app => {
    app.on('window-auth-requested', evt => {
    let win = fin.Window.wrap({ uuid: evt.uuid, name: evt.name});
    win.authenticate('userName', 'P@assw0rd').then(()=> console.log('authenticated')).catch(err => console.log(err));
    });
    });
  • Removes focus from the window.

    Returns Promise<void>

    Example

    async function blurWindow() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.blur.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.blur();
    }

    blurWindow().then(() => console.log('Blured Window')).catch(err => console.log(err));
  • Brings the window to the front of the window stack.

    Returns Promise<void>

    Example

    async function BringWindowToFront() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.bringToFront.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.bringToFront();
    }

    BringWindowToFront().then(() => console.log('Window is in the front')).catch(err => console.log(err));
  • Gets a base64 encoded image of all or part of the WebContents.

    Parameters

    Returns Promise<string>

    Example

    View:

    const view = fin.View.getCurrentSync();

    // PNG image of a full visible View
    console.log(await view.capturePage());

    // Low-quality JPEG image of a defined visible area of the view
    const options = {
    area: {
    height: 100,
    width: 100,
    x: 10,
    y: 10,
    },
    format: 'jpg',
    quality: 20
    }
    console.log(await view.capturePage(options));

    Window:

    const wnd = await fin.Window.getCurrent();

    // PNG image of a full visible window
    console.log(await wnd.capturePage());

    // Low-quality JPEG image of a defined visible area of the window
    const options = {
    area: {
    height: 100,
    width: 100,
    x: 10,
    y: 10,
    },
    format: 'jpg',
    quality: 20
    }
    console.log(await wnd.capturePage(options));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Centers the window on its current screen.

    Returns Promise<void>

    Remarks

    Does not have an effect on minimized or maximized windows.

    Example

    async function centerWindow() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.center.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.center();
    }

    centerWindow().then(() => console.log('Window centered')).catch(err => console.log(err));
  • closes the window application

    Parameters

    • force: boolean = false

      Close will be prevented from closing when force is false and ‘close-requested’ has been subscribed to for application’s main window.

    Returns Promise<void>

    Example

    async function closeWindow() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-3',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.close.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.close();
    }

    closeWindow().then(() => console.log('Window closed')).catch(err => console.log(err));
  • Experimental

    Closes the window's popup menu, if one exists.

    Returns Promise<void>

    Remarks

    Only one popup menu will ever be showing at a time. Calling showPopupMenu will automatically close any existing popup menu.

    Example

    This could be used to close a popup menu if the user's mouse leaves an element for example.

    await fin.me.closePopupMenu();
    
  • Returns Promise<void>

    Deprecated

    Use disableUserMovement instead.

  • Prevents a user from changing a window's size/position when using the window's frame.

    Returns Promise<void>

    Example

    async function disableUserMovement() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-3',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.disableFrame.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.disableUserMovement();
    }

    disableUserMovement().then(() => console.log('Window is disabled')).catch(err => console.log(err));
  • Dispatch a result to the caller of showPopupWindow.

    Parameters

    • data: any

      Serializable data to send to the caller window.

    Returns Promise<void>

    Remarks

    If this window isn't currently being shown as a popup, this call will silently fail.

    Example

    await fin.me.dispatchPopupResult({
    foo: 'bar'
    });
  • Returns Promise<void>

    Deprecated

    Use enableUserMovement instead.

  • Re-enables user changes to a window's size/position when using the window's frame.

    Returns Promise<void>

    Example

    async function enableUserMovement() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-3',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.enableFrame.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.enableUserMovement();
    }

    enableUserMovement().then(() => console.log('Window is enabled')).catch(err => console.log(err));
  • Returns (string | symbol)[]

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

    Parameters

    • code: string

      JavaScript code to be executed on the view.

    Returns Promise<unknown>

    Example

    View:

    async function executeJavaScript(code) {
    const view = await fin.View.wrap({uuid: 'uuid', name: 'view name'});
    return await view.executeJavaScript(code);
    }

    executeJavaScript(`console.log('Hello, Openfin')`).then(() => console.log('Javascript excuted')).catch(err => console.log(err));

    Window:

    async function executeJavaScript(code) {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.executeJavaScript.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.executeJavaScript(code);
    }

    executeJavaScript(`console.log('Hello, Openfin')`).then(() => console.log('Javascript excuted')).catch(err => console.log(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Find and highlight text on a page.

    Parameters

    • searchTerm: string

      Term to find in page

    • Optional options: FindInPageOptions

      Search options

      Note: By default, each subsequent call will highlight the next text that matches the search term.

      Returns a promise with the results for the request. By subscribing to the found-in-page event, you can get the results of this call as well.

    Returns Promise<void>

    Example

    View:

    const view = fin.View.getCurrentSync();

    //By subscribing to the 'found in page' event we can get the results of each findInPage call made.
    view.addListener('found-in-page', (event) => {
    console.log(event);
    });

    // The promise also returns the results for the request
    view.findInPage('a').then((result) => {
    console.log(result)
    });

    Window:

    const win = fin.Window.getCurrentSync();

    //By subscribing to the 'found in page' event we can get the results of each findInPage call made.
    win.addListener('found-in-page', (event) => {
    console.log(event);
    });

    // The promise also returns the results for the request
    win.findInPage('a').then((result) => {
    console.log(result)
    });

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Flashes the window’s frame and taskbar icon until stopFlashing is called or until a focus event is fired.

    Returns Promise<void>

    Remarks

    On macOS flash only works on inactive windows.

    Example

    async function windowFlash() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.flash.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.flash();
    }

    windowFlash().then(() => console.log('Window flashing')).catch(err => console.log(err));
  • Gives focus to the WebContents.

    Parameters

    • __namedParameters: {
          emitSynthFocused: boolean;
      } = ...
      • emitSynthFocused: boolean

    Returns Promise<void>

    Example

    async function focusWindow() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.focus.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.focus();
    }

    focusWindow().then(() => console.log('Window focused')).catch(err => console.log(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Returns Promise<void>

  • Retrieves an array of frame info objects representing the main frame and any iframes that are currently on the page.

    Returns Promise<FrameInfo[]>

    Example

    async function getAllFrames() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.getAllFrames.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.getAllFrames();
    }

    getAllFrames().then(framesInfo => console.log(framesInfo)).catch(err => console.log(err));
  • Gets the current bounds (top, bottom, right, left, width, height) of the window.

    Returns Promise<WindowBounds>

    Example

    async function getBounds() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-3',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.getBounds.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.getBounds();
    }

    getBounds().then(bounds => console.log(bounds)).catch(err => console.log(err));
  • Experimental

    Retrieves window's attached views.

    Returns Promise<View[]>

    Example

    const win = fin.Window.getCurrentSync();

    win.getCurrentViews()
    .then(views => console.log(views))
    .catch(console.error);
  • Gets an information object for the window.

    Returns Promise<WindowInfo>

    Example

    async function getInfo() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.getInfo.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.getInfo();
    }

    getInfo().then(info => console.log(info)).catch(err => console.log(err));
  • Experimental

    Retrieves the window's Layout

    Parameters

    Returns Promise<Layout>

    Example

        //get the current window
    const window = await fin.Window.getCurrent();

    //get the layout for the window
    const layout = await window.getLayout();
  • Returns the native OS level Id.

    Returns Promise<string>

    Remarks

    In Windows, it will return the Windows handle.

    Example

    async function getWindowNativeId() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-3',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.getNativeId.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.getNativeId();
    }

    getWindowNativeId().then(nativeId => console.log(nativeId)).catch(err => console.log(err));
  • Gets the current settings of the window.

    Returns Promise<WindowOptions>

    Example

    async function getWindowOptions() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.getOptions.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.getOptions();
    }

    getWindowOptions().then(opts => console.log(opts)).catch(err => console.log(err));
  • Gets the parent application.

    Returns Promise<Application>

    Example

    async function getParentApplication() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.getParentApplication.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.getParentApplication();
    }

    getParentApplication().then(parentApplication => console.log(parentApplication)).catch(err => console.log(err));
  • Gets the parent window.

    Returns Promise<Window>

    Example

    async function getParentWindow() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.getParentWindow.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.getParentWindow();
    }

    getParentWindow().then(parentWindow => console.log(parentWindow)).catch(err => console.log(err));
  • Returns an array with all system printers

    Returns Promise<PrinterInfo>

    Deprecated

    use System.getPrinters instead

    Example

    View:

    const view = fin.View.getCurrentSync();

    view.getPrinters()
    .then((printers) => {
    printers.forEach((printer) => {
    if (printer.isDefault) {
    console.log(printer);
    }
    });
    })
    .catch((err) => {
    console.log(err);
    });

    Window:

    const win = fin.Window.getCurrentSync();

    win.getPrinters()
    .then((printers) => {
    printers.forEach((printer) => {
    if (printer.isDefault) {
    console.log(printer);
    }
    });
    })
    .catch((err) => {
    console.log(err);
    });

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Retrieves the process information associated with a WebContents.

    Note: This includes any iframes associated with the WebContents

    Returns Promise<EntityProcessDetails>

    Example

    View:

        const view = await fin.View.getCurrent();
    const processInfo = await view.getProcessInfo();

    Window:

        const win = await fin.Window.getCurrent();
    const processInfo = await win.getProcessInfo();

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Retrieves information on all Shared Workers.

    Returns Promise<SharedWorkerInfo[]>

    Example

    View:

        const view = await fin.View.create({
    name: 'viewName',
    target: fin.me.identity,
    bounds: {top: 10, left: 10, width: 200, height: 200}
    });

    await view.navigate('http://mdn.github.io/simple-shared-worker/index2.html');

    const sharedWorkers = await view.getSharedWorkers();

    Window:

        const winOption = {
    name:'child',
    defaultWidth: 300,
    defaultHeight: 300,
    url: 'http://mdn.github.io/simple-shared-worker/index2.html',
    frame: true,
    autoShow: true
    };
    const win = await fin.Window.create(winOption);
    const sharedWorkers = await win.getSharedWorkers();

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • DEPRECATED - please use Window.capturePage. Gets a base64 encoded PNG image of the window or just part a of it.

    Parameters

    • Optional area: Rectangle

      The area of the window to be captured. Omitting it will capture the whole visible window.

    Returns Promise<string>

    Tutorial

    Window.capturePage

  • Gets the current state ("minimized", "maximized", or "normal") of the window.

    Returns Promise<"maximized" | "minimized" | "normal">

    Example

    async function getWindowState() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.getState.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.getState();
    }

    getWindowState().then(winState => console.log(winState)).catch(err => console.log(err));
  • Previously called getNativeWindow. Returns the Window Object that represents the web context of the target window. This is the same object that you would get from calling window.open() in a standard web context. The target window needs to be in the same application as the requesting window as well as comply with same-origin policy requirements.

    Returns Window

    Example

    Injecting content into an empty window:

    (async ()=> {
    try {
    const winName = `child-window-${Date.now()}`;
    const win = await fin.Window.create({
    name: winName,
    url: 'about:blank'
    });
    win.getWebWindow().document.write('<h1>Hello World</h1>');
    } catch (err) {
    console.error(err);
    }
    })();

    Cloning DOM elements from the parent window (in this example we clone an h3 element from the parent window):

    (async ()=> {
    try {
    const currentWindow = await fin.Window.getCurrent();
    const parentWindow = await currentWindow.getParentWindow();
    const clonedH3 = parentWindow.getWebWindow().document.querySelector('h3').cloneNode(true);
    document.body.append(clonedH3);

    } catch (err) {
    console.error(err);
    }
    })();

    Rendering on a child window via a library (in this example we are using the lit-html template library to render content on a blank child window. You are not going to be able to copy paste this example without configuring the project correctly but this would demonstrate some templating options available):

    (async ()=> {
    try {
    const win = await fin.Window.create({
    name: `child-window-${Date.now()}`,
    url: 'about:blank'
    });
    const template = html`
    <div>
    <span>Click here: </span>
    <button @click=${()=> console.log('Hello World!')}>log to the console</button>
    </div>`;
    render(template, win.getWebWindow().document.body);

    } catch (err) {
    console.error(err);
    }
    })();
  • Returns the zoom level of the WebContents.

    Returns Promise<number>

    Example

    View:

    async function getZoomLevel() {
    const view = await fin.View.getCurrent();
    return await view.getZoomLevel();
    }

    getZoomLevel().then(zoomLevel => console.log(zoomLevel)).catch(err => console.log(err));

    Window:

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.getZoomLevel.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function getZoomLevel() {
    const win = await createWin();
    return await win.getZoomLevel();
    }

    getZoomLevel().then(zoomLevel => console.log(zoomLevel)).catch(err => console.log(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Hides the window.

    Returns Promise<void>

    Example

    async function hideWindow() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.hide.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.hide();
    }

    hideWindow().then(() => console.log('Window is hidden')).catch(err => console.log(err));
  • Opens the developer tools for the service worker context.

    Returns Promise<void>

    Example

    View:

        const view = await fin.View.create({
    name: 'viewName',
    target: fin.me.identity,
    bounds: {top: 10, left: 10, width: 200, height: 200}
    });

    await view.navigate('http://googlechrome.github.io/samples/service-worker/basic/index.html');

    await view.inspectServiceWorker();

    Window:

        const winOption = {
    name:'child',
    defaultWidth: 300,
    defaultHeight: 300,
    url: 'http://googlechrome.github.io/samples/service-worker/basic/index.html',
    frame: true,
    autoShow: true
    };
    const win = await fin.Window.create(winOption);
    await win.inspectServiceWorker();

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Opens the developer tools for the shared worker context.

    Returns Promise<void>

    Example

    View:

        const view = await fin.View.create({
    name: 'viewName',
    target: fin.me.identity,
    bounds: {top: 10, left: 10, width: 200, height: 200}
    });

    await view.navigate('http://mdn.github.io/simple-shared-worker/index2.html');

    await view.inspectSharedWorker();

    Example:

        const winOption = {
    name:'child',
    defaultWidth: 300,
    defaultHeight: 300,
    url: 'http://mdn.github.io/simple-shared-worker/index2.html',
    frame: true,
    autoShow: true
    };
    const win = await fin.Window.create(winOption);
    await win.inspectSharedWorker();

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Inspects the shared worker based on its ID.

    Parameters

    • workerId: string

      The id of the shared worker.

    Returns Promise<void>

    Example

    View:

        const view = await fin.View.create({
    name: 'viewName',
    target: fin.me.identity,
    bounds: {top: 10, left: 10, width: 200, height: 200}
    });

    await view.navigate('http://mdn.github.io/simple-shared-worker/index2.html');

    const sharedWorkers = await view.getSharedWorkers();
    await view.inspectSharedWorkerById(sharedWorkers[0].id);

    Window:

        const winOption = {
    name:'child',
    defaultWidth: 300,
    defaultHeight: 300,
    url: 'http://mdn.github.io/simple-shared-worker/index2.html',
    frame: true,
    autoShow: true
    };
    const win = await fin.Window.create(winOption);
    const sharedWorkers = await win.getSharedWorkers();
    await win.inspectSharedWorkerById(sharedWorkers[0].id);

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Determines if the window is a main window.

    Returns boolean

    Example

    const wnd = fin.Window.getCurrentSync();
    const isMainWnd = wnd.isMainWindow();
    console.log('Is this a main window? ' + isMainWnd);
  • Determines if the window is currently showing.

    Returns Promise<boolean>

    Example

    async function isWindowShowing() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.isShowing.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.isShowing();
    }

    isWindowShowing().then(bool => console.log(bool)).catch(err => console.log(err));
  • Parameters

    • type: string | symbol

    Returns number

  • Parameters

    • type: string | symbol

    Returns Function[]

  • Maximizes the window

    Returns Promise<void>

    Example

    async function maxWindow() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.maximize.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.maximize();
    }

    maxWindow().then(() => console.log('Maximized window')).catch(err => console.log(err));
  • Minimizes the window.

    Returns Promise<void>

    Example

    async function minWindow() {
    const win = await fin.Window.getCurrent();
    return await win.minimize();
    }

    minWindow().then(() => console.log('Minimized window')).catch(err => console.log(err));
  • Moves the window by a specified amount.

    Parameters

    • deltaLeft: number

      The change in the left position of the window

    • deltaTop: number

      The change in the top position of the window

    • Optional positioningOptions: PositioningOptions

    Returns Promise<void>

    Example

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.moveBy.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function moveBy(left, top) {
    const win = await createWin();
    return await win.moveBy(left, top);
    }

    moveBy(580, 300).then(() => console.log('Moved')).catch(err => console.log(err));
  • Moves the window to a specified location.

    Parameters

    • left: number

      The left position of the window

    • top: number

      The top position of the window

    • Optional positioningOptions: PositioningOptions

    Returns Promise<void>

    Example

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.moveTo.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function moveTo(left, top) {
    const win = await createWin();
    return await win.moveTo(left, top)
    }

    moveTo(580, 300).then(() => console.log('Moved')).catch(err => console.log(err))
  • Experimental

    Navigates the WebContents to a specified URL.

    Note: The url must contain the protocol prefix such as http:// or https://.

    Parameters

    • url: string

      The URL to navigate the WebContents to.

    Returns Promise<void>

    Example

    View:

    async function createView() {
    const me = await fin.Window.getCurrent();
    return fin.View.create({
    name: 'viewName',
    target: me.identity,
    bounds: {top: 10, left: 10, width: 200, height: 200}
    });
    }

    createView()
    .then(view => view.navigate('https://example.com'))
    .then(() => console.log('navigation complete'))
    .catch(err => console.log(err));

    Window:

    async function navigate() {
    const win = await fin.Window.getCurrent();
    return await win.navigate('https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.navigate.html');
    }
    navigate().then(() => console.log('Navigate to tutorial')).catch(err => console.log(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Navigates the WebContents back one page.

    Returns Promise<void>

    Example

    View:

    async function navigateBack() {
    const view = await fin.View.wrap({ name: 'testapp-view', uuid: 'testapp' });
    await view.navigate('https://www.google.com');
    return await view.navigateBack();
    }
    navigateBack().then(() => console.log('Navigated back')).catch(err => console.log(err));

    Window:

    async function navigateBack() {
    const win = await fin.Window.wrap({ name: 'testapp', uuid: 'testapp' });
    await win.navigate('https://www.google.com');
    return await win.navigateBack();
    }
    navigateBack().then(() => console.log('Navigated back')).catch(err => console.log(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Navigates the WebContents forward one page.

    Returns Promise<void>

    Example

    View:

    async function navigateForward() {
    const view = await fin.View.getCurrent();
    await view.navigate('https://www.google.com');
    await view.navigateBack();
    return await view.navigateForward();
    }
    navigateForward().then(() => console.log('Navigated forward')).catch(err => console.log(err));

    Window:

    async function navigateForward() {
    const win = await fin.Window.getCurrent();
    await win.navigate('https://www.google.com');
    await win.navigateBack();
    return await win.navigateForward();
    }
    navigateForward().then(() => console.log('Navigated forward')).catch(err => console.log(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Adds a listener to the end of the listeners array for the specified event.

    Type Parameters

    • EventType extends "blurred" | "certificate-selection-shown" | "crashed" | "did-change-theme-color" | "focused" | "navigation-rejected" | "url-changed" | "did-fail-load" | "did-finish-load" | "page-favicon-updated" | "page-title-updated" | "resource-load-failed" | "resource-response-received" | "child-content-blocked" | "child-content-opened-in-browser" | "child-view-created" | "child-window-created" | "file-download-started" | "file-download-progress" | "file-download-completed" | "found-in-page" | "certificate-error" | "will-redirect" | "hidden" | "hotkey" | "shown" | "close-requested" | "view-attached" | "view-detached" | "auth-requested" | "begin-user-bounds-changing" | "bounds-changed" | "bounds-changing" | "context-changed" | "closed" | "closing" | "disabled-movement-bounds-changed" | "disabled-movement-bounds-changing" | "embedded" | "end-user-bounds-changing" | "external-process-exited" | "external-process-started" | "initialized" | "layout-initialized" | "layout-ready" | "maximized" | "minimized" | "options-changed" | "performance-report" | "preload-scripts-state-changed" | "preload-scripts-state-changing" | "reloaded" | "restored" | "show-requested" | "user-movement-disabled" | "user-movement-enabled" | "will-move" | "will-resize" | "show-all-downloads" | "download-shelf-visibility-changed" | "view-blurred" | "view-certificate-selection-shown" | "view-crashed" | "view-did-change-theme-color" | "view-focused" | "view-navigation-rejected" | "view-url-changed" | "view-did-fail-load" | "view-did-finish-load" | "view-page-favicon-updated" | "view-page-title-updated" | "view-resource-load-failed" | "view-resource-response-received" | "view-child-content-blocked" | "view-child-content-opened-in-browser" | "view-child-view-created" | "view-child-window-created" | "view-file-download-started" | "view-file-download-progress" | "view-file-download-completed" | "view-found-in-page" | "view-certificate-error" | "view-will-redirect" | "view-created" | "view-destroyed" | "view-hidden" | "view-hotkey" | "view-shown" | "view-target-changed" | "view-host-context-changed" | "view-added-to-layout" | "view-removed-from-layout"

    Parameters

    Returns Promise<Window>

    Remarks

    Event payloads are documented in the Events namespace.

  • Adds a one time listener for the event. The listener is invoked only the first time the event is fired, after which it is removed.

    Type Parameters

    • EventType extends "blurred" | "certificate-selection-shown" | "crashed" | "did-change-theme-color" | "focused" | "navigation-rejected" | "url-changed" | "did-fail-load" | "did-finish-load" | "page-favicon-updated" | "page-title-updated" | "resource-load-failed" | "resource-response-received" | "child-content-blocked" | "child-content-opened-in-browser" | "child-view-created" | "child-window-created" | "file-download-started" | "file-download-progress" | "file-download-completed" | "found-in-page" | "certificate-error" | "will-redirect" | "hidden" | "hotkey" | "shown" | "close-requested" | "view-attached" | "view-detached" | "auth-requested" | "begin-user-bounds-changing" | "bounds-changed" | "bounds-changing" | "context-changed" | "closed" | "closing" | "disabled-movement-bounds-changed" | "disabled-movement-bounds-changing" | "embedded" | "end-user-bounds-changing" | "external-process-exited" | "external-process-started" | "initialized" | "layout-initialized" | "layout-ready" | "maximized" | "minimized" | "options-changed" | "performance-report" | "preload-scripts-state-changed" | "preload-scripts-state-changing" | "reloaded" | "restored" | "show-requested" | "user-movement-disabled" | "user-movement-enabled" | "will-move" | "will-resize" | "show-all-downloads" | "download-shelf-visibility-changed" | "view-blurred" | "view-certificate-selection-shown" | "view-crashed" | "view-did-change-theme-color" | "view-focused" | "view-navigation-rejected" | "view-url-changed" | "view-did-fail-load" | "view-did-finish-load" | "view-page-favicon-updated" | "view-page-title-updated" | "view-resource-load-failed" | "view-resource-response-received" | "view-child-content-blocked" | "view-child-content-opened-in-browser" | "view-child-view-created" | "view-child-window-created" | "view-file-download-started" | "view-file-download-progress" | "view-file-download-completed" | "view-found-in-page" | "view-certificate-error" | "view-will-redirect" | "view-created" | "view-destroyed" | "view-hidden" | "view-hotkey" | "view-shown" | "view-target-changed" | "view-host-context-changed" | "view-added-to-layout" | "view-removed-from-layout"

    Parameters

    Returns Promise<Window>

    Remarks

    Event payloads are documented in the Events namespace.

  • Adds a listener to the beginning of the listeners array for the specified event.

    Type Parameters

    • EventType extends "blurred" | "certificate-selection-shown" | "crashed" | "did-change-theme-color" | "focused" | "navigation-rejected" | "url-changed" | "did-fail-load" | "did-finish-load" | "page-favicon-updated" | "page-title-updated" | "resource-load-failed" | "resource-response-received" | "child-content-blocked" | "child-content-opened-in-browser" | "child-view-created" | "child-window-created" | "file-download-started" | "file-download-progress" | "file-download-completed" | "found-in-page" | "certificate-error" | "will-redirect" | "hidden" | "hotkey" | "shown" | "close-requested" | "view-attached" | "view-detached" | "auth-requested" | "begin-user-bounds-changing" | "bounds-changed" | "bounds-changing" | "context-changed" | "closed" | "closing" | "disabled-movement-bounds-changed" | "disabled-movement-bounds-changing" | "embedded" | "end-user-bounds-changing" | "external-process-exited" | "external-process-started" | "initialized" | "layout-initialized" | "layout-ready" | "maximized" | "minimized" | "options-changed" | "performance-report" | "preload-scripts-state-changed" | "preload-scripts-state-changing" | "reloaded" | "restored" | "show-requested" | "user-movement-disabled" | "user-movement-enabled" | "will-move" | "will-resize" | "show-all-downloads" | "download-shelf-visibility-changed" | "view-blurred" | "view-certificate-selection-shown" | "view-crashed" | "view-did-change-theme-color" | "view-focused" | "view-navigation-rejected" | "view-url-changed" | "view-did-fail-load" | "view-did-finish-load" | "view-page-favicon-updated" | "view-page-title-updated" | "view-resource-load-failed" | "view-resource-response-received" | "view-child-content-blocked" | "view-child-content-opened-in-browser" | "view-child-view-created" | "view-child-window-created" | "view-file-download-started" | "view-file-download-progress" | "view-file-download-completed" | "view-found-in-page" | "view-certificate-error" | "view-will-redirect" | "view-created" | "view-destroyed" | "view-hidden" | "view-hotkey" | "view-shown" | "view-target-changed" | "view-host-context-changed" | "view-added-to-layout" | "view-removed-from-layout"

    Parameters

    Returns Promise<Window>

    Remarks

    Event payloads are documented in the Events namespace.

  • Adds a one time listener for the event. The listener is invoked only the first time the event is fired, after which it is removed. The listener is added to the beginning of the listeners array.

    Type Parameters

    • EventType extends "blurred" | "certificate-selection-shown" | "crashed" | "did-change-theme-color" | "focused" | "navigation-rejected" | "url-changed" | "did-fail-load" | "did-finish-load" | "page-favicon-updated" | "page-title-updated" | "resource-load-failed" | "resource-response-received" | "child-content-blocked" | "child-content-opened-in-browser" | "child-view-created" | "child-window-created" | "file-download-started" | "file-download-progress" | "file-download-completed" | "found-in-page" | "certificate-error" | "will-redirect" | "hidden" | "hotkey" | "shown" | "close-requested" | "view-attached" | "view-detached" | "auth-requested" | "begin-user-bounds-changing" | "bounds-changed" | "bounds-changing" | "context-changed" | "closed" | "closing" | "disabled-movement-bounds-changed" | "disabled-movement-bounds-changing" | "embedded" | "end-user-bounds-changing" | "external-process-exited" | "external-process-started" | "initialized" | "layout-initialized" | "layout-ready" | "maximized" | "minimized" | "options-changed" | "performance-report" | "preload-scripts-state-changed" | "preload-scripts-state-changing" | "reloaded" | "restored" | "show-requested" | "user-movement-disabled" | "user-movement-enabled" | "will-move" | "will-resize" | "show-all-downloads" | "download-shelf-visibility-changed" | "view-blurred" | "view-certificate-selection-shown" | "view-crashed" | "view-did-change-theme-color" | "view-focused" | "view-navigation-rejected" | "view-url-changed" | "view-did-fail-load" | "view-did-finish-load" | "view-page-favicon-updated" | "view-page-title-updated" | "view-resource-load-failed" | "view-resource-response-received" | "view-child-content-blocked" | "view-child-content-opened-in-browser" | "view-child-view-created" | "view-child-window-created" | "view-file-download-started" | "view-file-download-progress" | "view-file-download-completed" | "view-found-in-page" | "view-certificate-error" | "view-will-redirect" | "view-created" | "view-destroyed" | "view-hidden" | "view-hotkey" | "view-shown" | "view-target-changed" | "view-host-context-changed" | "view-added-to-layout" | "view-removed-from-layout"

    Parameters

    Returns Promise<Window>

    Remarks

    Event payloads are documented in the Events namespace.

  • Prints the contents of the window.

    Parameters

    Returns Promise<void>

    Remarks

    When silent is set to true, the API will pick the system's default printer if deviceName is empty and the default settings for printing.

    Use the CSS style page-break-before: always; to force print to a new page.

    Example

    const win = fin.Window.getCurrentSync();

    win.print({ silent: false, deviceName: 'system-printer-name' }).then(() => {
    console.log('print call has been sent to the system');
    });

    If a window has embedded views, those views will not print by default. To print a window's contents including embedded views, use the content option:

    const win = fin.Window.getCurrentSync();

    // Print embedded views
    win.print({ content: 'views' });

    // Print screenshot of current window
    win.print({ content: 'screenshot' })

    When content is set to views, the embedded views in the platform window will be concatenated and printed as individual pages. If includeSelf is set to true, the platform window itself will be printed as the first page - be aware that this page will not include the embedded views - it will only include the contents of the platform window itself (e.g. tab stacks), with blank spaces where the view contents would be embedded.

    Due to a known issue, view contents that are not visible at the time print is called will not appear when printing contents: views. This includes views that are obscured behind other active UI elements.

    To print the views embedded in their page context, set content to screenshot.

  • Reloads the WebContents

    Parameters

    • ignoreCache: boolean = false

    Returns Promise<void>

    Example

    View:

    async function reload() {
    const view = await fin.View.getCurrent();
    return await view.reload();
    }

    reload().then(() => {
    console.log('Reloaded view')
    }).catch(err => console.log(err));

    Window:

    async function reloadWindow() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.reload.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.reload();
    }

    reloadWindow().then(() => {
    console.log('Reloaded window')
    }).catch(err => console.log(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Removes all listeners, or those of the specified event.

    Parameters

    • Optional eventType: "blurred" | "certificate-selection-shown" | "crashed" | "did-change-theme-color" | "focused" | "navigation-rejected" | "url-changed" | "did-fail-load" | "did-finish-load" | "page-favicon-updated" | "page-title-updated" | "resource-load-failed" | "resource-response-received" | "child-content-blocked" | "child-content-opened-in-browser" | "child-view-created" | "child-window-created" | "file-download-started" | "file-download-progress" | "file-download-completed" | "found-in-page" | "certificate-error" | "will-redirect" | "hidden" | "hotkey" | "shown" | "close-requested" | "view-attached" | "view-detached" | "auth-requested" | "begin-user-bounds-changing" | "bounds-changed" | "bounds-changing" | "context-changed" | "closed" | "closing" | "disabled-movement-bounds-changed" | "disabled-movement-bounds-changing" | "embedded" | "end-user-bounds-changing" | "external-process-exited" | "external-process-started" | "initialized" | "layout-initialized" | "layout-ready" | "maximized" | "minimized" | "options-changed" | "performance-report" | "preload-scripts-state-changed" | "preload-scripts-state-changing" | "reloaded" | "restored" | "show-requested" | "user-movement-disabled" | "user-movement-enabled" | "will-move" | "will-resize" | "show-all-downloads" | "download-shelf-visibility-changed" | "view-blurred" | "view-certificate-selection-shown" | "view-crashed" | "view-did-change-theme-color" | "view-focused" | "view-navigation-rejected" | "view-url-changed" | "view-did-fail-load" | "view-did-finish-load" | "view-page-favicon-updated" | "view-page-title-updated" | "view-resource-load-failed" | "view-resource-response-received" | "view-child-content-blocked" | "view-child-content-opened-in-browser" | "view-child-view-created" | "view-child-window-created" | "view-file-download-started" | "view-file-download-progress" | "view-file-download-completed" | "view-found-in-page" | "view-certificate-error" | "view-will-redirect" | "view-created" | "view-destroyed" | "view-hidden" | "view-hotkey" | "view-shown" | "view-target-changed" | "view-host-context-changed" | "view-added-to-layout" | "view-removed-from-layout"

    Returns Promise<Window>

  • Remove a listener from the listener array for the specified event.

    Type Parameters

    • EventType extends "blurred" | "certificate-selection-shown" | "crashed" | "did-change-theme-color" | "focused" | "navigation-rejected" | "url-changed" | "did-fail-load" | "did-finish-load" | "page-favicon-updated" | "page-title-updated" | "resource-load-failed" | "resource-response-received" | "child-content-blocked" | "child-content-opened-in-browser" | "child-view-created" | "child-window-created" | "file-download-started" | "file-download-progress" | "file-download-completed" | "found-in-page" | "certificate-error" | "will-redirect" | "hidden" | "hotkey" | "shown" | "close-requested" | "view-attached" | "view-detached" | "auth-requested" | "begin-user-bounds-changing" | "bounds-changed" | "bounds-changing" | "context-changed" | "closed" | "closing" | "disabled-movement-bounds-changed" | "disabled-movement-bounds-changing" | "embedded" | "end-user-bounds-changing" | "external-process-exited" | "external-process-started" | "initialized" | "layout-initialized" | "layout-ready" | "maximized" | "minimized" | "options-changed" | "performance-report" | "preload-scripts-state-changed" | "preload-scripts-state-changing" | "reloaded" | "restored" | "show-requested" | "user-movement-disabled" | "user-movement-enabled" | "will-move" | "will-resize" | "show-all-downloads" | "download-shelf-visibility-changed" | "view-blurred" | "view-certificate-selection-shown" | "view-crashed" | "view-did-change-theme-color" | "view-focused" | "view-navigation-rejected" | "view-url-changed" | "view-did-fail-load" | "view-did-finish-load" | "view-page-favicon-updated" | "view-page-title-updated" | "view-resource-load-failed" | "view-resource-response-received" | "view-child-content-blocked" | "view-child-content-opened-in-browser" | "view-child-view-created" | "view-child-window-created" | "view-file-download-started" | "view-file-download-progress" | "view-file-download-completed" | "view-found-in-page" | "view-certificate-error" | "view-will-redirect" | "view-created" | "view-destroyed" | "view-hidden" | "view-hotkey" | "view-shown" | "view-target-changed" | "view-host-context-changed" | "view-added-to-layout" | "view-removed-from-layout"

    Parameters

    Returns Promise<Window>

    Remarks

    Caution: Calling this method changes the array indices in the listener array behind the listener.

  • Resizes the window by a specified amount.

    Parameters

    • deltaWidth: number

      The change in the width of the window

    • deltaHeight: number

      The change in the height of the window

    • anchor: AnchorType

      Specifies a corner to remain fixed during the resize. Can take the values: "top-left", "top-right", "bottom-left", or "bottom-right". If undefined, the default is "top-left"

    • Optional positioningOptions: PositioningOptions

    Returns Promise<void>

    Example

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.resizeBy.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function resizeBy(left, top, anchor) {
    const win = await createWin();
    return await win.resizeBy(left, top, anchor)
    }

    resizeBy(580, 300, 'top-right').then(() => console.log('Resized')).catch(err => console.log(err));
  • Resizes the window to the specified dimensions.

    Parameters

    • width: number

      The change in the width of the window

    • height: number

      The change in the height of the window

    • anchor: AnchorType

      Specifies a corner to remain fixed during the resize. Can take the values: "top-left", "top-right", "bottom-left", or "bottom-right". If undefined, the default is "top-left"

    • Optional positioningOptions: PositioningOptions

    Returns Promise<void>

    Example

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.resizeTo.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function resizeTo(left, top, anchor) {
    const win = await createWin();
    return await win.resizeTo(left, top, anchor);
    }

    resizeTo(580, 300, 'top-left').then(() => console.log('Resized')).catch(err => console.log(err));
  • Restores the window to its normal state (i.e., unminimized, unmaximized).

    Returns Promise<void>

    Example

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.restore.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function restore() {
    const win = await createWin();
    return await win.restore();
    }

    restore().then(() => console.log('Restored')).catch(err => console.log(err));
  • Will bring the window to the front of the entire stack and give it focus.

    Returns Promise<void>

    Example

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.setAsForeground.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function setAsForeground() {
    const win = await createWin();
    return await win.setAsForeground()
    }

    setAsForeground().then(() => console.log('In the foreground')).catch(err => console.log(err));
  • Sets the window's size and position.

    Parameters

    Returns Promise<void>

    Example

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.setBounds.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function setBounds(bounds) {
    const win = await createWin();
    return await win.setBounds(bounds);
    }

    setBounds({
    height: 100,
    width: 200,
    top: 400,
    left: 400
    }).then(() => console.log('Bounds set to window')).catch(err => console.log(err));
  • Sets the zoom level of the WebContents.

    Parameters

    • level: number

      The zoom level

    Returns Promise<void>

    Example

    View:

    async function setZoomLevel(number) {
    const view = await fin.View.getCurrent();
    return await view.setZoomLevel(number);
    }

    setZoomLevel(4).then(() => console.log('Setting a zoom level')).catch(err => console.log(err));

    Window:

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.setZoomLevel.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function setZoomLevel(number) {
    const win = await createWin();
    return await win.setZoomLevel(number);
    }

    setZoomLevel(4).then(() => console.log('Setting a zoom level')).catch(err => console.log(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Shows the window if it is hidden.

    Parameters

    • force: boolean = false

      Show will be prevented from showing when force is false and ‘show-requested’ has been subscribed to for application’s main window.

    Returns Promise<void>

    Example

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.show.html',
    autoShow: false
    });
    return await app.getWindow();
    }

    async function show() {
    const win = await createWin();
    return await win.show()
    }

    show().then(() => console.log('Showing')).catch(err => console.log(err));
  • Shows the window if it is hidden at the specified location.

    Parameters

    • left: number

      The left position of the window in pixels

    • top: number

      The top position of the window in pixels

    • force: boolean = false

      Show will be prevented from closing when force is false and ‘show-requested’ has been subscribed to for application’s main window

    Returns Promise<void>

    Example

    async function createWin() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.showAt.html',
    autoShow: true
    });
    return await app.getWindow();
    }

    async function showAt(left, top) {
    const win = await createWin();
    return await win.showAt(left, top)
    }

    showAt(580, 300).then(() => console.log('Showing at')).catch(err => console.log(err));
  • Shows the Chromium Developer Tools

    Returns Promise<void>

    Example

    View:

    async function showDeveloperTools() {
    const view = await fin.View.getCurrent();
    return view.showDeveloperTools();
    }

    showDevelopertools()
    .then(() => console.log('Showing dev tools'))
    .catch(err => console.error(err));

    Window:

    async function showDeveloperTools() {
    const win = await fin.Window.getCurrent();
    return win.showDeveloperTools();
    }

    showDevelopertools()
    .then(() => console.log('Showing dev tools'))
    .catch(err => console.error(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Experimental

    Shows a menu on the window.

    Type Parameters

    • Data

      User-defined shape for data returned upon menu item click. Should be a union of all possible data shapes for the entire menu, and the click handler should process these with a "reducer" pattern.

    Parameters

    Returns Promise<MenuResult<Data>>

    Remarks

    Returns a promise that resolves when the user has either selected an item or closed the menu. (This may take longer than other apis). Resolves to an object with {result: 'clicked', data } where data is the data field on the menu item clicked, or {result 'closed'} when the user doesn't select anything. Calling this method will close previously opened menus.

    Example

    This could be used to show a drop down menu over views in a platform window:

    const template = [
    {
    label: 'Menu Item 1',
    data: 'hello from item 1'
    },
    { type: 'separator' },
    {
    label: 'Menu Item 2',
    type: 'checkbox',
    checked: true,
    data: 'The user clicked the checkbox'
    },
    {
    label: 'see more',
    enabled: false,
    submenu: [
    { label: 'submenu 1', data: 'hello from submenu' }
    ]
    }
    ]
    fin.me.showPopupMenu({ template }).then(r => {
    if (r.result === 'closed') {
    console.log('nothing happened');
    } else {
    console.log(r.data)
    }
    })

    Overriding the built in context menu (note: that this can be done per element or document wide):

    document.addEventListener('contextmenu', e => {
    e.preventDefault();
    const template = [
    {
    label: 'Menu Item 1',
    data: 'hello from item 1'
    },
    { type: 'separator' },
    {
    label: 'Menu Item 2',
    type: 'checkbox',
    checked: true,
    data: 'The user clicked the checkbox'
    },
    {
    label: 'see more',
    enabled: false,
    submenu: [
    { label: 'submenu 1', data: 'hello from submenu' }
    ]
    }
    ]
    fin.me.showPopupMenu({ template, x: e.x, y: e.y }).then(r => {
    if (r.result === 'closed') {
    console.log('nothing happened');
    } else {
    console.log(r.data)
    }
    })
    })
  • Shows a popup window.

    Note: If this WebContents is a view and its attached window has a popup open, this will close it.

    Shows a popup window. Including a name in options will attempt to show an existing window as a popup, if that window doesn't exist or no name is included a window will be created. If the caller view or the caller view's parent window currently has a popup window open, calling showPopupWindow again will dismiss the currently open popup window before showing the new popup window. Also, if the caller view is destroyed or detached, the popup will be dismissed.

    Note: in the case where the window being shown as a popup needs to be created, it is a child of the caller view's parent window.

    Parameters

    Returns Promise<PopupResult<any>>

    Example

    Create and show a single-use popup window that returns a single result to the caller. initialOptions allows us to pass window options to the popup window that will be created. resultDispatchBehavior: 'close' ensures that once the popup window calls dispatchPopupResult it is closed. blurBehavior: 'close' will yield a dismissed result should the popup window lose focus.

    const result = await fin.me.showPopupWindow({
    initialOptions: {
    frame: false
    },
    url: '<my_popup_url>',
    resultDispatchBehavior: 'close',
    blurBehavior: 'close',
    focus: true,
    height: 300,
    width: 300,
    x: 0,
    y: 0
    });

    Same as above but using an existing window as a popup by referencing its name:

    Note: if a window with the name provided doesn't exist, it will be created.

    const result = await fin.me.showPopupWindow({
    initialOptions: {
    frame: true
    },
    name: 'my-popup', // shows the 'my-popup' window if it exists, otherwise creates it
    url: '<my_popup_url>', // navigates to this url if it doesn't match the location.href of the 'my-popup' window
    resultDispatchBehavior: 'close',
    blurBehavior: 'close',
    focus: true,
    hideOnClose: true, // persist window on 'dismissed' result, alternatively change onResultDispatch and blurBehavior to 'hide'
    height: 300,
    width: 300,
    x: 0,
    y: 0
    });

    Create and show a popup window that is able to return multiple results to the caller via an onPopupResult callback. Each time the popup window calls dispatchPopupResult, the callback will be executed on the result. Once the popup window is closed or hidden, the showPopupWindow promise will resolve with a dismissed result that will include the most recently dispatched result as lastDispatchResult:

    const popupResultCallback = (payload) => {
    if (payload.result === 'clicked') {
    if (payload.data.topic === 'color-changed') {
    // do something like
    // setColor(payload.data.value);
    }
    }
    };

    await fin.me.showPopupWindow({
    initialOptions: {
    frame: false
    },
    url: '<my_popup_url>',
    resultDispatchBehavior: 'none',
    blurBehavior: 'close',
    focus: true,
    height: 300,
    width: 300,
    x: 0,
    y: 0,
    onPopupResult: popupResultCallback
    });

    Same as above but using an existing window as a popup:

    const popupResultCallback = (payload) => {
    if (payload.result === 'clicked') {
    if (payload.data.topic === 'color-changed') {
    // do something like
    // setColor(payload.data.value);
    }
    }
    };

    await fin.me.showPopupWindow({
    initialOptions: {
    frame: false
    },
    name: 'my-popup', // shows the 'my-popup' window if it exists, otherwise creates it
    url: '<my_popup_url>', // navigates to this url if it doesn't match the location.href of the 'my-popup' window
    resultDispatchBehavior: 'none',
    blurBehavior: 'hide',
    focus: true,
    hideOnClose: true, // we can just use this or we can change blurBehavior to 'hide'
    height: 300,
    width: 300,
    x: 0,
    y: 0,
    onPopupResult: popupResultCallback
    });

    Create or show a popup window that disables user movement (positioning and resizing) in the caller view's parent window by using blurBehavior: 'modal':

    const result = await fin.me.showPopupWindow({
    initialOptions: {
    frame: false
    },
    url: '<my_popup_url>',
    resultDispatchBehavior: 'close',
    blurBehavior: 'modal',
    focus: true,
    height: 300,
    width: 300,
    x: 0,
    y: 0
    });

    Create a popup window as a modal:

    Note: The only way to ensure true modal behavior is to create the window being shown as a popup with a modalParentIdentity that uses the caller view's parent window identity.

    const result = await fin.me.showPopupWindow({
    initialOptions: {
    frame: false,
    modalParentIdentity: fin.me.identity
    },
    url: '<my_popup_url>',
    resultDispatchBehavior: 'close',
    blurBehavior: 'modal',
    focus: true,
    height: 300,
    width: 300,
    x: 0,
    y: 0
    });

    Pass data to a popup window that is available when the popup is shown.

    Note: this is just one example for a use of additionalOptions, it can be used to update any updatable window options when creating or showing an existing window as a popup.

    const result = await fin.me.showPopupWindow({
    additionalOptions: {
    customData: {
    foo: 'bar'
    }
    },
    url: '<my_popup_url>',
    resultDispatchBehavior: 'close',
    blurBehavior: 'close',
    focus: true,
    height: 300,
    width: 300,
    x: 0,
    y: 0
    });

    // Access from the popup window context like so:
    const { customData } = await fin.me.getOptions();
    const { foo } = customData;

    Execute a callback on the popup's OpenFin window when the popup is shown:

    const popupWindowCallback = async (win) => {
    await win.flash();
    };

    const result = await fin.me.showPopupWindow({
    url: '<my_popup_url>',
    resultDispatchBehavior: 'close',
    blurBehavior: 'close',
    focus: true,
    height: 300,
    width: 300,
    x: 0,
    y: 0,
    onPopupReady: popupWindowCallback;
    });

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Stop a findInPage call by specifying any of these actions:

    • clearSelection - Clear the selection.
    • keepSelection - Translate the selection into a normal selection.
    • activateSelection - Focus and click the selection node.

    Parameters

    • action: string

    Returns Promise<void>

    Example

    View:

    const view = fin.View.getCurrentSync();

    view.addListener('found-in-page', (event) => {
    setTimeout(() => {
    view.stopFindInPage('clearSelection');
    }, 5000);
    });

    view.findInPage('a').then(results => {
    console.log(results);
    });

    Window:

    const win = fin.Window.getCurrentSync();

    win.addListener('found-in-page', (event) => {
    setTimeout(() => {
    win.stopFindInPage('clearSelection');
    }, 5000);
    });

    win.findInPage('a').then(results => {
    console.log(results);
    });

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Stops the taskbar icon from flashing.

    Returns Promise<void>

    Example

    async function stopWindowFlashing() {
    const app = await fin.Application.start({
    name: 'myApp',
    uuid: 'app-1',
    url: 'https://cdn.openfin.co/docs/javascript/stable/tutorial-Window.stopFlashing.html',
    autoShow: true
    });
    const win = await app.getWindow();
    return await win.stopFlashing();
    }

    stopWindowFlashing().then(() => console.log('Application window flashing')).catch(err => console.log(err));
  • Stops any current navigation the WebContents is performing.

    Returns Promise<void>

    Example

    View:

    async function stopNavigation() {
    const view = await fin.View.wrap({ name: 'testapp-view', uuid: 'testapp' });
    await view.navigate('https://www.google.com');
    return await view.stopNavigation();
    }
    stopNavigation().then(() => console.log('you shall not navigate')).catch(err => console.log(err));

    Window:

    async function stopNavigation() {
    const win = await fin.Window.wrap({ name: 'testapp', uuid: 'testapp' });
    await win.navigate('https://www.google.com');
    return await win.stopNavigation();
    }
    stopNavigation().then(() => console.log('you shall not navigate')).catch(err => console.log(err));

    Remarks

    WebContents refers to shared functionality between Window and View. We do not expose an explicit superclass for this functionality, but it does have its own event namespace.

  • Updates the window using the passed options.

    Parameters

    • options: Partial<MutableWindowOptions>

      Changes a window's options that were defined upon creation. See tutorial

    Returns Promise<void>

    Remarks

    Values that are objects are deep-merged, overwriting only the values that are provided.

    Example

    async function updateOptions() {
    const win = await fin.Window.getCurrent();
    return win.updateOptions({maxWidth: 100});
    }
    updateOptions().then(() => console.log('options is updated')).catch(err => console.error(err));