chore: merge develop into release/15.0.0

.circleci/workflows.yml

@@ -1,7 +1,7 @@
 version: 2.1
 
-chrome-stable-version: &chrome-stable-version "135.0.7049.52"
-chrome-beta-version: &chrome-beta-version "136.0.7103.17"
+chrome-stable-version: &chrome-stable-version "135.0.7049.84"
+chrome-beta-version: &chrome-beta-version "136.0.7103.25"
 firefox-stable-version: &firefox-stable-version "137.0"
 
 orbs:
@@ -38,7 +38,7 @@ mainBuildFilters: &mainBuildFilters
         - /^release\/\d+\.\d+\.\d+$/
         # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
         - 'update-v8-snapshot-cache-on-develop'
-        - 'chore/fix_react_18_deprecation_warnings'
+        - 'chore/update_mobx_decoratorless'
 
 # usually we don't build Mac app - it takes a long time
 # but sometimes we want to really confirm we are doing the right thing
@@ -49,7 +49,7 @@ macWorkflowFilters: &darwin-workflow-filters
       - equal: [ develop, << pipeline.git.branch >> ]
       # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
       - equal: [ 'update-v8-snapshot-cache-on-develop', << pipeline.git.branch >> ]
-      - equal: [ 'chore/fix_react_18_deprecation_warnings', << pipeline.git.branch >> ]
+      - equal: [ 'chore/update_mobx_decoratorless', << pipeline.git.branch >> ]
       - matches:
           pattern: /^release\/\d+\.\d+\.\d+$/
           value: << pipeline.git.branch >>
@@ -60,7 +60,7 @@ linuxArm64WorkflowFilters: &linux-arm64-workflow-filters
       - equal: [ develop, << pipeline.git.branch >> ]
       # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
       - equal: [ 'update-v8-snapshot-cache-on-develop', << pipeline.git.branch >> ]
-      - equal: [ 'chore/fix_react_18_deprecation_warnings', << pipeline.git.branch >> ]
+      - equal: [ 'chore/update_mobx_decoratorless', << pipeline.git.branch >> ]
       - matches:
           pattern: /^release\/\d+\.\d+\.\d+$/
           value: << pipeline.git.branch >>
@@ -83,8 +83,7 @@ windowsWorkflowFilters: &windows-workflow-filters
       - equal: [ develop, << pipeline.git.branch >> ]
       # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
       - equal: [ 'update-v8-snapshot-cache-on-develop', << pipeline.git.branch >> ]
-      - equal: [ 'chore/fix_react_18_deprecation_warnings', << pipeline.git.branch >> ]
-      - equal: [ 'cacie/fix-du', << pipeline.git.branch >> ]
+      - equal: [ 'chore/update_mobx_decoratorless', << pipeline.git.branch >> ]
       - matches:
           pattern: /^release\/\d+\.\d+\.\d+$/
           value: << pipeline.git.branch >>
@@ -158,7 +157,7 @@ commands:
           name: Set environment variable to determine whether or not to persist artifacts
           command: |
             echo "Setting SHOULD_PERSIST_ARTIFACTS variable"
-            echo 'if ! [[ "$CIRCLE_BRANCH" != "develop" && "$CIRCLE_BRANCH" != "release/"* && "$CIRCLE_BRANCH" != "chore/fix_react_18_deprecation_warnings" ]]; then
+            echo 'if ! [[ "$CIRCLE_BRANCH" != "develop" && "$CIRCLE_BRANCH" != "release/"* && "$CIRCLE_BRANCH" != "chore/update_mobx_decoratorless" ]]; then
                 export SHOULD_PERSIST_ARTIFACTS=true
             fi' >> "$BASH_ENV"
   # You must run `setup_should_persist_artifacts` command and be using bash before running this command
@@ -803,7 +802,7 @@ commands:
               if [[ <<parameters.type>> == 'ct' ]]; then
                 # component tests are located side by side with the source codes.
                 # for the app component tests, ignore specs that are known to cause failures on contributor PRs (see https://discuss.circleci.com/t/how-to-exclude-certain-files-from-circleci-test-globbing/41028)
-                TESTFILES=$(find src -regextype posix-extended -name '*.cy.*' -not -regex '.*(FileMatch|PromoAction|SelectorPlayground|useDurationFormat|useTestingType|SpecPatterns).cy.*' | circleci tests split --total=$CIRCLE_NODE_TOTAL)
+                TESTFILES=$(find src -regextype posix-extended -name '*.cy.*' | circleci tests split --total=$CIRCLE_NODE_TOTAL)
               else
                 GLOB="cypress/e2e/**/*cy.*"
                 TESTFILES=$(circleci tests glob "$GLOB" | circleci tests split --total=$CIRCLE_NODE_TOTAL)

.gitignore

@@ -398,4 +398,7 @@ tooling/v8-snapshot/cache/prod-win32
 system-tests/lib/validations
 
 .nx/cache
-.nx/workspace-data
+.nx/workspace-data
+
+# IDE files
+.cursor

cli/CHANGELOG.md

