Create "Setup CT" Promo

[mike-plummer]

When in E2E mode without CT configured, we should display a Promo to help users learn about and get started with CT within the Specs Explorer.

The Testing Type switcher shown here will be implemented under #26448 , this ticket is for implementing the Promo.

CTA Headline: Component Testing is not set up for this project
CTA Text: Try it out now, or read our guides to learn more

• "read our guides" is a link to on.cypress.io/component
• clicking this creates a "campaign completed" event using the /machine-collect endpoint
  campaign: Read our guide
  medium: CT Preview

CTA Button Text: Quick setup

• clicking this creates a "campaign completed" event using the /machine-collect endpoint
  campaign: Quick setup
  medium: CT Preview

Body headline: What is Component Testing?
Body text: Cypress Component Testing is a technique for developers to write, test, and debug components in isolation without ever leaving the browser — and without having to run your entire application.
Body list:

• Item 1: Instead of visiting a page, use cy.mount() to render your front-end components directly in the browser.
• Item 2: Test from a user's perspective with all the same Cypress commands that are available in end-to-end testing.
• Item 3: To get started, you can generate the config for Angular, React, or Vue (and more!) in just a few clicks.
  * each framework name has an inline icon in front of it for that framework
  * the framework names should be on-links created in Create "Setup CT" Promo onlinks #26838
  * they will share the following params:
  utm_medium: CT Preview,
  utm_content: if detected {framework}-{bundler}, otherwise empty
  utm_campaign: the content of the link that was clicked, so Angular, Vue, React or "more"
  for reference see: https://github.com/cypress-io/cypress/blob/develop/packages/app/src/specs/banners/ComponentTestingAvailableBanner.vue#L122
  * Each docs link should also record a "campaign completed" event
  medium: CT Preview
  campaign: the content of the link that was clicked, so Angular, Vue, React or "more"

Feedback link: Give feedback

• Existing onlink: on.cypress.io/component-survey-q2-23
• clicking this creates a "campaign completed" event using the /machine-collect endpoint
  campaign: Give feedback
  medium: CT Preview

[mike-plummer]

Hey team! Please add your planning poker estimate with Zenhub @astone123 @dkasper-was-taken @jordanpowell88 @lmiller1990 @marktnoonan @warrensplayer

[cypress-bot]

Released in 12.14.0.

This comment thread has been locked. If you are still experiencing this issue after upgrading to
Cypress v12.14.0, please open a new issue.