How can I share local storage, IndexedDb, Session storage between BrowserWindows ?

[ari62]

Describe the bug I haven't been able to figure out how to share the data in the various storage mechanisms between the main window and new browser windows I create from clicking on tray menu options. I have tried using "parent", "session" and "partition" on the BrowserWindow Objects I create. For example:

const trayWindow: BrowserWindow = new BrowserWindow({
            backgroundColor: '#FFF',
            width: 300,
            height: 150,
            show: false,
            frame: false,
            fullscreenable: false,
            resizable: true,
            //parent: this.mainWindow,
            webPreferences: {
                //partition: 'persist:myapp', 
                session: mySession,  // tried with/without
                nativeWindowOpen: true, //tried both true/false
                devTools: isDevMode,
                enableRemoteModule: true, 
                nodeIntegration: true, //tried both true/false
                preload: path.join(app.getAppPath(), "preloader.js"),

             }
        });

Where mySession is an object set as the session object in the main window's config or retrieved through this.mainWindow.webContents.session. Neither way seemed to help. Using partition: 'persist:myapp', gives this error, but because setting session doesn't help I don't think that would help anyway:

(node:74976) UnhandledPromiseRejectionWarning: Error: ERR_FAILED (-2) loading 'capacitor-electron://-' at rejectAndCleanup (electron/js2c/browser_init.js:205:1493) at Object.stopLoadingListener (electron/js2c/browser_init.js:205:1868) at Object.emit (events.js:315:20) (node:74976) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag--unhandled-rejections=strict(see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1) (node:74976) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

To Reproduce Steps to reproduce the behavior:

Create an electron-capacitor app and main window:

   const mySession: Session = session.fromPartition("persist:myapp");
const config: CapacitorElectronConfig = this.createCapacitorElectronConfig(mySession);
        this.capacitorApp = createCapacitorElectronApp(config);
        this.capacitorApp.init();

    private createCapacitorElectronConfig(mySession: Session): CapacitorElectronConfig {

        const menuItems: MenuItem[] = this.makeMenuItems();

        //https://capacitor-community.github.io/electron/#/./config-options/index
        const config: CapacitorElectronConfig = {
            trayMenu: {
                useTrayMenu: true,
                trayIconPath: TrayGenerator.makeIconPath(),
               trayContextMenu: menuItems
            },

            mainWindow: {
                windowOptions: {
                    height: 920,
                    width: 1600,
                    show: true,
                    webPreferences: {
                        session: mySession,
                        //partition: 'persist:myapp',
                        nativeWindowOpen: true,
                        enableRemoteModule: true,
                        nodeIntegration: true,   
                        },
                }
            }
        };
        return config;
    }

I tried making the Tray through the above config as well as making the tray object separately.

Create another window as above "trayWindow" is created and load a url :
const loadPromise: Promise<void> = trayWindow.loadURL(trayUrl);

Expected behavior The main window's local storage, session storage and indexedDb storage is shared with other windows created in the app.

Screenshots Notice the main window uses the capacitor-electron:// schema in the following screenshot:

However the other browser windows created use the file:// schema:

The IndexedDb is different regardless.

Desktop (please complete the following information):

• OS: MacOs High Sierra 10.13.6
• Browser: Electron
• Version

  "electron": "^11.0.1",
  "@capacitor-community/electron": "^1.3.1"

Additional context I am not writing to IndexedDb directly, but am rather using AngularFire and AngularFireAuth in the renderer process, so I can't grab the data in the main process and pass it to the various windows without significant alterations. I don't want to login again in a new browser window when I open a window from the tray if I have already logged in to the main window. The login info is stored in IndexedDB, as show in the screenshots. This seems to be related to this stackoverflow question : sharing indexdDb

However because of the different schemas ("capacitor-electron://" vs "file://" )in my use case I am posting it here as well.

[IT-MikeS]

Do you need this second window to be loaded with the file scheme or could it be done with the capacitor-electron scheme?

If the latter is true, sounds like I need to add a CreateWindow type method for people to use.

[ari62]

I don't have a preference for the scheme, I was just pointing out that one window uses one file and another uses capacitor-electron.

[ari62]

Not sure if a new method is needed. I think using "partition" or "session" in the webPreferences section should work to share session info, but it doesn't seem to when the config is passed to createCapacitorElectronApp .