Support Browser windows with Platform windows

In Workspace v15 or later, you can configure Platform Window objects to run together with Browser Window objects in a single Workspace Platform.

How it works

You can add the workspacePlatform.windowType property to your existing Platform Window definition, with the value set to platform. You can also define a Platform Window entirely with the methods and properties of the Workspace Platform API. See the API reference for BrowserWindowFactory.createWindow.

The workspacePlatform object is a property of the Workspace Platform BrowserCreateWindowRequest interface. You can also set windowType to browser (the default value).

See the API reference for browserInitConfig. Note that the defaultWindowOptions property of this interface takes a BrowserCreateWindowRequest object as its value.

You must first initialize your Workspace Platform with Browser.

How to do it

For more information about platform windows, see Platform API.

1. Initialize your Workspace Platform with Browser explicitly enabled:

   TypeScript

   import * as WorkspacePlatform from '@openfin/workspace-platform';
   
   // initialize Workspace Platform with Browser
   await WorkspacePlatform.init(
     {
       // enable browser without any initial configuration
       // in production you'd more typically pass config details here
       browser: { }
     });
   

2. Create your Platform Window and specify the workspacePlatform.windowType property.

   To work with Platform Windows you create with the Platform API:

   TypeScript

   // define your Platform
   const examplePlatform = fin.Platform.getCurrentSync();
   
   // Create the Platform Window with two Views
   examplePlatform.createWindow(
     {
       layout: 
       {
         content: [
           {
             type: 'stack',
             content: [
               {
                 type: 'component',
                 componentName: 'view',
                 componentState: 
                 {
                   name: 'test_view_1',
                   url: 'https://cdn.openfin.co/docs/javascript/canary/Platform.html'
                 }
               },
               {
                 type: 'component',
                 componentName: 'view',
                 componentState: 
                 {
                   name: 'test_view_2',
                   url: 'https://cdn.openfin.co/docs/javascript/canary/Platform.html'
                 }
               }
             ]
           }
         ]
       }
       // allow the Platform Window to work with Browser Window objects
       workspacePlatform:
       {
         windowType: "platform"
       }
   });
   

   Or you can create Platform Windows entirely with the Workspace Platform API:

   TypeScript

   import * as WorkspacePlatform from '@openfin/workspace-platform';
   
   const examplePlatform = WorkspacePlatform.getCurrentSync();
   
   // Create the Platform Window with two Views
   examplePlatform.createWindow(
     {
       layout: 
       {
         content: [
           {
             type: 'stack',
             content: [
               {
                 type: 'component',
                 componentName: 'view',
                 componentState: 
                 {
                   name: 'test_view_1',
                   url: 'https://cdn.openfin.co/docs/javascript/canary/Platform.html'
                 }
               },
               {
                 type: 'component',
                 componentName: 'view',
                 componentState: 
                 {
                   name: 'test_view_2',
                   url: 'https://cdn.openfin.co/docs/javascript/canary/Platform.html'
                 }
               }
             ]
           }
         ]
       }
       // allow the Platform Window to work with Browser Window objects
       workspacePlatform:
       {
         windowType: "platform"
       }
   });
   

If you set workspacePlatform.windowType to browser in your Platform Window definition, you create a Browser Window that ignores the url property and treats each layout as a Page object.