feat: add "headless" setting for the main 3 browsers (#768)

src/browser/browser.js

@@ -16,7 +16,6 @@ const CUSTOM_SESSION_OPTS = [
     "user",
     "key",
     "region",
-    "headless",
 ];
 
 module.exports = class Browser {

src/browser/new-browser.js

@@ -11,6 +11,25 @@ const logger = require("../utils/logger");
 
 const DEFAULT_PORT = 4444;
 
+const headlessBrowserOptions = {
+    chrome: {
+        capabilityName: "goog:chromeOptions",
+        args: ["headless", "disable-gpu"],
+    },
+    firefox: {
+        capabilityName: "moz:firefoxOptions",
+        args: ["-headless"],
+    },
+    msedge: {
+        capabilityName: "ms:edgeOptions",
+        args: ["--headless"],
+    },
+    edge: {
+        capabilityName: "ms:edgeOptions",
+        args: ["--headless"],
+    },
+};
+
 module.exports = class NewBrowser extends Browser {
     constructor(config, id, version) {
         super(config, id, version);
@@ -72,7 +91,7 @@ module.exports = class NewBrowser extends Browser {
     _getSessionOpts() {
         const config = this._config;
         const gridUri = new URI(config.gridUrl);
-        const capabilities = this.version ? this._extendCapabilitiesByVersion() : config.desiredCapabilities;
+        const capabilities = this._extendCapabilities(config);
 
         const options = {
             protocol: gridUri.protocol(),
@@ -94,6 +113,34 @@ module.exports = class NewBrowser extends Browser {
         return options;
     }
 
+    _extendCapabilities(config) {
+        const capabilitiesExtendedByVersion = this.version
+            ? this._extendCapabilitiesByVersion()
+            : config.desiredCapabilities;
+        const capabilitiesWithAddedHeadless = this._addHeadlessCapability(
+            config.headless,
+            capabilitiesExtendedByVersion,
+        );
+        return capabilitiesWithAddedHeadless;
+    }
+
+    _addHeadlessCapability(headless, capabilities) {
+        if (!headless) {
+            return capabilities;
+        }
+        const capabilitySettings = headlessBrowserOptions[capabilities.browserName];
+        if (!capabilitySettings) {
+            logger.warn(`WARNING: Headless setting is not supported for ${capabilities.browserName} browserName`);
+            return capabilities;
+        }
+        const browserCapabilities = capabilities[capabilitySettings.capabilityName] ?? {};
+        capabilities[capabilitySettings.capabilityName] = {
+            ...browserCapabilities,
+            args: [...(browserCapabilities.args ?? []), ...capabilitySettings.args],
+        };
+        return capabilities;
+    }
+
     _extendCapabilitiesByVersion() {
         const { desiredCapabilities, sessionEnvFlags } = this._config;
         const versionKeyName =

test/src/browser/new-browser.js

@@ -46,6 +46,73 @@ describe("NewBrowser", () => {
             assert.calledWithMatch(webdriverio.remote, { port: 4444 });
         });
 
+        describe("headless setting", () => {
+            it("should generate browser specific settings - chrome", async () => {
+                await mkBrowser_({
+                    headless: true,
+                    desiredCapabilities: { browserName: "chrome" },
+                }).init();
+
+                assert.calledWithMatch(webdriverio.remote, {
+                    capabilities: {
+                        browserName: "chrome",
+                        "goog:chromeOptions": { args: ["headless", "disable-gpu"] },
+                    },
+                });
+            });
+
+            it("should generate browser specific settings - firefox", async () => {
+                await mkBrowser_({
+                    headless: true,
+                    desiredCapabilities: { browserName: "firefox" },
+                }).init();
+
+                assert.calledWithMatch(webdriverio.remote, {
+                    capabilities: {
+                        browserName: "firefox",
+                        "moz:firefoxOptions": { args: ["-headless"] },
+                    },
+                });
+            });
+
+            it("should generate browser specific settings - edge", async () => {
+                await mkBrowser_({
+                    headless: true,
+                    desiredCapabilities: { browserName: "msedge" },
+                }).init();
+
+                assert.calledWithMatch(webdriverio.remote, {
+                    capabilities: { browserName: "msedge", "ms:edgeOptions": { args: ["--headless"] } },
+                });
+            });
+
+            it("not override existing settings", async () => {
+                await mkBrowser_({
+                    headless: true,
+                    desiredCapabilities: {
+                        browserName: "chrome",
+                        "goog:chromeOptions": { args: ["my", "custom", "flags"] },
+                    },
+                }).init();
+
+                assert.calledWithMatch(webdriverio.remote, {
+                    capabilities: {
+                        browserName: "chrome",
+                        "goog:chromeOptions": { args: ["my", "custom", "flags", "headless", "disable-gpu"] },
+                    },
+                });
+            });
+
+            it("should issue a warning for an unsupported browser", async () => {
+                await mkBrowser_({
+                    headless: true,
+                    desiredCapabilities: { browserName: "safari" },
+                }).init();
+
+                assert.calledOnceWith(logger.warn, "WARNING: Headless setting is not supported for safari browserName");
+            });
+        });
+
         describe('should create session with extended "browserVersion" in desiredCapabilities if', () => {
             it("it is already exists in capabilities", async () => {
                 await mkBrowser_(

typings/index.d.ts

@@ -454,6 +454,7 @@ declare namespace Hermione {
         headers: Record<string, string> | null;
 
         system: SystemConfig;
+        headless: boolean | null;
     }
 
     export interface CompareOptsConfig {