fix: update userChrome.css to correctly hide the toolbox in firefox (#…

…30728)

cli/CHANGELOG.md

@@ -6,6 +6,7 @@ _Released 12/17/2024 (PENDING)_
 **Bugfixes:**
 
 - Fixed an issue where targets may hang if `Network.enable` is not implemented for the target. Addresses [#29876](https://github.com/cypress-io/cypress/issues/29876).
+- Updated Firefox `userChrome.css` to correctly hide the toolbox during headless mode. Addresses [#30721](https://github.com/cypress-io/cypress/issues/30721).
 
 ## 13.16.1
 

packages/server/lib/browsers/firefox.ts

@@ -370,7 +370,12 @@ toolbar {
   overflow: hidden !important;
   display: none;
 }
-
+toolbox {
+  height: 0px !important;
+  min-height: 0px !important;
+  overflow: hidden !important;
+  border: none !important;
+}
 `
 
 let browserCriClient: BrowserCriClient | undefined
@@ -560,11 +565,10 @@ export async function open (browser: Browser, url: string, options: BrowserLaunc
   }
 
   // resolution of exactly 1280x720
-  // (height must account for firefox url bar, which we can only shrink to 2px)
   const BROWSER_ENVS = {
     MOZ_REMOTE_SETTINGS_DEVTOOLS: '1',
     MOZ_HEADLESS_WIDTH: '1280',
-    MOZ_HEADLESS_HEIGHT: '722',
+    MOZ_HEADLESS_HEIGHT: '720',
     ...launchOptions.env,
   }
 

packages/server/test/unit/browsers/firefox_spec.ts

@@ -274,7 +274,7 @@ describe('lib/browsers/firefox', () => {
                 env: {
                   MOZ_REMOTE_SETTINGS_DEVTOOLS: '1',
                   MOZ_HEADLESS_WIDTH: '1280',
-                  MOZ_HEADLESS_HEIGHT: '722',
+                  MOZ_HEADLESS_HEIGHT: '720',
                 },
               }),
               jsdebugger: false,
@@ -339,7 +339,7 @@ describe('lib/browsers/firefox', () => {
                   env: {
                     MOZ_REMOTE_SETTINGS_DEVTOOLS: '1',
                     MOZ_HEADLESS_WIDTH: '1280',
-                    MOZ_HEADLESS_HEIGHT: '722',
+                    MOZ_HEADLESS_HEIGHT: '720',
                   },
                 }),
                 jsdebugger: true,

system-tests/lib/normalizeStdout.ts

@@ -180,25 +180,6 @@ export const normalizeStdout = function (str: string, options: any = {}) {
     str = str.split('\n').filter((line) => !line.includes(wdsFailedMsg)).join('\n')
   }
 
-  // in Firefox 130, height dimensions are off by 1 pixel in CI, so we need to fix the offset to match common snapshots
-  if (options.browser === 'firefox' && process.env.CI) {
-    const dimensionRegex = new RegExp(/(\((?<width>\d+)x(?<height>\d+)\))/g)
-
-    const matches = dimensionRegex.exec(str)
-
-    if (matches?.groups?.height && matches?.groups?.width) {
-      const height = parseInt(matches?.groups?.height)
-
-      // only happens on default height for whatever reason in firefox 130...
-      if (height === 719) {
-        const expectedHeight = height + 1
-        const expectedWidth = matches?.groups?.width
-
-        str = str.replaceAll(`(${expectedWidth}x${height})`, `(${expectedWidth}x${expectedHeight})`)
-      }
-    }
-  }
-
   if (options.sanitizeScreenshotDimensions) {
     // screenshot dimensions
     str = str.replace(/(\(\d+x\d+\))/g, replaceScreenshotDims)

system-tests/lib/pluginUtils.js

@@ -3,12 +3,7 @@ module.exports = {
     if (config.env['NO_RESIZE']) return
 
     if (browser.family === 'firefox') {
-      // this is needed to ensure correct error screenshot / video recording
-      // resolution of exactly 1280x720
-      // (height must account for firefox url bar, which we can only shrink to 2px)
-      options.args.push(
-        '-width', '1280', '-height', '722',
-      )
+      options.args.push('-width', '1280', '-height', '720')
     } else if (browser.name === 'electron') {
       options.preferences.width = 1280
       options.preferences.height = 720