@@ -8,6 +8,14 @@ _Released 07/01/2025 (PENDING)_
 - Removed support for Node.js 18 and Node.js 23. Addresses [#31302](https://github.com/cypress-io/cypress/issues/31302).
 - Removed support for [Chrome DevTools Protocol](https://chromedevtools.github.io/devtools-protocol) with the [firefox](https://www.mozilla.org/) browser. Addresses [#31189](https://github.com/cypress-io/cypress/issues/31189).
 
+## 14.3.1
+
+_Released 4/22/2025 (PENDING)_
+
+**Misc:**
+
+- The UI of the reporter and URL were updated to a darker gray background for better color contrast. Addressed in [#31475](https://github.com/cypress-io/cypress/pull/31475).
+
 ## 14.3.0
 
 _Released 4/8/2025_

packages/app/src/runner/SpecRunnerHeaderOpenMode.vue

@@ -2,15 +2,15 @@
   <div
     id="spec-runner-header"
     ref="autHeaderEl"
-    class="h-full bg-gray-1000 border-l-[1px] border-gray-900 min-h-[64px] text-[14px]"
+    class="h-full bg-gray-1100 border-l-[1px] border-gray-900 min-h-[64px] text-[14px]"
   >
     <div class="flex flex-wrap grow p-[16px] gap-[12px] justify-end h-[64px]">
       <button
         data-cy="playground-activator"
         :disabled="isDisabled"
-        class="bg-gray-900 border rounded-md flex h-full border-gray-800 outline-solid outline-indigo-500 transition w-[40px] duration-150 items-center justify-center hover:bg-gray-800"
+        class="bg-gray-1100 border rounded-md flex h-full border-gray-800 outline-solid outline-indigo-500 transition w-[40px] duration-150 items-center justify-center hover:bg-gray-800"
         :aria-label="t('runner.selectorPlayground.toggle')"
-        :class="[selectorPlaygroundStore.show ? 'bg-gray-800 border-gray-700' : 'bg-gray-900']"
+        :class="[selectorPlaygroundStore.show ? 'bg-gray-800 border-gray-700' : 'bg-gray-1100']"
         @click="togglePlayground"
       >
         <i-cy-crosshairs_x16 class="icon-dark-gray-300" />

packages/app/src/runner/SpecRunnerHeaderRunMode.vue

@@ -2,7 +2,7 @@
   <div
     id="spec-runner-header"
     ref="autHeaderEl"
-    class="bg-gray-1000 border-l-[1px] border-gray-900 min-h-[64px] px-[16px] text-[14px]"
+    class="bg-gray-1100 border-l-[1px] border-gray-900 min-h-[64px] px-[16px] text-[14px]"
   >
     <!-- this is similar to the Open Mode header but it's not interactive, so can be a lot smaller-->
     <div class="flex grow flex-wrap py-[16px] gap-[12px] justify-end">

packages/app/src/runner/selector-playground/SelectorPlayground.cy.tsx

@@ -68,6 +68,8 @@ describe('SelectorPlayground', () => {
     selectorPlaygroundStore.setNumElements(0)
 
     mountSelectorPlayground()
+    cy.then(() => selectorPlaygroundStore.setValidity(true))
+
     cy.get('[data-cy="playground-num-elements"]').contains('No matches')
 
     cy.then(() => selectorPlaygroundStore.setNumElements(1))

packages/app/src/store/mobx-runner-store.ts

@@ -15,31 +15,47 @@ const defaults = {
 } as const
 
 export class MobxRunnerStore {
-  @observable spec?: Cypress.Spec
-  @observable specs: Cypress.Spec[] = []
-  @observable specRunId?: string
-  @observable isLoading = true
-  @observable width: number
-  @observable height: number
-  @observable automation?: AutomationStatus
-  @observable canSaveStudioLogs = false
+  spec?: Cypress.Spec
+  specs: Cypress.Spec[] = []
+  specRunId?: string
+  isLoading = true
+  width: number
+  height: number
+  automation?: AutomationStatus
+  canSaveStudioLogs = false
 
   constructor (testingType: Cypress.TestingType) {
-    makeObservable(this)
+    makeObservable(this, {
+      spec: observable,
+      specs: observable,
+      specRunId: observable,
+      isLoading: observable,
+      width: observable,
+      height: observable,
+      automation: observable,
+      canSaveStudioLogs: observable,
+      setCanSaveStudioLogs: action,
+      setSpec: action,
+      checkCurrentSpecStillExists: action,
+      setSpecs: action,
+      setIsLoading: action,
+      updateDimensions: action,
+    })
+
     this.width = defaults[testingType].width
     this.height = defaults[testingType].height
   }
 
-  @action setCanSaveStudioLogs (canSave: boolean) {
+  setCanSaveStudioLogs (canSave: boolean) {
     this.canSaveStudioLogs = canSave
   }
 
-  @action setSpec (spec: Cypress.Spec | undefined) {
+  setSpec (spec: Cypress.Spec | undefined) {
     this.spec = spec
     this.specRunId = nanoid()
   }
 
-  @action checkCurrentSpecStillExists (specs: Cypress.Spec[]) {
+  checkCurrentSpecStillExists (specs: Cypress.Spec[]) {
     const newSpecsAbsolutes = new Set(specs.map((spec) => spec.absolute))
 
     this.specs.forEach((oldSpec) => {
@@ -49,16 +65,16 @@ export class MobxRunnerStore {
     })
   }
 
-  @action setSpecs (specs: Cypress.Spec[]) {
+  setSpecs (specs: Cypress.Spec[]) {
     this.checkCurrentSpecStillExists(specs)
     this.specs = specs
   }
 
-  @action setIsLoading (isLoading: boolean) {
+  setIsLoading (isLoading: boolean) {
     this.isLoading = isLoading
   }
 
-  @action updateDimensions (width: number, height: number) {
+  updateDimensions (width: number, height: number) {
     this.height = height
     this.width = width
   }

packages/app/tsconfig.json

@@ -12,8 +12,9 @@
     "../frontend-shared/cypress/**/*.ts"
   ],
   "compilerOptions": {
-    "noImplicitThis": true,
+    // needed for mobx
     "useDefineForClassFields": true,
+    "noImplicitThis": true,
     "paths": {
       "@cy/i18n": ["../frontend-shared/src/locales/i18n"],
       "@cy/components/*": ["../frontend-shared/src/components/*"],

packages/app/vite.config.mjs

@@ -19,6 +19,27 @@ const config = makeConfig({
       'events',
       '@popperjs/core',
       '@opentelemetry/*',
+      '@headlessui/vue',
+      '@cypress-design/vue-icon',
+      '@cypress-design/vue-statusicon',
+      'human-interval',
+      'floating-vue',
+      'dayjs',
+      'dayjs/plugin/relativeTime',
+      'dayjs/plugin/duration',
+      'dayjs/plugin/customParseFormat',
+      'dayjs/plugin/utc',
+      'markdown-it',
+      '@toycode/markdown-it-class',
+      '@cypress-design/vue-tabs',
+      'gravatar',
+      '@opentelemetry/sdk-trace-web',
+      '@opentelemetry/resources',
+      '@opentelemetry/sdk-trace-base',
+      '@opentelemetry/api',
+      '@opentelemetry/semantic-conventions',
+      '@opentelemetry/exporter-trace-otlp-http',
+      '@opentelemetry/core',
     ],
     esbuildOptions: {
       target: 'ES2022',

packages/data-context/src/data/coreDataShape.ts

@@ -1,4 +1,4 @@
-import { FoundBrowser, Editor, AllowedState, AllModeOptions, TestingType, BrowserStatus, PACKAGE_MANAGERS, AuthStateName, MIGRATION_STEPS, MigrationStep, BannerState, StudioManagerShape } from '@packages/types'
+import { FoundBrowser, Editor, AllowedState, AllModeOptions, TestingType, BrowserStatus, PACKAGE_MANAGERS, AuthStateName, MIGRATION_STEPS, MigrationStep, StudioManagerShape } from '@packages/types'
 import { WizardBundler, CT_FRAMEWORKS, resolveComponentFrameworkDefinition, ErroredFramework } from '@packages/scaffold-config'
 import type { NexusGenObjects } from '@packages/graphql/src/gen/nxs.gen'
 // tslint:disable-next-line no-implicit-dependencies - electron dep needs to be defined
@@ -22,7 +22,7 @@ export interface AuthenticatedUserShape {
 
 export interface ProjectShape {
   projectRoot: string
-  savedState?: () => Promise<Maybe<SavedStateShape>>
+  savedState?: () => Promise<AllowedState>
 }
 
 export interface ServersDataShape {
@@ -47,15 +47,6 @@ export interface LocalSettingsDataShape {
   preferences: AllowedState
 }
 
-export interface SavedStateShape {
-  firstOpened?: number | null
-  lastOpened?: number | null
-  promptsShown?: object | null
-  banners?: BannerState | null
-  lastProjectId?: string | null
-  specFilter?: string | null
-}
-
 export interface ConfigChildProcessShape {
   /**
    * Child process executing the config & sourcing plugin events

packages/frontend-shared/package.json

@@ -31,7 +31,7 @@
   "devDependencies": {
     "@antfu/utils": "^0.7.8",
     "@babel/code-frame": "7.26.2",
-    "@cypress-design/css": "^1.0.0",
+    "@cypress-design/css": "^1.1.0",
     "@faker-js/faker": "9.6.0",
     "@graphql-codegen/plugin-helpers": "2.3.2",
     "@graphql-typed-document-node/core": "^3.1.0",

packages/reporter/src/agents/agent-model.ts

@@ -7,13 +7,16 @@ export interface AgentProps extends InstrumentProps {
 }
 
 export default class Agent extends Instrument {
-  @observable callCount: number = 0
-  @observable functionName: string
+  callCount: number = 0
+  functionName: string
 
   constructor (props: AgentProps) {
     super(props)
 
-    makeObservable(this)
+    makeObservable(this, {
+      callCount: observable,
+      functionName: observable,
+    })
 
     this.callCount = props.callCount
     this.functionName = props.functionName