misc: (studio) add support for url routing (#31205)

* update url with studio params * updates * spec updates * adding tests * updating changelog * skip adding visit log during start * update url support * cy origin tests * fix tests * updates * update origin test * add a wait * update * pr updates --------- Co-authored-by: Jennifer Shehane <jennifer@cypress.io>
cypress-io · Mar 11, 2025 · b9103af · b9103af · cypress-bot · Mar 11, 2025
1 parent 5ff7e37
commit b9103af
Show file tree

Hide file tree

Showing 19 changed files with 1,132 additions and 184 deletions.
diff --git a/cli/CHANGELOG.md b/cli/CHANGELOG.md
@@ -10,6 +10,7 @@ _Released 3/11/2025 (PENDING)_
 **Misc:**
 
 - Additional CLI options will be displayed in the terminal for some Cloud error messages. Addressed in [#31211](https://github.com/cypress-io/cypress/pull/31211).
+- Updated Cypress Studio with url routing to support maintaining state when reloading. Addresses [#31000](https://github.com/cypress-io/cypress/issues/31000) and [#30996](https://github.com/cypress-io/cypress/issues/30996).
 
 **Dependency Updates:**
 

diff --git a/packages/app/cypress.config.ts b/packages/app/cypress.config.ts
@@ -26,9 +26,13 @@ export default defineConfig({
       framework: 'vue',
     },
   },
+  hosts: {
+    'foobar.com': '127.0.0.1',
+  },
   'e2e': {
     experimentalRunAllSpecs: true,
     experimentalStudio: true,
+    experimentalOriginDependencies: true,
     baseUrl: 'http://localhost:5555',
     supportFile: 'cypress/e2e/support/e2eSupport.ts',
     async setupNodeEvents (on, config) {

diff --git a/packages/app/cypress/e2e/studio/helper.ts b/packages/app/cypress/e2e/studio/helper.ts
@@ -1,25 +1,36 @@
-export function launchStudio () {
+export function launchStudio ({ specName = 'spec.cy.js', createNewTest = false, cliArgs = [''] } = {}) {
   cy.scaffoldProject('experimental-studio')
-  cy.openProject('experimental-studio')
+  cy.openProject('experimental-studio', cliArgs)
   cy.startAppServer('e2e')
   cy.visitApp()
   cy.specsPageIsVisible()
-  cy.get(`[data-cy-row="spec.cy.js"]`).click()
+  cy.get(`[data-cy-row="${specName}"]`).click()
 
   cy.waitForSpecToFinish()
 
   // Should not show "Studio Commands" until we've started a new Studio session.
   cy.get('[data-cy="hook-name-studio commands"]').should('not.exist')
 
-  cy
-  .contains('visits a basic html page')
-  .closest('.runnable-wrapper')
+  if (createNewTest) {
+    cy.contains('studio functionality').as('item')
+  } else {
+    cy.contains('visits a basic html page').as('item')
+  }
+
+  cy.get('@item')
+  .closest('.runnable-wrapper').as('runnable-wrapper')
   .realHover()
+
+  cy.get('@runnable-wrapper')
   .findByTestId('launch-studio')
   .click()
 
   // Studio re-executes spec before waiting for commands - wait for the spec to finish executing.
   cy.waitForSpecToFinish()
 
-  cy.get('[data-cy="hook-name-studio commands"]').should('exist')
+  if (createNewTest) {
+    cy.get('span.runnable-title').contains('New Test').should('exist')
+  } else {
+    cy.get('[data-cy="hook-name-studio commands"]').should('exist')
+  }
 }