[BUG] Electron - race condition when evaluating multiple BrowserWindows

Context:

## System:
 - OS: Windows 10 10.0.19042
 - Memory: 16.79 GB / 31.91 GB
## Binaries:
 - Node: 14.16.1 - C:\Program Files\nodejs\node.EXE
 - Yarn: 1.19.1 - D:\Program Files (x86)\Yarn\bin\yarn.CMD
 - npm: 7.11.2 - C:\Program Files\nodejs\npm.CMD
## Languages:
 - Bash: 4.4.23 - C:\Program Files\Git\usr\bin\bash.EXE
## npmPackages:
 - playwright: ^1.11.1 => 1.11.1

Code Snippet

I wrote an example Electron application demonstrating the issue using Electron Fiddle: https://gist.github.com/38f12167513796435d2012df6dc2e8d0

The important snippet from the gist is in renderer.js:

window.open('https://www.electronjs.org', 'firstWindow')
window.open('https://github.com/electron/electron', 'secondWindow')

const path = require('path');
const { _electron: electron } = require('playwright');

(async () => {
  const app = await electron.launch({
    args: ['/path/to/saved/electron/fiddle'],
  });

  app.on('window', async page => {
    const browserWindowHandle = await app.browserWindow(page);

    const frameName = await browserWindowHandle.evaluate(
      browserWindow => browserWindow.webContents.mainFrame.name,
    );

    console.log(
      `app 'window' event [frameName:${frameName}, playwrightFrameName:${page.mainFrame().name()}, url:${page.url()}]`,
    );
  });
})();

Describe the bug

The Electron Fiddle gist linked above opens a new BrowserWindow with a button that opens two other BrowserWindows. Each of the BrowserWindows opened have their own, unique frame name and URL.

Running the test and clicking the button demonstrates some issues:

• page.mainFrame().name() never reads the actual frame name of the Electron BrowserWindow.
• The frame name received from evaluating the browserWindowHandle doesn’t always match the expected page.url().
  • Potential race condition?

Here’s an example of output I’ve seen from running this.

$ node test.js 
app 'window' event [frameName:firstWindow, playwrightFrameName:, url:https://www.electronjs.org/]
app 'window' event [frameName:secondWindow, playwrightFrameName:, url:https://github.com/electron/electron]
app 'window' event [frameName:firstWindow, playwrightFrameName:, url:https://www.electronjs.org/]
app 'window' event [frameName:secondWindow, playwrightFrameName:, url:https://github.com/electron/electron]
app 'window' event [frameName:firstWindow, playwrightFrameName:, url:https://github.com/electron/electron]
app 'window' event [frameName:secondWindow, playwrightFrameName:, url:https://www.electronjs.org/]

Notice the last two console messages in which frameName doesn’t match the expected url.

[ggreco]

Any progress or workaround that do not involve delaying window creation on this? It’s a huge stopper for any complex electron application.

[samuelmaddock]

I tried implementing some workarounds, but didn’t have much luck.

I attempted to add an async/await mutex around the following snippet with no luck. It seems that avoiding concurrency of evaluating BrowserWindows doesn’t have an effect.

const browserWindowHandle = await app.browserWindow(page);

const frameName = await browserWindowHandle.evaluate(
  browserWindow => browserWindow.webContents.mainFrame.name,
);

Adding significant delays (>200ms) between calls to window.open() does appear to fix the issue however. This is difficult to enforce in complex applications though.