title: getting multiple windows in electronJS which has the same browserwindow instance to display different results
body: <p>I am trying to send data from a main window to multiple windows in electronJS.</p>
  <p>How my app works is there is a main window with many selections. On clicking each selection, a new window will open, and the window will show data that is related to that selection.</p>
  <p>The problem I am facing is that the data does not persist and keeps getting updated each time I click a new selection.</p>
  <p>For example:</p>
  <p>Main window: selection A,B,C,D</p>
  <p><em>clicks on A</em></p>
  <p>New window 1 pops up, displays data for A</p>
  <p><em>clicks on B</em></p>
  <p>New window 2 pops up, displays data for B. New window 1 displays data for B.</p>
  <p><em>clicks on C</em></p>
  <p>New window 3 pops up, displays data for C. New window 1 &amp; 2 displays data for C.</p>
  <p>I think the issue has got to do with the browserwindow instance, but I'm not quite sure how to fix it, because I won't know how many new windows would be opened. Is there a way to 'freeze' the data at the point in time for each instance?</p>
  <p>I include my code for both my renderers and main.js. Data is passed from renderer(index) to main and then to renderer(instrument)</p>
  <p>main.js</p>
  <pre><code>// main.js
  // Modules to control application life and create native browser window
  const { app, BrowserWindow, ipcMain } = require('electron')
  
  const createWindow = () =&gt; {
    // Create the browser window.
    const mainWindow = new BrowserWindow({
      width: 1000,
      height: 1000,
      webPreferences: {
        contextIsolation: false,
        nodeIntegration: true,
        nodeIntegrationInWorker: true
      }
    })
  
    // and load the index.html of the app.
    mainWindow.loadFile('index.html')
  
    // Open the DevTools.
    mainWindow.webContents.openDevTools()
  }
  
  // This method will be called when Electron has finished
  // initialization and is ready to create browser windows.
  // Some APIs can only be used after this event occurs.
  app.whenReady().then(() =&gt; {
    createWindow()
    ipcMain.on('open-instrument-window', (event, instrument) =&gt; {
      openNewInstrumentWindow()
    })
  
  
    app.on('activate', () =&gt; {
      // On macOS it's common to re-create a window in the app when the
      // dock icon is clicked and there are no other windows open.
      if (BrowserWindow.getAllWindows().length === 0) createWindow()
    })
  })
  
  // Quit when all windows are closed, except on macOS. There, it's common
  // for applications and their menu bar to stay active until the user quits
  // explicitly with Cmd + Q.
  app.on('window-all-closed', () =&gt; {
    if (process.platform !== 'darwin') app.quit()
  })
  
  // In this file you can include the rest of your app's specific main process
  // code. You can also put them in separate files and require them here.
  const openNewInstrumentWindow = () =&gt; {
    const instrumentWindow = new BrowserWindow({
      width: 1000,
      height: 1000,
      title: 'Instrument details',
      webPreferences: {
        contextIsolation: false,
        nodeIntegration: true,
        nodeIntegrationInWorker: true
      }
    })
    instrumentWindow.loadFile('instrument.html')
    instrumentWindow.webContents.openDevTools()
  // this is where the data is send over to the renderer instrument
    ipcMain.on('a', (event, payload) =&gt; {
      instrumentWindow.webContents.send('your-relayed-message', payload);
    });
  }
  </code></pre>
  <p>this is my renderer index code. I have extracted the relevant portion. ipcrenderer is used twice, first to open the new window, second is to send the data over to renderer instrument.</p>
  <pre><code>const searchResults = document.getElementsByClassName('search-result');
          for (let i = 0; i &lt; searchResults.length; i++) {
              searchResults[i].onclick = () =&gt; {
                  ipcRenderer.send('open-instrument-window')
                  ipcRenderer.send('a', instruments[i]);
              }
          }
  </code></pre>
  <p>this is my renderer instrument code.</p>
  <pre><code>const getInstrumentDetail = (exchange) =&gt; {
      axios.get(`http://url${exchange}`)
          .then(response =&gt; {
  
              let instrument = response.data;
              document.getElementById('instrument-name').innerHTML = instrument.name;
          })
  }
  ipcRenderer.on('your-relayed-message', (event, payload) =&gt; {
      getInstrumentDetail(payload['exchange']);
  });
  </code></pre>
  <p>Appreciate any tips or guidance to point me in the right direction.</p>