The "Add Commands to Test" button is not visible when trying to use Cypress Studio to extend or create new tests.

[rajkumar-cp]

Current behavior

Steps to Reproduce

1. Enable Cypress Studio by adding the experimentalStudio: true attribute to the Cypress configuration.

   // cypress.config.js or cypress.config.ts
   import { defineConfig } from 'cypress'
   
   export default defineConfig({
     e2e: {
       experimentalStudio: true,
     },
   })

2. Launch Cypress and select End To End testing.
3. Choose a browser to run specs in.
4. Run a test spec.
5. Hover over a test in the Command Log.

The "Add Commands to Test" button is not visible.

Desired behavior

The "Add Commands to Test" button should be visible and clickable to launch Cypress Studio.

Test code to reproduce

beforeEach(() => {
    // Launch the application URL before any tests run
    cy.visit('https://www.google.com/')
  });

it('Studio test', ()=> {
  cy.log('Test over')})

---

import { defineConfig } from "cypress";
import fs from "fs";
import { configureXrayPlugin } from "cypress-xray-plugin";
import mochawesome from "cypress-mochawesome-reporter/plugin";

export default defineConfig({
  e2e: {
    experimentalStudio: true,
    // Cypress Dashboard Project ID
    projectId: "PROJECT_ID_PLACEHOLDER",

    // Enable Video Recording feature
    video: true,

    // Enable Video compressing feature
    videoCompression: true,

    // Timeout for waiting for a page to load (in milliseconds)
    pageLoadTimeout: 60000,

    // Timeout for waiting for a Cypress command to complete (in milliseconds)
    defaultCommandTimeout: 60000,

    // Height of the browser viewport
    viewportHeight: 768,

    // Width of the browser viewport
    viewportWidth: 1366,

    // Base URL for the application under test
    baseUrl: "BASE_URL_PLACEHOLDER",

    // Hosts to block during the test (e.g., to prevent loading third-party scripts)
    blockHosts: ["BLOCK_HOSTS_PLACEHOLDER"],

    // Specify the fixtures folder location
    fixturesFolder: "cypress/e2e/fixtures",

    // Specify the reporter to use for test results
    reporter: "cypress-mochawesome-reporter",

    // Include inline assets in the report for standalone viewing
    reporterOptions: {
      inlineAssets: true,
      reportFilename: "E2ETests",
      overwrite: true, // Ensure that reports are not overwritten
      html: true, // Generate HTML report
      json: true, // Generate JSON report
    },

    // Environment variables for Cypress tests
    env: {
      CYPRESS_TEST_USER_PASSWORD: "CYPRESS_TEST_USER_PASSWORD_PLACEHOLDER",
      MAILINATOR_API_TOKEN: "MAILINATOR_API_TOKEN_PLACEHOLDER",
      API_GATEWAY_URL: "API_GATEWAY_URL_PLACEHOLDER",
    },

    // Exclude specific folder
    excludeSpecPattern: ["cypress/e2e/test/monitoring"],

    // Function to set up Node event listeners
    setupNodeEvents: async (on, config) => {
      // Event listener that runs after each spec
      on("after:spec", (spec, results) => {
        if (results && results.video) {
          // Check if there are any failures for any retry attempts
          const failures = results.tests.some((test) =>
            test.attempts.some((attempt) => attempt.state === "failed"),
          );
          if (!failures) {
            // Delete the video if the spec passed and no tests retried
            fs.unlinkSync(results.video);
          }
        }
      });

      // Check if JIRA_API_TOKEN is provided
      if (config.env.JIRA_API_TOKEN) {
        // Configure Xray plugin if JIRA_API_TOKEN is provided
        await configureXrayPlugin(on, config, {
          jira: {
            testExecutionIssue: {
              fields: {
                summary: `Nightly runs - ${new Date().toISOString().split("T")[0]}`,
              },
            },
            url: "JIRA_URL_PLACEHOLDER", // Jira instance URL
            projectKey: "PROJECT_KEY_PLACEHOLDER",
          },
          xray: {
            uploadResults: true, // Enable uploading of test results to Xray
          },
          plugin: {
            debug: true,
          },
        });
      } else {
        // Configure Mochawesome plugin if JIRA_API_TOKEN is not provided
        mochawesome(on, config);
      }
![image](https://github.com/user-attachments/assets/dcbb97d1-0c24-46d3-9b78-8cbbe7e41c64)

      // Ensure to return the updated config object
      return config;
    },
  },
});

Cypress Version

13.15.1

Node version

20.18.0

Operating System

Windows 11 Enterprise 23H2

Debug Logs

No response

Other

No response

[jennifer-shehane]

@rajkumar-cp Can you check your resolved configuration in the App to ensure the config is being read as you intended? https://docs.cypress.io/app/references/configuration#Resolved-Configuration