internal: (studio) allow tests to be created in specs that have .only tests (#32118)

* internal: (studio) allow tests to be created in specs that have .only tests

* fix stop-only

* add system test spec, add test, fix bugs

* clean up unused logic

* fix issue

* another fix

* refactors

* update variable name, consolidate logic

---------

Co-authored-by: Jennifer Shehane <[email protected]>

Author: astone123

packages/app/cypress/e2e/studio/studio-cloud.cy.ts

@@ -11,6 +11,42 @@ describe('Studio Cloud', () => {
     })
   })
 
+  it('allows .only tests to be edited in studio', () => {
+    loadProjectAndRunSpec({ specName: 'spec-with-only.cy.js' })
+
+    // verify the test is the only one that runs
+    cy.get('.test').should('have.length', 1)
+    cy.get('.test').contains('should be the only test to run normally').should('be.visible')
+
+    // open edit in studio
+    cy.contains('should be the only test to run normally')
+    .closest('.runnable-wrapper')
+    .findByTestId('launch-studio')
+    .click()
+
+    cy.findByTestId('studio-panel').should('be.visible')
+
+    cy.findByTestId('studio-single-test-title').should('have.text', 'should be the only test to run normally')
+  })
+
+  it('creates and runs new tests in studio mode when there is a .only test in the spec file', () => {
+    loadProjectAndRunSpec({ specName: 'spec-with-only.cy.js' })
+
+    cy.get('.test').should('have.length', 1)
+    cy.get('.test').contains('should be the only test to run normally').should('be.visible')
+
+    // launch studio and create a new test
+    cy.findByTestId('studio-button').click()
+    cy.findByTestId('studio-panel').should('be.visible').within(() => {
+      cy.contains('button', 'New test').click()
+      cy.get('[data-cy="test-name-input"]').type('new test{enter}')
+    })
+
+    cy.get('.spec-name').should('have.text', 'spec-with-only')
+    // our new test runs in studio mode even though it doesn't have a .only
+    cy.get('[data-cy="studio-single-test-title"]').should('have.text', 'new test')
+  })
+
   it('immediately loads the studio panel from existing test', () => {
     const deferred = pDefer()
 

packages/app/src/store/studio-store.ts

@@ -109,6 +109,7 @@ interface StudioRecorderState {
   showUrlPrompt: boolean
   cloudStudioRequested: boolean
   cloudStudioSessionId?: string
+  _isStudioCreatedTest: boolean
   newTestLineNumber?: number
 }
 
@@ -128,6 +129,8 @@ export const useStudioStore = defineStore('studioRecorder', {
       showUrlPrompt: true,
       cloudStudioRequested: false,
       cloudStudioSessionId: undefined,
+      newTestLineNumber: undefined,
+      _isStudioCreatedTest: false,
     }
   },
 
@@ -232,15 +235,21 @@ export const useStudioStore = defineStore('studioRecorder', {
     initialize () {
       if (this.newTestLineNumber) {
         getCypress().runner.setNewTestLineNumber(this.newTestLineNumber)
+        // Creating a new test - need to bypass .only filtering
+        getCypress().runner.setIsStudioCreatedTest(true)
+        this._isStudioCreatedTest = true
       } else if (this.testId) {
         getCypress().runner.setOnlyTestId(this.testId)
+        getCypress().runner.setIsStudioCreatedTest(this._isStudioCreatedTest)
       }
     },
 
     interceptTest (test) {
       // if this test is the one we created, we can just set the test id
-      if (this.newTestLineNumber && test.invocationDetails?.line === this.newTestLineNumber) {
+      if ((this.newTestLineNumber && test.invocationDetails?.line === this.newTestLineNumber) || this.suiteId) {
+        this._isStudioCreatedTest = true
         this.setTestId(test.id)
+        getCypress().runner.setIsStudioCreatedTest(true)
       }
 
       if (this.testId) {
@@ -284,6 +293,7 @@ export const useStudioStore = defineStore('studioRecorder', {
       this._currentId = 1
       this.isFailed = false
       this.showUrlPrompt = true
+      this._isStudioCreatedTest = false
 
       this._maybeResetRunnables()
     },

packages/driver/src/cypress/runner.ts

@@ -31,6 +31,21 @@ const RUNNABLE_PROPS = [
 const debug = debugFn('cypress:driver:runner')
 const debugErrors = debugFn('cypress:driver:errors')
 
+// detect studio mode from URL parameters
+const isStudioMode = () => {
+  try {
+    if (typeof window === 'undefined') return false
+
+    const url = new URL(window.location.href)
+    const hashParams = new URLSearchParams(url.hash.slice(1))
+
+    // studio mode is active if there's a 'studio' parameter
+    return hashParams.has('studio')
+  } catch (err) {
+    return false
+  }
+}
+
 const RUNNER_EVENTS = [
   TEST_BEFORE_RUN_ASYNC_EVENT,
   TEST_BEFORE_RUN_EVENT,
@@ -636,7 +651,7 @@ const pruneEmptySuites = (rootSuite, testFilter: NonNullable<TestFilter>) => {
   return totalUnfilteredTests
 }
 
-const normalizeAll = (suite, initialTests = {}, testFilter, setTestsById, setTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber) => {
+const normalizeAll = (suite, initialTests = {}, testFilter, setTestsById, setTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber, getIsStudioCreatedTest) => {
   let totalUnfilteredTests = 0
 
   // Empty suites don't have any impact in run mode so let's avoid this extra work.
@@ -662,7 +677,7 @@ const normalizeAll = (suite, initialTests = {}, testFilter, setTestsById, setTes
   // traversing through it multiple times
   const tests: Record<string, any> = {}
 
-  const normalizedSuite = normalize(suite, tests, initialTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber)
+  const normalizedSuite = normalize(suite, tests, initialTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber, getIsStudioCreatedTest)
 
   if (setTestsById) {
     // use callback here to hand back
@@ -702,7 +717,7 @@ const normalizeAll = (suite, initialTests = {}, testFilter, setTestsById, setTes
   return normalizedSuite
 }
 
-const normalize = (runnable, tests, initialTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber) => {
+const normalize = (runnable, tests, initialTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber, getIsStudioCreatedTest) => {
   const normalizeRunnable = (runnable) => {
     if (!runnable.id) {
       runnable.id = getRunnableId()
@@ -771,7 +786,9 @@ const normalize = (runnable, tests, initialTests, getRunnableId, getHookId, setO
     setOnlyTestId(runnable.id)
   }
 
-  if ((runnable.type !== 'suite') || !hasOnly(runnable)) {
+  const shouldBypassOnly = (isStudioMode() && getIsStudioCreatedTest())
+
+  if ((runnable.type !== 'suite') || !hasOnly(runnable) || shouldBypassOnly) {
     if (runnable.type === 'test' && (!getOnlyTestId() || runnable.id === getOnlyTestId())) {
       push(runnable)
     }
@@ -792,7 +809,7 @@ const normalize = (runnable, tests, initialTests, getRunnableId, getHookId, setO
     _.each({ tests: runnableTests, suites: runnableSuites }, (_runnables, type) => {
       if (runnable[type]) {
         return normalizedRunnable[type] = _.compact(_.map(_runnables, (childRunnable) => {
-          const normalizedChild = normalize(childRunnable, tests, initialTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber)
+          const normalizedChild = normalize(childRunnable, tests, initialTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber, getIsStudioCreatedTest)
 
           if (type === 'tests' && onlyIdMode()) {
             if (normalizedChild.id === getOnlyTestId()) {
@@ -881,7 +898,7 @@ const normalize = (runnable, tests, initialTests, getRunnableId, getHookId, setO
       suite.suites = []
 
       normalizedSuite.suites = _.compact(_.map(suiteSuites, (childSuite) => {
-        const normalizedChildSuite = normalize(childSuite, tests, initialTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber)
+        const normalizedChildSuite = normalize(childSuite, tests, initialTests, getRunnableId, getHookId, setOnlyTestId, getOnlyTestId, getNewTestLineNumber, getIsStudioCreatedTest)
 
         if ((suite._onlySuites.indexOf(childSuite) !== -1) || filterOnly(normalizedChildSuite, childSuite)) {
           if (onlyIdMode()) {
@@ -1314,6 +1331,7 @@ export default {
     let _startTime: string | null = null
     let _onlyTestId = null
     let _newTestLineNumber = null
+    let _isStudioCreatedTest = false
 
     const getRunnableId = () => {
       return `r${++_runnableId}`
@@ -1378,6 +1396,12 @@ export default {
 
     const getNewTestLineNumber = () => _newTestLineNumber
 
+    const setIsStudioCreatedTest = (isCreated) => {
+      _isStudioCreatedTest = isCreated
+    }
+
+    const getIsStudioCreatedTest = () => _isStudioCreatedTest
+
     const abort = () => {
       // abort the run
       _runner.abort()
@@ -1562,6 +1586,8 @@ export default {
       setOnlyTestId,
       setNewTestLineNumber,
       getNewTestLineNumber,
+      setIsStudioCreatedTest,
+      getIsStudioCreatedTest,
       normalizeAll (tests, skipCollectingLogs, testFilter) {
         _skipCollectingLogs = skipCollectingLogs
         // if we have an uncaught error then slice out
@@ -1590,6 +1616,7 @@ export default {
           setOnlyTestId,
           getOnlyTestId,
           getNewTestLineNumber,
+          getIsStudioCreatedTest,
         )
       },
 

system-tests/projects/experimental-studio/cypress/e2e/spec-with-only.cy.js

@@ -0,0 +1,17 @@
+describe('spec with .only tests', () => {
+  // eslint-disable-next-line mocha/no-exclusive-tests
+  it.only('should be the only test to run normally', () => {
+    cy.visit('cypress/e2e/index.html')
+    cy.get('h1').should('contain', 'Hello World')
+  })
+
+  it('should be skipped in normal mode', () => {
+    cy.visit('cypress/e2e/index.html')
+    cy.get('p').should('contain', 'Count is 0')
+  })
+
+  it('another test that should be skipped', () => {
+    cy.visit('cypress/e2e/index.html')
+    cy.get('#increment').click()
+  })
+})