Send a Message to Window after React has loaded


#1

In the app I am building, there are two windows - Main and Details. When you click on an item in the Main window, a new Details window is created which then loads a react app. Depending upon which button was clicked in the Main window, the UI of the Details window will change.

To achieve this, I pass a parameter details-screen-mode from the main process to the renderer process of details window as follows:

 detailsWindow.webContents.on('dom-ready', () => {
      detailsWindow.webContents.send('details-screen-mode', arg);
    });

The problem with this approach was that frequently, this parameter was sent before the react app was ready. Thus I ended up with a weird state in my react app.

To overcome this, I did the following.

 detailsWindow.webContents.on('dom-ready', () => {
      detailsWindow.webContents.findInPage('Data Loading',{});
    });

    detailsWindow.webContents.on('found-in-page', (evt, result) => {
      if (result.finalUpdate) {
        detailsWindow.webContents.send('details-screen-mode', arg);
        detailsWindow.webContents.stopFindInPage('clearSelection');
      }
    });

In my react-app I added a default state, where the UI shows ‘Data Loading…’. If the UI is showing this then that means React app has loaded and I can send the details-screen-mode param. which is what I do. However, despite this whenever a new detailsWindow is created, this doesn’t work intermittently.

I was wondering what is the best way to achieve sending a message to detailsWindow after react has loaded.