Cypress: Make sending browser flags to the electron browser more intuitive

[rsudarson]

How to pass chrome flags to electron chromium browser. I need to pass auth-server-whitelist flag to electron.

[jennifer-shehane]

You should be able to use use our plugins api to hook into 'before:browser:launch' to pass the flags through there. Docs -> https://on.cypress.io/browser-launch-api

[rsudarson]

@jennifer-shehane : In before:browser:launch function, in case of chrome args are received as an array.
For electron browser it is received as object. I don't know how to pass the necessary flags.
Can you give an example for electron.

[jennifer-shehane]

Yeah, looking into this further, I'm not sure that you can send electron flags in this way and we would need to update Cypress to allow this.

Electron Command Line Switches: https://electronjs.org/docs/all#supported-chrome-command-line-switches
Cypress itself sending command line switches in repo: https://github.com/cypress-io/cypress/blob/develop/packages/server/lib/environment.coffee#L20

[rsudarson]

@jennifer-shehane Is this supported ? Please share details on how to pass it from test framework.
I need to pass --auth-server-whitelist to run my tests.

[als9xd]

In case anyone else is looking to just disable CORs for electron the following worked for me.

on('before:browser:launch', (browser = {}, args) => {
  if (browser.name === 'electron') {
    args.chromeWebSecurity = false;
    args.webPreferences.chromeWebSecurity = false;
    return args;
  }
})

[brian-mann]

You can do both - you can use Electron specific environment variables to launch via cypress run or you can use before:browser:launch to modify the renderer options passed into electron at runtime.

@als9xd what you pasted works, but its not necessary because we already support the chromeWebSecurity: false option in cypress.json which does this under the hood.

[brian-mann]

Flags are the same thing as Chromium switches - which must be passed as environment variables to the process when launching it.

However the before:browser:launch is what you need to use to modify runtime options that get passed to the Electron renderer process.

Some things only exist as options, some things only exist as switches/flags, and some things can be passed as either.

[rsudarson]

Please fix this issue, this would help testing a lot.

[mabedan]

👍
Also useful to turn off --disable-gpu while running inside docker container...

[mabedan]

You can do both - you can use Electron specific environment variables to launch via cypress run or you can use before:browser:launch to modify the renderer options passed into electron at runtime.

@als9xd what you pasted works, but its not necessary because we already support the chromeWebSecurity: false option in cypress.json which does this under the hood.

Can you please give an example of how to pass a flag to Electron, via environment variable? or how to change the runtime options via before:browser:launch please?

[rsudarson]

@jennifer-shehane - Any update in passing flags to electron. Please fix this bug earlier

[jennifer-shehane]

Yes, this issue has caused some confusion overall involving the Electron flags - including for me.

Browser flags do work for Electron, but they are passed differently and are also limited to Electron's options.

args may be an array or an object (based on the type of browser we're launching). Whatever you return from this event will become the new args for launching the browser.

Here are options for the currently supported browsers:

• Chrome
• Electron

Here is an example of starting Cypress in fullscreen when run in both Chrome and Electron.

module.exports = (on, config) => {
  on('before:browser:launch', (browser = {}, args) => {
    if (browser.name === 'chrome') {
      args.push('--start-fullscreen')
      // whatever you return here becomes the new args
      return args
    }

    if (browser.name === 'electron') {
      args['fullscreen'] = true 
      // whatever you return here becomes the new args
      return args
    }
  })
}

[rsudarson]

@jennifer-shehane I've passed the args as below, it didn't work in electron

 if (browser.name === 'electron') {
         args['auth-server-whitelist'] = '*.example.com';
   }

In resources/app/packages/server/lib/environment.js, I've added the auth-server-whitelist flag, then my application is accessible.

try {
    app = require("electron").app;
    app.commandLine.appendSwitch("disable-renderer-backgrounding", true);
    app.commandLine.appendSwitch("ignore-certificate-errors", true);
    app.commandLine.appendSwitch("use-fake-ui-for-media-stream");
    app.commandLine.appendSwitch("use-fake-device-for-media-stream");
    app.commandLine.appendSwitch("autoplay-policy", "no-user-gesture-required");
    app.commandLine.appendSwitch("auth-server-whitelist", "*.example.com");  // I've added here, this works
    if (os.platform() === "linux") {
      app.disableHardwareAcceleration();
    }
  } catch (error) {}

Can you please let me know what I'm missing?

[jennifer-shehane]

I think it has to do with the order in which these flags are read in. The flags in the "before:browser:launch" may be added too late -- after the appendSwitch has already run. I remember @brian-mann mentioning that not all flags could be read in and work this way - yah?

[rsudarson]

@bahmutov

In #5807, value argument like ''disable-site-isolation-trials" could be appended using app.commandLine.appendArgument.

For some args like --auth-server-whitelist=value, app.commandLine.appendSwitch should be used to pass flags.

I'm still facing the issue even after #5807.

[jennifer-shehane]

The signature for sending 'browser flags' to Electron has changed since Cypress 4.0.0

Please see the updated docs at: https://on.cypress.io/browser-launch-api

3.x.x

module.exports = (on, config) => {
  on('before:browser:launch', (browser = {}, args) => {
    if (browser.name === 'chrome') {
      args.push('--start-fullscreen')
      // whatever you return here becomes the new args
      return args
    }

    if (browser.name === 'electron') {
      args['fullscreen'] = true 
      // whatever you return here becomes the new args
      return args
    }
  })
}

4.x.x

Pass any option to launchOptions.preferences. Available options listed at https://github.com/electron/electron/blob/master/docs/api/browser-window.md#new-browserwindowoptions

module.exports = (on, config) => {
  on('before:browser:launch', (browser = {}, launchOptions) => {
    if (browser.family === 'chromium' && browser.name !== 'electron') {
      launchOptions.args.push('--start-fullscreen')

      return launchOptions
    }

    if (browser.name === 'electron') {
      launchOptions.preferences.fullscreen = true

      return launchOptions
    }
  })
}

We'll be closing this as resolved as we feel this makes more sense sending browser preferences in this manner instead of pretending they are cli type arguments comparable to Chrome CLI flags.

[sahil-ag]

4.x.x

Pass any option to launchOptions.preferences. Available options listed at https://github.com/electron/electron/blob/master/docs/api/browser-window.md#new-browserwindowoptions

module.exports = (on, config) => {
  on('before:browser:launch', (browser = {}, launchOptions) => {
    if (browser.family === 'chromium' && browser.name !== 'electron') {
      launchOptions.args.push('--start-fullscreen')

      return launchOptions
    }

    if (browser.name === 'electron') {
      launchOptions.preferences.fullscreen = true

      return launchOptions
    }
  })
}

We'll be closing this as resolved as we feel this makes more sense sending browser preferences in this manner instead of pretending they are cli type arguments comparable to Chrome CLI flags.

@jennifer-shehane I dont think the required flag - --auth-server-whitelist can be passed via this method. Maybe I missed something here?

[jennifer-shehane]

@sahil-ag It doesn't look like there is a command for that for Electron, but it should be available in Chrome. Not all flags exist in Electron.

[rsudarson]

For electron, ELECTRON_EXTRA_LAUNCH_ARGS=--auth-server-whitelist=*yourdomain.com should work