breaking: remove logic around min supported browsers

cli/CHANGELOG.md

@@ -7,6 +7,7 @@ _Released 12/3/2024 (PENDING)_
 
 - Removed support for Node.js 16 and Node.js 21. Addresses [#29930](https://github.com/cypress-io/cypress/issues/29930).
 - Prebuilt binaries for Linux are no longer compatible with Linux distributions based on glibc <2.28, for example: Ubuntu 14-18, RHEL 7, CentOS 7, Amazon Linux 2. Addresses [#29601](https://github.com/cypress-io/cypress/issues/29601).
+- Cypress now only officially supports the latest 3 major versions of Chrome, Firefox, and Edge - older browser versions may still work, but we recommend keeping your browsers up to date to ensure compatibility with Cypress. A warning will no longer be displayed on browser selection in the Launchpad for any 'unsupported' browser versions. Additionally, the undocumented `minSupportedVersion` and `unsupportedVersion` properties have been removed from `Cypress.browser`. Addressed in [#30462](https://github.com/cypress-io/cypress/pull/30462).
 - We removed yielding the second argument of `before:browser:launch` as an array of browser arguments. This behavior has been deprecated since Cypress 4.0.0. Addressed in [#30460](https://github.com/cypress-io/cypress/pull/30460).
 - The `cypress open-ct` and `cypress run-ct` CLI commands were removed. Please use `cypress open --component` or `cypress run --component` respectively instead. Addressed in [#30456](https://github.com/cypress-io/cypress/pull/30456)
 - The undocumented methods `Cypress.backend('firefox:force:gc')` and `Cypress.backend('log:memory:pressure')` were removed. Addresses [#30222](https://github.com/cypress-io/cypress/issues/30222).

cli/types/cypress.d.ts

@@ -117,14 +117,6 @@ declare namespace Cypress {
      * Warning text to accompany this browser. Shown in desktop-gui.
      */
     warning?: string
-    /**
-     * The minimum majorVersion of this browser supported by Cypress.
-     */
-    minSupportedVersion?: number
-    /**
-     * If `true`, this browser is too old to be supported by Cypress.
-     */
-    unsupportedVersion?: boolean
   }
 
   /**

packages/app/src/settings/project/ConfigCode.cy.tsx

@@ -190,7 +190,6 @@ describe('<ConfigCode />', () => {
           browser.displayName && cy.contains(`displayName: '${browser.displayName}',`)
           browser.version && cy.contains(`version: '${browser.version}',`)
           browser.path && cy.contains(`path: '${browser.path}',`)
-          browser.minSupportedVersion && cy.contains(`minSupportedVersion: ${browser.minSupportedVersion},`)
           browser.majorVersion && cy.contains(`majorVersion: ${browser.majorVersion},`)
         })
       } else {

packages/data-context/src/sources/BrowserDataSource.ts

@@ -127,8 +127,4 @@ export class BrowserDataSource {
 
     return false
   }
-
-  isVersionSupported (obj: FoundBrowser) {
-    return Boolean(!obj.unsupportedVersion)
-  }
 }

packages/errors/src/errors.ts

@@ -1416,9 +1416,6 @@ export const AllCypressErrors = {
 
         https://on.cypress.io/component-testing`
   },
-  UNSUPPORTED_BROWSER_VERSION: (errorMsg: string) => {
-    return errTemplate`${fmt.off(errorMsg)}`
-  },
 
   // V10 Added:
 

packages/errors/test/unit/visualSnapshotErrors_spec.ts

@@ -1232,11 +1232,6 @@ describe('visual error templates', () => {
         plural: [['foo', 'bar']],
       }
     },
-    UNSUPPORTED_BROWSER_VERSION: () => {
-      return {
-        default: [`Cypress does not support running chrome version 64. To use chrome with Cypress, install a version of chrome newer than or equal to 64.`],
-      }
-    },
     MULTIPLE_SUPPORT_FILES_FOUND: () => {
       return {
         default: ['spec.{ts,js}', ['support.ts', 'support.js']],

packages/frontend-shared/cypress/fixtures/config.json

@@ -23,7 +23,6 @@
         "displayName": "Chrome",
         "version": "97.0.4692.71",
         "path": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
-        "minSupportedVersion": 64,
         "majorVersion": 97
       },
       {
@@ -33,7 +32,6 @@
         "displayName": "Firefox",
         "version": "95.0.2",
         "path": "/Applications/Firefox.app/Contents/MacOS/firefox",
-        "minSupportedVersion": 86,
         "majorVersion": 95
       },
       {

packages/frontend-shared/cypress/support/mock-graphql/longBrowsersList.ts

@@ -10,7 +10,6 @@ export const longBrowsersList = [
     majorVersion: '73',
     info: 'Info about electron browser',
     isFocusSupported: true,
-    isVersionSupported: true,
     disabled: false,
   },
   {
@@ -23,7 +22,6 @@ export const longBrowsersList = [
     path: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',
     majorVersion: '78',
     isFocusSupported: true,
-    isVersionSupported: true,
     disabled: false,
   },
   {
@@ -36,7 +34,6 @@ export const longBrowsersList = [
     path: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',
     majorVersion: '88',
     isFocusSupported: true,
-    isVersionSupported: true,
     disabled: false,
   },
   {
@@ -49,7 +46,6 @@ export const longBrowsersList = [
     path: '/Applications/Google Chrome Canary.app/Contents/MacOS/Google Chrome Canary',
     majorVersion: '80',
     isFocusSupported: true,
-    isVersionSupported: true,
     disabled: false,
   },
   {
@@ -62,7 +58,6 @@ export const longBrowsersList = [
     path: '/Applications/Chromium.app/Contents/MacOS/Chromium',
     majorVersion: '74',
     isFocusSupported: true,
-    isVersionSupported: true,
     disabled: false,
   },
   {
@@ -75,7 +70,6 @@ export const longBrowsersList = [
     path: '/Applications/Chromium.app/Contents/MacOS/Chromium',
     majorVersion: '85',
     isFocusSupported: true,
-    isVersionSupported: true,
     disabled: false,
   },
   {
@@ -84,11 +78,10 @@ export const longBrowsersList = [
     displayName: 'Edge Beta',
     family: 'chromium',
     channel: 'beta',
-    version: 'unsupported',
+    version: '85.0.309.71',
     path: '/Applications/Microsoft Edge Beta.app/Contents/MacOS/Microsoft Edge Beta',
-    majorVersion: '79',
+    majorVersion: '85',
     isFocusSupported: true,
-    isVersionSupported: false,
     disabled: false,
   },
   {
@@ -101,7 +94,6 @@ export const longBrowsersList = [
     path: '/Applications/Microsoft Edge Canary.app/Contents/MacOS/Microsoft Edge Canary',
     majorVersion: '79',
     isFocusSupported: true,
-    isVersionSupported: true,
     disabled: false,
   },
   {
@@ -114,7 +106,6 @@ export const longBrowsersList = [
     path: '/Applications/Microsoft Edge Dev.app/Contents/MacOS/Microsoft Edge Dev',
     majorVersion: '79',
     isFocusSupported: true,
-    isVersionSupported: true,
     disabled: false,
   },
   {
@@ -126,9 +117,7 @@ export const longBrowsersList = [
     version: '69.0.1',
     path: '/Applications/Firefox/Contents/MacOS/Firefox',
     majorVersion: '69',
-    unsupportedVersion: true,
     isFocusSupported: true,
-    isVersionSupported: false,
     disabled: true,
   },
   {
@@ -140,9 +129,7 @@ export const longBrowsersList = [
     version: '75.0.1',
     path: '/Applications/Firefox/Contents/MacOS/Firefox',
     majorVersion: '75',
-    unsupportedVersion: true,
     isFocusSupported: true,
-    isVersionSupported: false,
     disabled: true,
   },
   {
@@ -155,9 +142,7 @@ export const longBrowsersList = [
     path: '/Applications/Firefox Developer/Contents/MacOS/Firefox Developer',
     majorVersion: '69',
     isFocusSupported: true,
-    isVersionSupported: false,
     disabled: true,
-    warning: 'Cypress does not support running Firefox Developer Edition version 69. To use Firefox Developer Edition with Cypress, install a version of Firefox Developer Edition newer than or equal to 78.',
   },
   {
     id: '13',
@@ -169,7 +154,6 @@ export const longBrowsersList = [
     path: '/Applications/Firefox Nightly/Contents/MacOS/Firefox Nightly',
     majorVersion: '69',
     isFocusSupported: false,
-    isVersionSupported: false,
     disabled: true,
   },
   {
@@ -182,7 +166,6 @@ export const longBrowsersList = [
     path: '/Applications/Fake Browser/Contents/MacOS/Fake Browser',
     majorVersion: '79',
     isFocusSupported: false,
-    isVersionSupported: false,
     disabled: true,
   },
 ] as const

packages/frontend-shared/src/gql-components/HeaderBarContent.cy.tsx

@@ -34,30 +34,9 @@ describe('<HeaderBarContent />', { viewportWidth: 1000, viewportHeight: 750 }, (
     cy.contains('Edge Canary')
     .should('be.visible')
     .closest('[data-cy="top-nav-browser-list-item"]')
-    .within(() => {
-      cy.findByTestId('unsupported-browser-tooltip-trigger')
-      .should('not.exist')
-    })
 
     cy.get('[data-cy="top-nav-browser-list-item"]').parent()
     .should('have.class', 'overflow-auto')
-
-    cy.contains('(Unsupported)')
-    .scrollIntoView()
-    .should('be.visible')
-    .closest('[data-cy="top-nav-browser-list-item"]')
-    .within(() => {
-      cy.findByTestId('unsupported-browser-tooltip-trigger')
-      .should('exist')
-      .trigger('mouseenter')
-    })
-
-    cy.contains('Unsupported browser').should('be.visible')
-
-    /*
-      TODO: fix flaky test https://github.com/cypress-io/cypress/issues/23436
-      cy.percySnapshot('unsupported browser tooltip')
-    */
   })
 
   describe('breadcrumbs', () => {

packages/frontend-shared/src/gql-components/topnav/VerticalBrowserListItems.vue

@@ -6,9 +6,9 @@
       class="border-b border-transparent cursor-pointer flex border-b-gray-50 border-[1px] min-w-[240px] py-[12px] px-[16px] transition-colors duration-300 group focus-within-default"
       :class="{
         'bg-jade-50': browser.isSelected,
-        'hover:bg-indigo-50 focus-within:bg-indigo-50': !browser.isSelected && !browser.disabled && browser.isVersionSupported,
-        'bg-gray-50 cursor-not-allowed': browser.disabled || !browser.isVersionSupported,
-        'cursor-pointer': !browser.disabled && browser.isVersionSupported
+        'hover:bg-indigo-50 focus-within:bg-indigo-50': !browser.isSelected && !browser.disabled,
+        'bg-gray-50 cursor-not-allowed': browser.disabled,
+        'cursor-pointer': !browser.disabled
       }"
       data-cy="top-nav-browser-list-item"
 
@@ -17,7 +17,7 @@
     >
       <img
         class="mr-[16px] min-w-[26px] w-[26px]"
-        :class="{ 'filter grayscale': browser.disabled || !browser.isVersionSupported }"
+        :class="{ 'filter grayscale': browser.disabled }"
         :src="allBrowsersIcons[browser.displayName] || allBrowsersIcons.generic"
         alt=""
       >
@@ -26,9 +26,9 @@
           <button
             class="font-medium box-border focus:outline-none"
             :class="{
-              'text-indigo-500 group-hover:text-indigo-700': !browser.isSelected && !browser.disabled && browser.isVersionSupported,
+              'text-indigo-500 group-hover:text-indigo-700': !browser.isSelected && !browser.disabled,
               'text-jade-700': browser.isSelected,
-              'text-gray-500': browser.disabled || !browser.isVersionSupported
+              'text-gray-500': browser.disabled
             }"
           >
             {{ browser.displayName }}
@@ -39,9 +39,6 @@
             "
           >
             {{ t('topNav.version') }} {{ browser.majorVersion }}
-            <span v-if="browser.version === 'unsupported'">
-              ({{ t('topNav.versionUnsupported') }})
-            </span>
           </div>
         </div>
       </div>
@@ -56,24 +53,6 @@
               <i-cy-circle-check_x24 class="h-[24px] w-[24px] icon-dark-jade-100 icon-light-jade-500" />
             </div>
           </template>
-          <template v-else-if="!browser.isVersionSupported">
-            <div class="h-[16px] relative">
-              <Tooltip>
-                <i-cy-circle-bg-question-mark_x16
-                  class="icon-dark-gray-700 icon-light-gray-200"
-                  data-cy="unsupported-browser-tooltip-trigger"
-                />
-                <template #popper>
-                  <div class="text-center p-2 text-gray-300 text-[14px] leading-[20px]">
-                    <div class="font-medium text-white mb-2">
-                      Unsupported browser
-                    </div>
-                    {{ browser.warning }}
-                  </div>
-                </template>
-              </Tooltip>
-            </div>
-          </template>
         </div>
       </div>
     </li>
@@ -86,7 +65,6 @@ import type { VerticalBrowserListItemsFragment } from '../../generated/graphql'
 import { computed } from 'vue'
 import { gql, useMutation } from '@urql/vue'
 import { allBrowsersIcons } from '@packages/frontend-shared/src/assets/browserLogos'
-import Tooltip from '../../components/Tooltip.vue'
 
 const { t } = useI18n()
 
@@ -99,7 +77,6 @@ fragment VerticalBrowserListItems on CurrentProject {
     displayName
     version
     majorVersion
-    isVersionSupported
     warning
     disabled
   }
@@ -134,7 +111,7 @@ const browsers = computed(() => {
 const setBrowser = useMutation(VerticalBrowserListItems_SetBrowserDocument)
 
 const handleBrowserChoice = async (browser) => {
-  if (browser.disabled || !browser.isVersionSupported || browser.isSelected) {
+  if (browser.disabled || browser.isSelected) {
     return
   }
 

packages/frontend-shared/src/locales/en-US.json

@@ -316,7 +316,6 @@
   "topNav": {
     "released": "Released",
     "version": "Version",
-    "versionUnsupported": "Unsupported",
     "installed": "Installed",
     "latest": "Latest",
     "seeAllReleases": "See all releases",

packages/graphql/schemas/schema.graphql

@@ -31,7 +31,6 @@ type Browser implements Node {
   id: ID!
   isFocusSupported: Boolean!
   isSelected: Boolean!
-  isVersionSupported: Boolean!
   majorVersion: String
   name: String!
   path: String!
@@ -1258,7 +1257,6 @@ enum ErrorTypeEnum {
   UNEXPECTED_BEFORE_BROWSER_LAUNCH_PROPERTIES
   UNEXPECTED_INTERNAL_ERROR
   UNEXPECTED_MUTATION_ERROR
-  UNSUPPORTED_BROWSER_VERSION
   VIDEO_CAPTURE_FAILED
   VIDEO_COMPRESSION_FAILED
   VIDEO_RECORDING_FAILED