diff --git a/docs/app/component-testing/svelte/api.mdx b/docs/app/component-testing/svelte/api.mdx
index deef435a3d..4ee9682601 100644
--- a/docs/app/component-testing/svelte/api.mdx
+++ b/docs/app/component-testing/svelte/api.mdx
@@ -1,9 +1,14 @@
---
title: Svelte API
+description: API for mounting Svelte components in Cypress tests.
sidebar_position: 40
sidebar_label: API
---
+
+
+# Svelte API
+
## Methods
### mount
diff --git a/docs/app/component-testing/svelte/examples.mdx b/docs/app/component-testing/svelte/examples.mdx
index 529137faa4..077007e03a 100644
--- a/docs/app/component-testing/svelte/examples.mdx
+++ b/docs/app/component-testing/svelte/examples.mdx
@@ -1,9 +1,14 @@
---
title: Svelte Examples
+description: Learn how to test Svelte components with Cypress Component Testing.
sidebar_position: 30
sidebar_label: Examples
---
+
+
+# Svelte Examples
+
:::info
#####
What you'll learn
diff --git a/docs/app/component-testing/svelte/overview.mdx b/docs/app/component-testing/svelte/overview.mdx
index be440ae5d6..507d8a5a18 100644
--- a/docs/app/component-testing/svelte/overview.mdx
+++ b/docs/app/component-testing/svelte/overview.mdx
@@ -1,9 +1,14 @@
---
title: Svelte Component Testing
+description: Learn how to set up component tests in Svelte, configure Cypress for Svelte projects, and test Svelte components with Vite and a custom Webpack config.
sidebar_position: 10
sidebar_label: Overview
---
+
+
+# Svelte Component Testing
+
:::info
#####
What you'll learn
diff --git a/docs/app/component-testing/vue/api.mdx b/docs/app/component-testing/vue/api.mdx
index 1feab2ab06..809505e39e 100644
--- a/docs/app/component-testing/vue/api.mdx
+++ b/docs/app/component-testing/vue/api.mdx
@@ -1,9 +1,14 @@
---
title: Vue API
+description: API for mounting Vue components in Cypress tests.
sidebar_position: 40
sidebar_label: API
---
+
+
+# Vue API
+
## Methods
### mount
diff --git a/docs/app/component-testing/vue/examples.mdx b/docs/app/component-testing/vue/examples.mdx
index 9d2e352acd..fd2c305ad3 100644
--- a/docs/app/component-testing/vue/examples.mdx
+++ b/docs/app/component-testing/vue/examples.mdx
@@ -1,9 +1,14 @@
---
title: Vue Examples
+description: Examples for testing Vue components with Cypress.
sidebar_position: 30
sidebar_label: Examples
---
+
+
+# Vue Examples
+
:::info
#####
What you'll learn
diff --git a/docs/app/component-testing/vue/overview.mdx b/docs/app/component-testing/vue/overview.mdx
index 67ef4d409a..a4ba6b6ed4 100644
--- a/docs/app/component-testing/vue/overview.mdx
+++ b/docs/app/component-testing/vue/overview.mdx
@@ -1,9 +1,14 @@
---
title: Vue Component Testing
+description: Learn how to set up component tests in Vue and configure Cypress for Vue projects.
sidebar_position: 10
sidebar_label: Overview
---
+
+
+# Vue Component Testing
+
:::info
#####
What you'll learn
diff --git a/docs/app/continuous-integration/aws-codebuild.mdx b/docs/app/continuous-integration/aws-codebuild.mdx
index 4a54c7cd3f..c89110574e 100644
--- a/docs/app/continuous-integration/aws-codebuild.mdx
+++ b/docs/app/continuous-integration/aws-codebuild.mdx
@@ -1,7 +1,13 @@
---
-title: AWS CodeBuild
+title: 'Run Cypress tests in AWS CodeBuild: Step-by-Step Guide'
+description: Learn how to set up and run Cypress tests in AWS CodeBuild, cache dependencies and build artifacts, run tests in parallel, and use Cypress Cloud with AWS CodeBuild.
+sidebar_label: AWS CodeBuild
---
+
+
+# Run Cypress in AWS CodeBuild
+
:::info
#####
What you'll learn
diff --git a/docs/app/continuous-integration/bitbucket-pipelines.mdx b/docs/app/continuous-integration/bitbucket-pipelines.mdx
index 1f1d85296c..d28f45f971 100644
--- a/docs/app/continuous-integration/bitbucket-pipelines.mdx
+++ b/docs/app/continuous-integration/bitbucket-pipelines.mdx
@@ -1,7 +1,13 @@
---
-title: Bitbucket Pipelines
+title: 'Run Cypress tests in Bitbucket Pipelines: Step-by-Step Guide'
+description: Run Cypress tests in Bitbucket Pipelines with Docker images, caching, parallelization, and Cypress Cloud.
+sidebar_label: Bitbucket Pipelines
---
+
+
+# Run Cypress in Bitbucket Pipelines
+
:::info
#####
What you'll learn
diff --git a/docs/app/continuous-integration/circleci.mdx b/docs/app/continuous-integration/circleci.mdx
index 0285ccbff4..8fc65b4999 100644
--- a/docs/app/continuous-integration/circleci.mdx
+++ b/docs/app/continuous-integration/circleci.mdx
@@ -1,7 +1,13 @@
---
-title: CircleCI
+title: 'Run Cypress tests in CircleCI: A Step-by-Step Guide'
+description: 'Set up CircleCI to run Cypress tests with the Cypress Orb, cache dependencies and build artifacts, and parallelize Cypress tests.'
+sidebar_label: CircleCI
---
+
+
+# Run Cypress in CircleCI
+
:::info
#####
What you'll learn
diff --git a/docs/app/continuous-integration/github-actions.mdx b/docs/app/continuous-integration/github-actions.mdx
index 10cd1e654b..173af7c782 100644
--- a/docs/app/continuous-integration/github-actions.mdx
+++ b/docs/app/continuous-integration/github-actions.mdx
@@ -1,7 +1,13 @@
---
-title: GitHub Actions
+title: 'Run Cypress tests in GitHub Actions: A Step-by-Step Guide'
+description: 'Set up GitHub Actions to run Cypress tests, cache dependencies and build artifacts, and parallelize Cypress tests.'
+sidebar_label: GitHub Actions
---
+
+
+# Run Cypress in GitHub Actions
+
:::info
#####
What you'll learn
diff --git a/docs/app/continuous-integration/gitlab-ci.mdx b/docs/app/continuous-integration/gitlab-ci.mdx
index e5f5a916ec..9f8b8ff32b 100644
--- a/docs/app/continuous-integration/gitlab-ci.mdx
+++ b/docs/app/continuous-integration/gitlab-ci.mdx
@@ -1,7 +1,13 @@
---
-title: GitLab CI
+title: 'Run Cypress in GitLab CI: A Step-by-Step Guide'
+description: 'Set up GitLab CI/CD to run Cypress tests with Docker images, caching, parallelization, and Cypress Cloud.'
+sidebar_label: GitLab CI
---
+
+
+# Run Cypress in GitLab CI
+
:::info
#####
What you'll learn
diff --git a/docs/app/continuous-integration/overview.mdx b/docs/app/continuous-integration/overview.mdx
index 06157fc937..7006b86d89 100644
--- a/docs/app/continuous-integration/overview.mdx
+++ b/docs/app/continuous-integration/overview.mdx
@@ -1,8 +1,14 @@
---
-title: Overview
+title: 'Continuous Integration with Cypress'
+description: 'Learn how to set up Cypress in Continuous Integration (CI), record tests, run tests in parallel, and set up CI workflows to use Cypress Docker images.'
+sidebar_label: Overview
sidebar_position: 10
---
+
+
+# Continuous Integration with Cypress
+
:::info
#####
What you'll learn
diff --git a/docs/app/core-concepts/best-practices.mdx b/docs/app/core-concepts/best-practices.mdx
index e34d04bae8..27b9f3e0f2 100644
--- a/docs/app/core-concepts/best-practices.mdx
+++ b/docs/app/core-concepts/best-practices.mdx
@@ -1,8 +1,13 @@
---
title: Best Practices
+description: Best practices for organizing tests, selecting elements, and controlling state in Cypress.
sidebar_position: 80
---
+
+
+# Best Practices
+
:::info
#####
What you'll learn
diff --git a/docs/app/core-concepts/interacting-with-elements.mdx b/docs/app/core-concepts/interacting-with-elements.mdx
index 70f820a447..d3abc729d6 100644
--- a/docs/app/core-concepts/interacting-with-elements.mdx
+++ b/docs/app/core-concepts/interacting-with-elements.mdx
@@ -1,8 +1,13 @@
---
title: Interacting with Elements
+description: Learn how Cypress determines if an element is actionable, how to debug when elements are not actionable, and how to ignore Cypress' actionability checks.
sidebar_position: 35
---
+
+
+# Interacting with Elements
+
:::info
#####
What you'll learn
diff --git a/docs/app/core-concepts/introduction-to-cypress.mdx b/docs/app/core-concepts/introduction-to-cypress.mdx
index dc91d17464..907db405b8 100644
--- a/docs/app/core-concepts/introduction-to-cypress.mdx
+++ b/docs/app/core-concepts/introduction-to-cypress.mdx
@@ -1,9 +1,14 @@
---
title: Introduction to Cypress
+description: Learn the basics of Cypress, including querying elements, chaining commands, and interacting with elements.
sidebar_position: 10
sidebar_label: Introduction
---
+
+
+# Introduction to Cypress App
+
:::tip
**This is the single most important guide** for understanding how to test with
diff --git a/docs/app/core-concepts/open-mode.mdx b/docs/app/core-concepts/open-mode.mdx
index ea33c69bc4..ea937ea614 100644
--- a/docs/app/core-concepts/open-mode.mdx
+++ b/docs/app/core-concepts/open-mode.mdx
@@ -1,8 +1,13 @@
---
title: Open Mode
+description: The different sections of the Cypress app in open mode, the information surfaced in the app's Command Log, how to use the Selector Playground to find unique selectors, and debugging tools available in the app in open mode.
sidebar_position: 60
---
+
+
+# Open Mode
+
:::info
#####
What you'll learn
diff --git a/docs/app/core-concepts/retry-ability.mdx b/docs/app/core-concepts/retry-ability.mdx
index f0c4bbf21c..231d9c57b3 100644
--- a/docs/app/core-concepts/retry-ability.mdx
+++ b/docs/app/core-concepts/retry-ability.mdx
@@ -1,8 +1,13 @@
---
title: Retry-ability
+description: Understand how Cypress retries commands, queries, and assertions to help you write faster tests with fewer run-time surprises.
sidebar_position: 50
---
+
+
+# Retry-ability
+
:::info
#####
What you'll learn
diff --git a/docs/app/core-concepts/test-isolation.mdx b/docs/app/core-concepts/test-isolation.mdx
index 203686b600..851a3b753e 100644
--- a/docs/app/core-concepts/test-isolation.mdx
+++ b/docs/app/core-concepts/test-isolation.mdx
@@ -1,8 +1,13 @@
---
title: 'Test Isolation'
+description: Learn how Cypress ensures test isolation and how to configure test isolation in end-to-end and component testing.
sidebar_position: 45
---
+
+
+# Test Isolation
+
:::info
#####
What you'll learn
diff --git a/docs/app/core-concepts/testing-types.mdx b/docs/app/core-concepts/testing-types.mdx
index 9615167954..64070b1f9d 100644
--- a/docs/app/core-concepts/testing-types.mdx
+++ b/docs/app/core-concepts/testing-types.mdx
@@ -1,8 +1,13 @@
---
title: 'Testing Types'
+description: 'Learn the differences between Cypress end-to-end and component tests, the benefits and considerations for each type of test, and common scenarios for each type of test.'
sidebar_position: 20
---
+
+
+# Testing Types
+
:::info
#####
What you'll learn
diff --git a/docs/app/core-concepts/variables-and-aliases.mdx b/docs/app/core-concepts/variables-and-aliases.mdx
index 5c4fa257a2..b3738c7311 100644
--- a/docs/app/core-concepts/variables-and-aliases.mdx
+++ b/docs/app/core-concepts/variables-and-aliases.mdx
@@ -1,8 +1,13 @@
---
title: Variables and Aliases
+description: Learn how to handle asynchronous code in Cypress, when to assign variables, how to use aliases to share objects between hooks and tests, and how to alias DOM elements, intercepts, and requests.
sidebar_position: 40
---
+
+
+# Variables and Aliases
+
:::info
#####
What you'll learn
diff --git a/docs/app/core-concepts/writing-and-organizing-tests.mdx b/docs/app/core-concepts/writing-and-organizing-tests.mdx
index b4d25012b9..77315ffbe6 100644
--- a/docs/app/core-concepts/writing-and-organizing-tests.mdx
+++ b/docs/app/core-concepts/writing-and-organizing-tests.mdx
@@ -1,8 +1,13 @@
---
title: Writing and Organizing Tests
+description: Learn how to organize your tests in Cypress and the types of supported files, how to write tests in Cypress including hooks, exclusions, and configurations.
sidebar_position: 30
---
+
+
+# Writing and Organizing Tests
+
:::info
#####
What you'll learn
diff --git a/docs/app/end-to-end-testing/testing-your-app.mdx b/docs/app/end-to-end-testing/testing-your-app.mdx
index 9fe49141ab..ca2e2d870e 100644
--- a/docs/app/end-to-end-testing/testing-your-app.mdx
+++ b/docs/app/end-to-end-testing/testing-your-app.mdx
@@ -6,6 +6,8 @@ sidebar_position: 20
slug: /app/end-to-end-testing/testing-your-app
---
+
+
# Testing Your App
:::info
diff --git a/docs/app/end-to-end-testing/writing-your-first-end-to-end-test.mdx b/docs/app/end-to-end-testing/writing-your-first-end-to-end-test.mdx
index da5226f2e4..f92d0a0b05 100644
--- a/docs/app/end-to-end-testing/writing-your-first-end-to-end-test.mdx
+++ b/docs/app/end-to-end-testing/writing-your-first-end-to-end-test.mdx
@@ -6,6 +6,8 @@ sidebar_position: 10
slug: /app/end-to-end-testing/writing-your-first-end-to-end-test
---
+
+
# Your First Test
:::info
diff --git a/docs/app/faq.mdx b/docs/app/faq.mdx
index 2b83a27624..a2774335c1 100644
--- a/docs/app/faq.mdx
+++ b/docs/app/faq.mdx
@@ -1,9 +1,14 @@
---
-title: Cypress App FAQ
+title: 'Frequently Asked Questions | Cypress Documentation'
+description: 'Get answers to common questions about Cypress, including general questions, how-to questions, and more.'
sidebar_position: 200
sidebar_label: FAQ
---
+
+
+# Frequently Asked Questions
+
## General Cypress Questions
###
Is Cypress free and open source?
diff --git a/docs/app/get-started/install-cypress.mdx b/docs/app/get-started/install-cypress.mdx
index 68ff6af50f..053b317c95 100644
--- a/docs/app/get-started/install-cypress.mdx
+++ b/docs/app/get-started/install-cypress.mdx
@@ -5,6 +5,8 @@ sidebar_label: Install Cypress
sidebar_position: 30
---
+
+
# Install Cypress
:::info
diff --git a/docs/app/get-started/open-the-app.mdx b/docs/app/get-started/open-the-app.mdx
index dcc7e09971..d827fa9df2 100644
--- a/docs/app/get-started/open-the-app.mdx
+++ b/docs/app/get-started/open-the-app.mdx
@@ -5,6 +5,8 @@ sidebar_label: Open the App
sidebar_position: 40
---
+
+
# Open the App
:::info
diff --git a/docs/app/guides/accessibility-testing.mdx b/docs/app/guides/accessibility-testing.mdx
index 565164630c..827095944e 100644
--- a/docs/app/guides/accessibility-testing.mdx
+++ b/docs/app/guides/accessibility-testing.mdx
@@ -1,7 +1,12 @@
---
title: Accessibility Testing
+description: Learn how to ensure your application works for users with disabilities, and how to write accessibility-specific tests in Cypress.
---
+
+
+# Accessibility Testing
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/authentication-testing/amazon-cognito-authentication.mdx b/docs/app/guides/authentication-testing/amazon-cognito-authentication.mdx
index c1f4c56d91..b147a98980 100644
--- a/docs/app/guides/authentication-testing/amazon-cognito-authentication.mdx
+++ b/docs/app/guides/authentication-testing/amazon-cognito-authentication.mdx
@@ -1,9 +1,11 @@
---
-title: 'Amazon Cognito Authentication in Cypress'
+title: 'Amazon Cognito Authentication: Cypress Guide'
sidebar_label: 'Amazon Cognito Authentication'
description: 'Implement Amazon Cognito authentication in Cypress. Securely manage authentication processes for Cypress end-to-end testing scenarios'
---
+
+
# Amazon Cognito Authentication
:::info
diff --git a/docs/app/guides/authentication-testing/auth0-authentication.mdx b/docs/app/guides/authentication-testing/auth0-authentication.mdx
index af2e989a47..91a084ea05 100644
--- a/docs/app/guides/authentication-testing/auth0-authentication.mdx
+++ b/docs/app/guides/authentication-testing/auth0-authentication.mdx
@@ -1,9 +1,11 @@
---
-title: 'Auth0 Integration: Cypress Auth'
-sidebar_label: 'Auth0 Integration'
+title: 'Auth0 Integration: Cypress Guide'
+sidebar_label: 'Auth0 Authentication'
description: 'Seamlessly implement Auth0 authentication with Cypress. Integrate Auth0 authentication for secure testing'
---
+
+
# Auth0 Authentication
:::info
diff --git a/docs/app/guides/authentication-testing/azure-active-directory-authentication.mdx b/docs/app/guides/authentication-testing/azure-active-directory-authentication.mdx
index d0dd799a5b..043b8ec8cb 100644
--- a/docs/app/guides/authentication-testing/azure-active-directory-authentication.mdx
+++ b/docs/app/guides/authentication-testing/azure-active-directory-authentication.mdx
@@ -1,7 +1,13 @@
---
-title: Azure Active Directory Authentication
+title: 'Azure Active Directory Authentication: Cypress Guide'
+sidebar_label: Azure Active Directory Authentication
+description: Learn how to set up Cypress to test against an Azure Active Directory web app and authenticate with Azure Active Directory using `cy.origin()`.
---
+
+
+# Azure Active Directory Authentication
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/authentication-testing/google-authentication.mdx b/docs/app/guides/authentication-testing/google-authentication.mdx
index 8a9e247a54..669ba0f43f 100644
--- a/docs/app/guides/authentication-testing/google-authentication.mdx
+++ b/docs/app/guides/authentication-testing/google-authentication.mdx
@@ -1,9 +1,11 @@
---
title: 'Google Authentication: Cypress Guide'
sidebar_label: 'Google Authentication'
-description: 'Google Authentication: Cypress Guide. Secure testing with seamless integration of Google Authentication, ensuring reliable and protected test scenarios'
+description: 'Secure testing with seamless integration of Google Authentication, ensuring reliable and protected test scenarios'
---
+
+
# Google Authentication
:::info
diff --git a/docs/app/guides/authentication-testing/okta-authentication.mdx b/docs/app/guides/authentication-testing/okta-authentication.mdx
index 245c367a5a..432db2bd1f 100644
--- a/docs/app/guides/authentication-testing/okta-authentication.mdx
+++ b/docs/app/guides/authentication-testing/okta-authentication.mdx
@@ -1,9 +1,11 @@
---
-title: 'Okta Authentication in Cypress'
+title: 'Okta Authentication: Cypress Guide'
sidebar_label: 'Okta Authentication'
description: 'Implement Okta authentication in Cypress end-to-end testing. Ensure secure and reliable authentication processes for Cypress testing scenarios'
---
+
+
# Okta Authentication
:::info
diff --git a/docs/app/guides/authentication-testing/social-authentication.mdx b/docs/app/guides/authentication-testing/social-authentication.mdx
index f7314deaad..b21e33bef4 100644
--- a/docs/app/guides/authentication-testing/social-authentication.mdx
+++ b/docs/app/guides/authentication-testing/social-authentication.mdx
@@ -1,7 +1,13 @@
---
-title: Social Authentication
+title: 'Social Authentication: Cypress Guide'
+sidebar_label: Social Authentication
+description: Authenticate with common social authentication platforms with cy.origin() and use cy.session() to cache authenticated users.
---
+
+
+# Social Authentication
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/conditional-testing.mdx b/docs/app/guides/conditional-testing.mdx
index 23ca9adc84..b6a509245a 100644
--- a/docs/app/guides/conditional-testing.mdx
+++ b/docs/app/guides/conditional-testing.mdx
@@ -1,7 +1,13 @@
---
-title: Conditional Testing
+title: 'Conditional Testing: Cypress Guide'
+description: Learn how to do conditional testing in Cypress without relying on the DOM.
+sidebar_label: Conditional Testing
---
+
+
+# Conditional Testing
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/cross-browser-testing.mdx b/docs/app/guides/cross-browser-testing.mdx
index d0e91c99df..458a47f9e5 100644
--- a/docs/app/guides/cross-browser-testing.mdx
+++ b/docs/app/guides/cross-browser-testing.mdx
@@ -1,7 +1,13 @@
---
-title: Cross Browser Testing
+title: 'Cross Browser Testing: Cypress Guide'
+description: Learn how to run tests across multiple browsers and strategies for incorporating cross-browser testing into your CI process.
+sidebar_label: Cross Browser Testing
---
+
+
+# Cross Browser Testing
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/cross-origin-testing.mdx b/docs/app/guides/cross-origin-testing.mdx
index 5f67abeadc..0d355dea9f 100644
--- a/docs/app/guides/cross-origin-testing.mdx
+++ b/docs/app/guides/cross-origin-testing.mdx
@@ -1,8 +1,14 @@
---
-title: Cross Origin Testing
+title: 'Cross Origin Testing: Cypress Guide'
+description: 'Learn how to test cross-origin content with Cypress.'
+sidebar_label: Cross Origin Testing
e2eSpecific: true
---
+
+
+# Cross Origin Testing
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/cypress-studio.mdx b/docs/app/guides/cypress-studio.mdx
index 92fe4da36e..33a2f390b4 100644
--- a/docs/app/guides/cypress-studio.mdx
+++ b/docs/app/guides/cypress-studio.mdx
@@ -1,8 +1,14 @@
---
-title: Cypress Studio
+title: 'Cypress Studio: Record Interactions & Generate Tests in Cypress'
+description: 'Learn how to use Cypress Studio to record interactions and generate tests in Cypress.'
+sidebar_label: 'Cypress Studio'
e2eSpecific: true
---
+
+
+# Cypress Studio
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/debugging.mdx b/docs/app/guides/debugging.mdx
index 264d7e83a1..935a404867 100644
--- a/docs/app/guides/debugging.mdx
+++ b/docs/app/guides/debugging.mdx
@@ -1,7 +1,13 @@
---
-title: Debugging
+title: 'Debugging in Cypress'
+description: 'Learn how to use debugger, .debug(), .pause(), and the Developer Tools to debug Cypress tests.'
+sidebar_label: 'Debugging'
---
+
+
+# Debugging
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/migration/protractor-to-cypress.mdx b/docs/app/guides/migration/protractor-to-cypress.mdx
index 1a7821ea3a..8da2f8e2ba 100644
--- a/docs/app/guides/migration/protractor-to-cypress.mdx
+++ b/docs/app/guides/migration/protractor-to-cypress.mdx
@@ -1,7 +1,13 @@
---
-title: Migrating from Protractor
+title: 'Migrating from Protractor to Cypress: A Guide'
+description: 'Migrate from Protractor to Cypress with this guide. Learn how to work with the DOM, write assertions, and use the Angular schematic to configure Cypress.'
+sidebar_label: Migrating from Protractor
---
+
+
+# Migrating from Protractor to Cypress
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/migration/selenium-to-cypress.mdx b/docs/app/guides/migration/selenium-to-cypress.mdx
index e7522d2ac4..5ca15dad2f 100644
--- a/docs/app/guides/migration/selenium-to-cypress.mdx
+++ b/docs/app/guides/migration/selenium-to-cypress.mdx
@@ -1,7 +1,13 @@
---
-title: Migrating from Selenium
+title: 'Migrating from Selenium to Cypress: A Guide'
+description: Learn the advantages and limitations of Selenium and Cypress, strategies for migration, and how to integrate Cypress with your CI/CD pipeline.
+sidebar_label: Migrating from Selenium
---
+
+
+# Migrating from Selenium to Cypress
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/network-requests.mdx b/docs/app/guides/network-requests.mdx
index 87a106c4a8..884097a597 100644
--- a/docs/app/guides/network-requests.mdx
+++ b/docs/app/guides/network-requests.mdx
@@ -1,7 +1,13 @@
---
-title: Network Requests
+title: 'Network Requests: Cypress Guide'
+description: 'Strategies for testing network requests in Cypress, stubbing and waiting for network responses, and best practices for testing GraphQL queries and mutations.'
+sidebar_label: Network Requests
---
+
+
+# Network Requests
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/screenshots-and-videos.mdx b/docs/app/guides/screenshots-and-videos.mdx
index 706dc2b09a..6036951956 100644
--- a/docs/app/guides/screenshots-and-videos.mdx
+++ b/docs/app/guides/screenshots-and-videos.mdx
@@ -1,7 +1,13 @@
---
-title: Screenshots and Videos
+title: 'Capture Screenshots and Videos: Cypress Guide'
+description: Capture screenshots and videos of your tests with Cypress and configure settings for them.
+sidebar_label: Screenshots & Videos
---
+
+
+# Screenshots and Videos
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/stubs-spies-and-clocks.mdx b/docs/app/guides/stubs-spies-and-clocks.mdx
index a7a1bff7ae..17b02ec27f 100644
--- a/docs/app/guides/stubs-spies-and-clocks.mdx
+++ b/docs/app/guides/stubs-spies-and-clocks.mdx
@@ -1,7 +1,13 @@
---
-title: Stubs, Spies, and Clocks
+title: 'Stubs, Spies, and Clocks: Cypress Guide'
+description: Learn how to use `cy.stub()`, `cy.spy()`, and `cy.clock()` in Cypress to manipulate your application's behavior and time.
+sidebar_label: Stubs, Spies, and Clocks
---
+
+
+# Stubs, Spies, and Clocks
+
:::info
#####
What you'll learn
diff --git a/docs/app/guides/test-retries.mdx b/docs/app/guides/test-retries.mdx
index 467290d445..048e4545c5 100644
--- a/docs/app/guides/test-retries.mdx
+++ b/docs/app/guides/test-retries.mdx
@@ -1,7 +1,13 @@
---
-title: Test Retries
+title: 'Test Retries: Cypress Guide'
+description: Learn how to configure test retries in Cypress to help detect test flakiness and continuous integration (CI) build failures.
+sidebar_label: Test Retries
---
+
+
+# Test Retries
+
:::info
#####
What you'll learn
diff --git a/docs/app/plugins/plugins-guide.mdx b/docs/app/plugins/plugins-guide.mdx
index 15ad6fde41..87603e970e 100644
--- a/docs/app/plugins/plugins-guide.mdx
+++ b/docs/app/plugins/plugins-guide.mdx
@@ -1,8 +1,14 @@
---
-title: How to use Plugins
+title: 'How to use Cypress Plugins'
+description: 'Learn how to install and use Cypress plugins.'
+sidebar_label: 'How to use Plugins'
sidebar_position: 10
---
+
+
+# How to use Cypress Plugins
+
:::info
#####
What you'll learn
diff --git a/docs/app/plugins/plugins-list.mdx b/docs/app/plugins/plugins-list.mdx
index ec50848ce0..24f2ea5051 100644
--- a/docs/app/plugins/plugins-list.mdx
+++ b/docs/app/plugins/plugins-list.mdx
@@ -1,10 +1,15 @@
---
-title: Plugins
+title: 'List of Cypress Plugins'
sidebar_label: List of Plugins
+description: A list of Cypress plugins created by Cypress and the community to extend the behavior of Cypress.
sidebar_position: 20
hide_table_of_contents: true
---
+
+
+# Cypress Plugins
+
import PluginsList from '@site/src/components/plugins-list'
Plugins provide a way to support and extend the behavior of Cypress. Follow
diff --git a/docs/app/references/advanced-installation.mdx b/docs/app/references/advanced-installation.mdx
index 805c0b5f3f..80a88d9da2 100644
--- a/docs/app/references/advanced-installation.mdx
+++ b/docs/app/references/advanced-installation.mdx
@@ -1,7 +1,13 @@
---
-title: Advanced Installation
+title: 'Advanced Installation Instructions for Cypress'
+description: 'Learn how to install Cypress with a custom binary, skip the installation of the Cypress binary, change the Cypress binary cache location or download URL and more'
+sidebar_label: 'Advanced Installation'
---
+
+
+# Advanced Installation
+
:::info
#####
What you'll learn
diff --git a/docs/app/references/assertions.mdx b/docs/app/references/assertions.mdx
index 7a1f7ac809..1d9e463eea 100644
--- a/docs/app/references/assertions.mdx
+++ b/docs/app/references/assertions.mdx
@@ -1,7 +1,13 @@
---
-title: Assertions
+title: 'Assertions in Cypress: A Guide'
+description: 'Assertions available in Cypress with Chai, Chai-jQuery, and Sinon-Chai assertions'
+sidebar_label: 'Assertions'
---
+
+
+# Assertions
+
:::info
#####
What you'll learn
diff --git a/docs/app/references/bundled-libraries.mdx b/docs/app/references/bundled-libraries.mdx
index 5b1b4c1b71..85242c37c8 100644
--- a/docs/app/references/bundled-libraries.mdx
+++ b/docs/app/references/bundled-libraries.mdx
@@ -1,13 +1,18 @@
---
-title: Bundled Libraries
+title: 'Bundled Libraries in Cypress'
+description: 'Open source testing libraries bundled with Cypress'
+sidebar_label: 'Bundled Libraries'
---
+
+
+# Bundled Libraries
+
:::info
Cypress relies on many open source testing libraries to lend
stability and familiarity to the platform from the get-go. If you've been
testing in JavaScript, you'll recognize many old friends in this list.
-Understand how we exploit them and hit the ground running with Cypress!
:::
diff --git a/docs/app/references/changelog.mdx b/docs/app/references/changelog.mdx
index 1113a0a72f..c192898d46 100644
--- a/docs/app/references/changelog.mdx
+++ b/docs/app/references/changelog.mdx
@@ -1,7 +1,13 @@
---
-title: Changelog
+title: 'Changelog: Cypress App'
+description: 'Release notes for the Cypress App.'
+sidebar_label: Changelog
---
+
+
+# Changelog
+
## 13.17.0
_Released 12/17/2024_
diff --git a/docs/app/references/client-certificates.mdx b/docs/app/references/client-certificates.mdx
index 66bf7f9b24..7544b56374 100644
--- a/docs/app/references/client-certificates.mdx
+++ b/docs/app/references/client-certificates.mdx
@@ -1,7 +1,13 @@
---
-title: Client Certificates
+title: 'Configure Client Certificates in Cypress'
+description: 'Configure certificate authority (CA) and client certificates to use within tests on a per-URL basis.'
+sidebar_label: 'Client Certificates'
---
+
+
+# Client Certificates
+
Configure certificate authority (CA) and client certificates to use within tests
on a per-URL basis.
diff --git a/docs/app/references/command-line.mdx b/docs/app/references/command-line.mdx
index cf3e93bfe1..6a8f0ad627 100644
--- a/docs/app/references/command-line.mdx
+++ b/docs/app/references/command-line.mdx
@@ -1,7 +1,13 @@
---
-title: Command Line
+title: 'Command Line Interface (CLI) Commands and Options for Cypress'
+description: 'Learn how to run Cypress from the command line using npm, Yarn, or pnpm.'
+sidebar_label: 'Command Line'
---
+
+
+# Command Line
+
This guide assumes you've already read our
[Installing Cypress](/app/get-started/install-cypress) guide and
installed Cypress as an `npm` module. After installing you'll be able to execute
diff --git a/docs/app/references/configuration.mdx b/docs/app/references/configuration.mdx
index b539ec29ff..33a3117ebd 100644
--- a/docs/app/references/configuration.mdx
+++ b/docs/app/references/configuration.mdx
@@ -1,7 +1,13 @@
---
-title: Configuration
+title: 'Configuration in Cypress'
+description: 'Change the default behavior of Cypress by configuring options in the Cypress configuration file.'
+sidebar_label: Configuration
---
+
+
+# Cypress Configuration
+
:::info
#####
What you'll learn
diff --git a/docs/app/references/content-security-policy.mdx b/docs/app/references/content-security-policy.mdx
index 568a3fe546..c73790cf77 100644
--- a/docs/app/references/content-security-policy.mdx
+++ b/docs/app/references/content-security-policy.mdx
@@ -1,8 +1,14 @@
---
-title: Content Security Policy
+title: 'Content Security Policy (CSP) in Cypress'
+description: 'How Cypress handles Content Security Policy (CSP) and how to configure it to work with your application.'
+sidebar_label: 'Content Security Policy'
e2eSpecific: true
---
+
+
+# Content Security Policy
+
:::info
#####
What you'll learn
diff --git a/docs/app/references/environment-variables.mdx b/docs/app/references/environment-variables.mdx
index 2c680b8fcd..79fc15dd83 100644
--- a/docs/app/references/environment-variables.mdx
+++ b/docs/app/references/environment-variables.mdx
@@ -1,7 +1,13 @@
---
-title: Environment Variables
+title: 'Cypress Environment Variables'
+description: 'Set and use environment variables in Cypress to manage dynamic values across different environments.'
+sidebar_label: 'Environment Variables'
---
+
+
+# Cypress Environment Variables
+
:::caution
Difference between OS-level and Cypress environment variables
diff --git a/docs/app/references/error-messages.mdx b/docs/app/references/error-messages.mdx
index 0b32d057de..0f51799c1a 100644
--- a/docs/app/references/error-messages.mdx
+++ b/docs/app/references/error-messages.mdx
@@ -1,8 +1,14 @@
---
-title: Error Messages
+title: 'Common Error Messages in Cypress'
+description: 'Common error messages you may encounter while using Cypress and how to resolve them.'
+sidebar_label: 'Error Messages'
hide_table_of_contents: true
---
+
+
+# Error Messages in Cypress
+
import TOCInline from '@theme/TOCInline'
diff --git a/docs/app/references/experiments.mdx b/docs/app/references/experiments.mdx
index 2218e0126b..bfcce79c4a 100644
--- a/docs/app/references/experiments.mdx
+++ b/docs/app/references/experiments.mdx
@@ -1,7 +1,13 @@
---
-title: Experiments
+title: 'Experimental Features in Cypress: Configuration Options'
+description: 'Enable experimental features in Cypress by configuring specific options.'
+sidebar_label: 'Experiments'
---
+
+
+# Experimental Features
+
If you'd like to try out what we're working on in Cypress, you can enable
specific experimental features for your project using the Cypress configuration
options described below.
diff --git a/docs/app/references/launching-browsers.mdx b/docs/app/references/launching-browsers.mdx
index 7fbc337e79..90eccba08e 100644
--- a/docs/app/references/launching-browsers.mdx
+++ b/docs/app/references/launching-browsers.mdx
@@ -1,7 +1,13 @@
---
-title: Launching Browsers
+title: 'Launching Browsers in Cypress'
+description: 'Learn how to launch browsers in Cypress, customize the list of available browsers, and troubleshoot browser launching issues.'
+sidebar_label: 'Launching Browsers'
---
+
+
+# Launching Browsers
+
:::info
#####
What you'll learn
diff --git a/docs/app/references/migration-guide.mdx b/docs/app/references/migration-guide.mdx
index 03be597ce9..953576973f 100644
--- a/docs/app/references/migration-guide.mdx
+++ b/docs/app/references/migration-guide.mdx
@@ -1,7 +1,13 @@
---
-title: Migration Guide
+title: 'Migration Guide | Cypress Documentation'
+description: 'A guide to help you migrate to the latest version of Cypress.'
+sidebar_label: 'Migration Guide'
---
+
+
+# Migration Guide
+
## Migrating to Cypress 13.0
This guide details the changes and how to change your code to migrate to Cypress
diff --git a/docs/app/references/module-api.mdx b/docs/app/references/module-api.mdx
index 903bd8f30c..ee997bb427 100644
--- a/docs/app/references/module-api.mdx
+++ b/docs/app/references/module-api.mdx
@@ -1,7 +1,13 @@
---
-title: Module API
+title: 'Module API: How to run Cypress via Node.js'
+description: 'Require Cypress as a node module from your application under test and run Cypress via Node.js.'
+sidebar_label: Module API
---
+
+
+# Module API
+
You can require Cypress as a node module from your application under test and
run Cypress via Node.js. This can be useful when you want access to the test
results directly after the run. With this workflow, for example, you can:
diff --git a/docs/app/references/proxy-configuration.mdx b/docs/app/references/proxy-configuration.mdx
index 62f93f0edb..4fab3993e2 100644
--- a/docs/app/references/proxy-configuration.mdx
+++ b/docs/app/references/proxy-configuration.mdx
@@ -1,7 +1,13 @@
---
-title: Proxy Configuration
+title: 'Proxy Configuration in Cypress'
+description: 'How to configure Cypress to work with a corporate proxy'
+sidebar_label: 'Proxy Configuration'
---
+
+
+# Proxy Configuration
+
Cypress needs Internet access to work. Many companies require the use of a
corporate proxy to access the Internet. If your company does this, many
functions of Cypress will not work until you've configured Cypress to use your
diff --git a/docs/app/references/recipes.mdx b/docs/app/references/recipes.mdx
index e639d57cea..e0ccf2a007 100644
--- a/docs/app/references/recipes.mdx
+++ b/docs/app/references/recipes.mdx
@@ -1,7 +1,13 @@
---
-title: Recipes
+title: 'Cypress Recipes: How to Test Common Scenarios'
+description: 'Cypress Recipes show you how to test common scenarios in Cypress. Learn how to test the DOM, log in, use preprocessors, and more.'
+sidebar_label: Recipes
---
+
+
+# Recipes
+
Recipes show you how to test common scenarios in Cypress.
+
+# Roadmap
+
## Cypress App
At Cypress we love sharing what we are working on and are always striving to
diff --git a/docs/app/references/trade-offs.mdx b/docs/app/references/trade-offs.mdx
index f6191c457f..061bc77055 100644
--- a/docs/app/references/trade-offs.mdx
+++ b/docs/app/references/trade-offs.mdx
@@ -1,8 +1,14 @@
---
-title: Trade-offs
+title: 'Trade-offs in Cypress'
+description: 'Learn about the trade-offs you make when using Cypress, and how to work around them.'
+sidebar_label: Trade-offs
e2eSpecific: true
---
+
+
+# Trade-offs
+
Cypress automates the browser with its own unique architecture. While this
unlocks the power to do things you will not find anywhere else, there are
specific trade-offs that are made.
diff --git a/docs/app/references/troubleshooting.mdx b/docs/app/references/troubleshooting.mdx
index 4cb2805adb..34e5726575 100644
--- a/docs/app/references/troubleshooting.mdx
+++ b/docs/app/references/troubleshooting.mdx
@@ -1,7 +1,13 @@
---
-title: Troubleshooting
+title: 'Troubleshooting Cypress App'
+description: 'Resources to help you troubleshoot Cypress App issues and common steps to isolate and resolve problems.'
+sidebar_label: Troubleshooting
---
+
+
+# Troubleshooting
+
:::info
#####
What you'll learn
diff --git a/docs/app/tooling/IDE-integration.mdx b/docs/app/tooling/IDE-integration.mdx
index 3bab4954b4..471d377a3f 100644
--- a/docs/app/tooling/IDE-integration.mdx
+++ b/docs/app/tooling/IDE-integration.mdx
@@ -1,7 +1,13 @@
---
-title: IDE Integration
+title: 'IDE Integration with Cypress: VSCode, IntelliJ, and more'
+description: 'Learn how to open files in your IDE, set up intelligent code completion, and find extensions and plugins for popular IDEs.'
+sidebar_label: 'IDE Integration'
---
+
+
+# IDE Integration
+
:::info
#####
What you'll learn
diff --git a/docs/app/tooling/code-coverage.mdx b/docs/app/tooling/code-coverage.mdx
index 907a3d9ad2..5fec61cc6e 100644
--- a/docs/app/tooling/code-coverage.mdx
+++ b/docs/app/tooling/code-coverage.mdx
@@ -1,7 +1,13 @@
---
-title: Code Coverage
+title: 'Measuring Code Coverage in Cypress'
+description: 'Learn how to measure code coverage in Cypress and the difference between UI Coverage and Code Coverage.'
+sidebar_label: 'Code Coverage'
---
+
+
+# Measure Code Coverage in Cypress
+
:::info
#####
What you'll learn
diff --git a/docs/app/tooling/reporters.mdx b/docs/app/tooling/reporters.mdx
index f743a31b74..9f4bedda75 100644
--- a/docs/app/tooling/reporters.mdx
+++ b/docs/app/tooling/reporters.mdx
@@ -1,7 +1,13 @@
---
-title: Reporters
+title: 'Built-in and Custom Reporters in Cypress: Setup Guide'
+description: Learn how to use custom reporters in Cypress to output test results in different formats.
+sidebar_label: Reporters
---
+
+
+# Reporters in Cypress
+
:::info
#####
What you'll learn
diff --git a/docs/app/tooling/typescript-support.mdx b/docs/app/tooling/typescript-support.mdx
index 03f64a9b96..7c3ba44ade 100644
--- a/docs/app/tooling/typescript-support.mdx
+++ b/docs/app/tooling/typescript-support.mdx
@@ -1,7 +1,13 @@
---
-title: TypeScript
+title: 'TypeScript Support in Cypress'
+description: 'Learn how to set up TypeScript in Cypress, configure TypeScript for custom commands, assertions, and plugins and more'
+sidebar_label: 'TypeScript'
---
+
+
+# TypeScript Support
+
:::info
#####
What you'll learn
diff --git a/docs/app/tooling/visual-testing.mdx b/docs/app/tooling/visual-testing.mdx
index 5904ba43aa..d6c08930e5 100644
--- a/docs/app/tooling/visual-testing.mdx
+++ b/docs/app/tooling/visual-testing.mdx
@@ -1,7 +1,13 @@
---
-title: Visual Testing
+title: 'Visual Testing in Cypress'
+description: 'Learn how to use visual testing plugins in Cypress to ensure your application visually looks as intended.'
+sidebar_label: 'Visual Testing'
---
+
+
+# Visual Testing in Cypress
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/account-management/billing-and-usage.mdx b/docs/cloud/account-management/billing-and-usage.mdx
index b783e3fcab..049bb547eb 100644
--- a/docs/cloud/account-management/billing-and-usage.mdx
+++ b/docs/cloud/account-management/billing-and-usage.mdx
@@ -5,6 +5,10 @@ sidebar_label: Billing & Usage
sidebar_position: 50
---
+
+
+# Billing & Usage
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/account-management/data-storage-and-masking.mdx b/docs/cloud/account-management/data-storage-and-masking.mdx
index 7c94a9b67e..138ba116b7 100644
--- a/docs/cloud/account-management/data-storage-and-masking.mdx
+++ b/docs/cloud/account-management/data-storage-and-masking.mdx
@@ -5,6 +5,10 @@ sidebar_position: 80
sidebar_label: Data Storage and Controls
---
+
+
+# Data Storage and Controls
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/account-management/enterprise-sso.mdx b/docs/cloud/account-management/enterprise-sso.mdx
index 1880dc7fa9..c762236d61 100644
--- a/docs/cloud/account-management/enterprise-sso.mdx
+++ b/docs/cloud/account-management/enterprise-sso.mdx
@@ -5,6 +5,8 @@ sidebar_label: Enterprise SSO
sidebar_position: 40
---
+
+
# Enterprise SSO
:::info
diff --git a/docs/cloud/account-management/organizations.mdx b/docs/cloud/account-management/organizations.mdx
index 83d420cef6..0a08d9af06 100644
--- a/docs/cloud/account-management/organizations.mdx
+++ b/docs/cloud/account-management/organizations.mdx
@@ -5,6 +5,8 @@ sidebar_label: Organizations
sidebar_position: 20
---
+
+
# Organizations
:::info
diff --git a/docs/cloud/account-management/projects.mdx b/docs/cloud/account-management/projects.mdx
index 65df7e62a7..24f4bcdb54 100644
--- a/docs/cloud/account-management/projects.mdx
+++ b/docs/cloud/account-management/projects.mdx
@@ -5,6 +5,8 @@ sidebar_label: Projects
sidebar_position: 10
---
+
+
# Projects
:::info
diff --git a/docs/cloud/account-management/users.mdx b/docs/cloud/account-management/users.mdx
index 34864380f3..8abafa76b9 100644
--- a/docs/cloud/account-management/users.mdx
+++ b/docs/cloud/account-management/users.mdx
@@ -5,6 +5,10 @@ sidebar_position: 30
sidebar_label: Users
---
+
+
+# Manage users
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/faq.mdx b/docs/cloud/faq.mdx
index 959f24d3e8..d74bb638c2 100644
--- a/docs/cloud/faq.mdx
+++ b/docs/cloud/faq.mdx
@@ -5,6 +5,8 @@ sidebar_position: 200
sidebar_label: FAQ
---
+
+
# Cypress Cloud FAQ
## General
diff --git a/docs/cloud/features/analytics/enterprise-reporting.mdx b/docs/cloud/features/analytics/enterprise-reporting.mdx
index 355c29ed27..0d6b2e9996 100644
--- a/docs/cloud/features/analytics/enterprise-reporting.mdx
+++ b/docs/cloud/features/analytics/enterprise-reporting.mdx
@@ -1,9 +1,14 @@
---
title: Enterprise Reporting
sidebar_position: 30
+description: Enterprise Reporting in Cypress Cloud provides insights and data access to help you spot trends and anomalies, track usage, and govern your overall test program across all projects in your organization.
sidebar_custom_props: { 'new_label': true }
---
+
+
+# Enterprise Reporting
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/features/analytics/overview.mdx b/docs/cloud/features/analytics/overview.mdx
index ff0b560ced..41d244883f 100644
--- a/docs/cloud/features/analytics/overview.mdx
+++ b/docs/cloud/features/analytics/overview.mdx
@@ -3,6 +3,10 @@ title: Types of Analytics
sidebar_position: 10
---
+
+
+# Types of Analytics
+
Cypress Cloud helps you understand various aspects of your test suite from a number of perspectives.
You can monitor and govern your application quality by looking at test case statistics, common errors,
test run duration, flake rates and much more.
diff --git a/docs/cloud/features/analytics/project-analytics.mdx b/docs/cloud/features/analytics/project-analytics.mdx
index f755a8d976..9940270fc9 100644
--- a/docs/cloud/features/analytics/project-analytics.mdx
+++ b/docs/cloud/features/analytics/project-analytics.mdx
@@ -1,8 +1,13 @@
---
title: Project Analytics & Insights
+description: Cypress Cloud provides Analytics to offer insight into metrics like runs over time, run duration and visibility into tests suite size over time.
sidebar_position: 20
---
+
+
+# Project Analytics & Insights
+
Cypress Cloud provides Analytics to offer insight into metrics like runs over
time, run duration and visibility into tests suite size over time.
diff --git a/docs/cloud/features/branch-review.mdx b/docs/cloud/features/branch-review.mdx
index 164334ee6d..8b6df8cd48 100644
--- a/docs/cloud/features/branch-review.mdx
+++ b/docs/cloud/features/branch-review.mdx
@@ -1,8 +1,13 @@
---
title: Branch Review
+description: Branch Review in Cypress Cloud surfaces the impact of pull requests on your test suite. Compare test results between branches and learn best practices for grouping test runs.
sidebar_position: 50
---
+
+
+# Branch Review
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/features/flaky-test-management.mdx b/docs/cloud/features/flaky-test-management.mdx
index 0a2e7ffac3..b407ed0c48 100644
--- a/docs/cloud/features/flaky-test-management.mdx
+++ b/docs/cloud/features/flaky-test-management.mdx
@@ -1,9 +1,14 @@
---
title: Flaky Test Management
sidebar_position: 60
+description: Detect and manage flaky tests in Cypress Cloud
sidebar_label: Flake Management
---
+
+
+# Flaky Test Management
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/features/recorded-runs.mdx b/docs/cloud/features/recorded-runs.mdx
index 34ff5e35fd..3d5d6c88f1 100644
--- a/docs/cloud/features/recorded-runs.mdx
+++ b/docs/cloud/features/recorded-runs.mdx
@@ -1,8 +1,13 @@
---
title: Recorded Runs
+description: View and analyze recorded test runs in Cypress Cloud.
sidebar_position: 30
---
+
+
+# Recorded Runs
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/features/smart-orchestration/load-balancing.mdx b/docs/cloud/features/smart-orchestration/load-balancing.mdx
index 5a44c052e3..faf7bf7634 100644
--- a/docs/cloud/features/smart-orchestration/load-balancing.mdx
+++ b/docs/cloud/features/smart-orchestration/load-balancing.mdx
@@ -1,8 +1,13 @@
---
title: Load Balancing
+description: Cypress will automatically balance your spec files across the available machines in your CI provider.
sidebar_position: 30
---
+
+
+# Load Balancing
+
## Balance strategy
Cypress will automatically balance your spec files across the available machines
diff --git a/docs/cloud/features/smart-orchestration/overview.mdx b/docs/cloud/features/smart-orchestration/overview.mdx
index 1c55c20f38..de7c49982d 100644
--- a/docs/cloud/features/smart-orchestration/overview.mdx
+++ b/docs/cloud/features/smart-orchestration/overview.mdx
@@ -1,8 +1,13 @@
---
title: Overview
+description: Cypress Cloud provides four distinct Smart Orchestration features for use in CI to speed up test runs, accelerate debugging workflows, and reduce costs.
sidebar_position: 10
---
+
+
+# Smart Orchestration Overview
+
Cypress Cloud provides four distinct Smart Orchestration features for use in CI
to speed up test runs, accelerate debugging workflows, and reduce costs:
diff --git a/docs/cloud/features/smart-orchestration/parallelization.mdx b/docs/cloud/features/smart-orchestration/parallelization.mdx
index 8fb00f23a5..09a4877ed6 100644
--- a/docs/cloud/features/smart-orchestration/parallelization.mdx
+++ b/docs/cloud/features/smart-orchestration/parallelization.mdx
@@ -1,8 +1,13 @@
---
title: Parallelization
+description: Run tests in parallel across multiple machines to save time and money in Continuous Integration.
sidebar_position: 20
---
+
+
+# Parallelization
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/features/smart-orchestration/run-cancellation.mdx b/docs/cloud/features/smart-orchestration/run-cancellation.mdx
index dd9391555c..cba34a2d47 100644
--- a/docs/cloud/features/smart-orchestration/run-cancellation.mdx
+++ b/docs/cloud/features/smart-orchestration/run-cancellation.mdx
@@ -1,8 +1,13 @@
---
title: Auto Cancellation
+description: Cancel entire test runs upon the first failure with Cypress Cloud's Auto Cancellation feature.
sidebar_position: 50
---
+
+
+# Auto Cancellation
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/features/smart-orchestration/spec-prioritization.mdx b/docs/cloud/features/smart-orchestration/spec-prioritization.mdx
index 2060354503..4b6164c804 100644
--- a/docs/cloud/features/smart-orchestration/spec-prioritization.mdx
+++ b/docs/cloud/features/smart-orchestration/spec-prioritization.mdx
@@ -1,8 +1,13 @@
---
title: Spec Prioritization
+description: Run failed specs first to save time and reduce CI costs with Cypress Cloud's Spec Prioritization feature.
sidebar_position: 40
---
+
+
+# Spec Prioritization
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/features/test-replay.mdx b/docs/cloud/features/test-replay.mdx
index 904f90e007..d23c3bdafd 100644
--- a/docs/cloud/features/test-replay.mdx
+++ b/docs/cloud/features/test-replay.mdx
@@ -1,8 +1,13 @@
---
title: Test Replay
+description: Test Replay in Cypress Cloud allows developers to accurately and efficiently debug failed and flaky continuous integration test runs. It captures every test run detail, enabling developers to replay it and inspect the DOM, network requests, console logs, JavaScript errors, and element rendering as they happened in CI.
sidebar_position: 40
---
+
+
+# Test Replay
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/get-started/free-trial.mdx b/docs/cloud/get-started/free-trial.mdx
index e6844052ae..92f72a6c7a 100644
--- a/docs/cloud/get-started/free-trial.mdx
+++ b/docs/cloud/get-started/free-trial.mdx
@@ -1,8 +1,13 @@
---
title: Free Trial
+description: Start a free trial of Cypress Cloud and explore all features available in our Enterprise plan.
sidebar_position: 15
---
+
+
+# Free Trial of Cypress Cloud
+
:::info
#####
What you'll learn
diff --git a/docs/cloud/get-started/introduction.mdx b/docs/cloud/get-started/introduction.mdx
index 46895f0ea9..3d51c6c61e 100644
--- a/docs/cloud/get-started/introduction.mdx
+++ b/docs/cloud/get-started/introduction.mdx
@@ -4,7 +4,9 @@ sidebar_position: 10
sidebar_label: Introduction
---
-# Cypress Cloud
+
+
+# Scale your testing with confidence on every release
Cypress Cloud unlocks the full potential of Cypress test automation tools in your CI pipeline. Scale every facet of Cypress testing, and push your code with confidence every time.
diff --git a/docs/cloud/get-started/setup.mdx b/docs/cloud/get-started/setup.mdx
index 10cae4ccbc..8b066cbb11 100644
--- a/docs/cloud/get-started/setup.mdx
+++ b/docs/cloud/get-started/setup.mdx
@@ -1,8 +1,13 @@
---
title: Setup
+description: Learn how to set up your project to record tests in Cypress Cloud.
sidebar_position: 20
---
+
+
+# Set up your project to record in Cypress Cloud
+
:::info
diff --git a/docs/cloud/integrations/data-extract-api.mdx b/docs/cloud/integrations/data-extract-api.mdx
index 0e26f31c57..adb3fa8799 100644
--- a/docs/cloud/integrations/data-extract-api.mdx
+++ b/docs/cloud/integrations/data-extract-api.mdx
@@ -6,6 +6,8 @@ sidebar_label: Data Extract API
sidebar_custom_props: { 'new_label': true }
---
+
+
# Data Extract API
:::info
diff --git a/docs/cloud/integrations/jira.mdx b/docs/cloud/integrations/jira.mdx
index cb50e9be75..97401f0d19 100644
--- a/docs/cloud/integrations/jira.mdx
+++ b/docs/cloud/integrations/jira.mdx
@@ -5,6 +5,8 @@ sidebar_position: 30
sidebar_label: Jira
---
+
+
# Jira Integration
:::info
diff --git a/docs/cloud/integrations/slack.mdx b/docs/cloud/integrations/slack.mdx
index edffcbd95c..5a00ea81ae 100644
--- a/docs/cloud/integrations/slack.mdx
+++ b/docs/cloud/integrations/slack.mdx
@@ -5,6 +5,8 @@ sidebar_position: 40
sidebar_label: Slack
---
+
+
# Slack Integration
:::info
diff --git a/docs/cloud/integrations/source-control/bitbucket.mdx b/docs/cloud/integrations/source-control/bitbucket.mdx
index 2d4c6acd01..39c82c1728 100644
--- a/docs/cloud/integrations/source-control/bitbucket.mdx
+++ b/docs/cloud/integrations/source-control/bitbucket.mdx
@@ -5,6 +5,8 @@ sidebar_position: 30
sidebar_label: Bitbucket
---
+
+
# Bitbucket
:::info
diff --git a/docs/cloud/integrations/source-control/github.mdx b/docs/cloud/integrations/source-control/github.mdx
index 3404ba9ce6..551d65050a 100644
--- a/docs/cloud/integrations/source-control/github.mdx
+++ b/docs/cloud/integrations/source-control/github.mdx
@@ -5,6 +5,8 @@ sidebar_position: 10
sidebar_label: GitHub
---
+
+
# GitHub Integration
:::info
diff --git a/docs/cloud/integrations/source-control/gitlab.mdx b/docs/cloud/integrations/source-control/gitlab.mdx
index 225024b558..8e59b4aa89 100644
--- a/docs/cloud/integrations/source-control/gitlab.mdx
+++ b/docs/cloud/integrations/source-control/gitlab.mdx
@@ -5,6 +5,8 @@ sidebar_position: 20
sidebar_label: GitLab
---
+
+
# GitLab
:::info
diff --git a/docs/cloud/integrations/teams.mdx b/docs/cloud/integrations/teams.mdx
index 3f57c29d17..f2fe937eba 100644
--- a/docs/cloud/integrations/teams.mdx
+++ b/docs/cloud/integrations/teams.mdx
@@ -5,6 +5,10 @@ sidebar_position: 60
sidebar_label: Microsoft Teams
---
+
+
+# Microsoft Teams Integration
+
:::info
#####
What you'll learn
diff --git a/docs/ui-coverage/changelog.mdx b/docs/ui-coverage/changelog.mdx
index 43d470f32d..8ecd880326 100644
--- a/docs/ui-coverage/changelog.mdx
+++ b/docs/ui-coverage/changelog.mdx
@@ -5,6 +5,8 @@ sidebar_label: Changelog
sidebar_position: 200
---
+
+
# Changelog
## Week of 10/7/2024
diff --git a/docs/ui-coverage/configuration/attributefilters.mdx b/docs/ui-coverage/configuration/attributefilters.mdx
index 415e47248c..9792644cac 100644
--- a/docs/ui-coverage/configuration/attributefilters.mdx
+++ b/docs/ui-coverage/configuration/attributefilters.mdx
@@ -4,9 +4,9 @@ description: 'The `attributeFilters` configuration property allows users to spec
sidebar_label: attributeFilters
---
-# attributeFilters
+
-
+# attributeFilters
UI Coverage has logic that automatically [identifies](/ui-coverage/core-concepts/element-identification) and [groups](/ui-coverage/core-concepts/element-grouping) elements based on their appearance and structure in the DOM.
diff --git a/docs/ui-coverage/configuration/elementfilters.mdx b/docs/ui-coverage/configuration/elementfilters.mdx
index ee2a13261d..0beaa2cd2a 100644
--- a/docs/ui-coverage/configuration/elementfilters.mdx
+++ b/docs/ui-coverage/configuration/elementfilters.mdx
@@ -4,9 +4,9 @@ description: 'The `elementFilters` property allows you to specify selectors for
sidebar_label: elementFilters
---
-# elementFilters
+
-
+# elementFilters
:::info
Note: setting `elementFilters` impacts both Accessibility and UI Coverage
diff --git a/docs/ui-coverage/configuration/elementgroups.mdx b/docs/ui-coverage/configuration/elementgroups.mdx
index 3d2cc7800c..dd43bbc223 100644
--- a/docs/ui-coverage/configuration/elementgroups.mdx
+++ b/docs/ui-coverage/configuration/elementgroups.mdx
@@ -4,9 +4,9 @@ description: 'The `elementGroups` configuration allows you to group elements in
sidebar_label: elementGroups
---
-# elementGroups
+
-
+# elementGroups
UI Coverage has logic that automatically [groups](/ui-coverage/core-concepts/element-grouping) elements based on their appearance and structure in the DOM.
diff --git a/docs/ui-coverage/configuration/elements.mdx b/docs/ui-coverage/configuration/elements.mdx
index 716d50f5a2..4e15b840d4 100644
--- a/docs/ui-coverage/configuration/elements.mdx
+++ b/docs/ui-coverage/configuration/elements.mdx
@@ -4,9 +4,9 @@ description: 'The `elements` configuration allows you to uniquely identify eleme
sidebar_label: elements
---
-# elements
+
-
+# elements
UI Coverage has logic that automatically [identifies](/ui-coverage/core-concepts/element-identification) elements based on their appearance and structure in the DOM.
diff --git a/docs/ui-coverage/configuration/overview.mdx b/docs/ui-coverage/configuration/overview.mdx
index 405e8a00e6..16364054ed 100644
--- a/docs/ui-coverage/configuration/overview.mdx
+++ b/docs/ui-coverage/configuration/overview.mdx
@@ -5,9 +5,9 @@ sidebar_label: Overview
sidebar_position: 10
---
-# Configuration
+
-
+# Configuration
Configuration allows you to customize and fine-tune UI Coverage in Cypress to suit specific needs and scenarios. While UI Coverage is designed to work seamlessly out of the box, there are instances where custom configuration may be necessary to address unique application structures, testing requirements, or edge cases. This section guides you through setting configuration to enhance the functionality and accuracy of UI Coverage.
diff --git a/docs/ui-coverage/configuration/significantattributes.mdx b/docs/ui-coverage/configuration/significantattributes.mdx
index d6ada3bf26..296b708050 100644
--- a/docs/ui-coverage/configuration/significantattributes.mdx
+++ b/docs/ui-coverage/configuration/significantattributes.mdx
@@ -4,9 +4,9 @@ description: 'The `significantAttributes` configuration property allows users to
sidebar_label: significantAttributes
---
-# significantAttributes
+
-
+# significantAttributes
UI Coverage has logic that automatically [identifies](/ui-coverage/core-concepts/element-identification) and [groups](/ui-coverage/core-concepts/element-grouping) elements based on their appearance and structure in the DOM.
diff --git a/docs/ui-coverage/configuration/viewfilters.mdx b/docs/ui-coverage/configuration/viewfilters.mdx
index e69a235728..148a481a43 100644
--- a/docs/ui-coverage/configuration/viewfilters.mdx
+++ b/docs/ui-coverage/configuration/viewfilters.mdx
@@ -4,9 +4,9 @@ description: 'The `viewFilters` property allows you to specify URL patterns for
sidebar_label: viewFilters
---
-# viewFilters
+
-
+# viewFilters
:::info
Note: setting `viewFilters` impacts both Accessibility and UI Coverage reports.
diff --git a/docs/ui-coverage/configuration/views.mdx b/docs/ui-coverage/configuration/views.mdx
index 0c6112e83d..34b8eec80f 100644
--- a/docs/ui-coverage/configuration/views.mdx
+++ b/docs/ui-coverage/configuration/views.mdx
@@ -4,9 +4,9 @@ description: 'The `views` configuration allows you to group URLs in UI Coverage
sidebar_label: views
---
-# views
+
-
+# views
:::info
Note: setting views impacts both Accessibility and UI Coverage reports.
diff --git a/docs/ui-coverage/core-concepts/element-grouping.mdx b/docs/ui-coverage/core-concepts/element-grouping.mdx
index e2e7ccf204..6ca2ed0960 100644
--- a/docs/ui-coverage/core-concepts/element-grouping.mdx
+++ b/docs/ui-coverage/core-concepts/element-grouping.mdx
@@ -5,9 +5,9 @@ sidebar_label: Element Grouping
sidebar_position: 20
---
-# Element Grouping
+
-
+# Element Grouping
When multiple elements on a page have the same behavior, testing each element individually is not always required to ensure confidence and coverage. In many cases, interacting with just one of these elements is sufficient to verify their collective behavior. For example, options in a dropdown may be grouped if only one of the options should be tested in order to verify their behavior.
diff --git a/docs/ui-coverage/core-concepts/element-identification.mdx b/docs/ui-coverage/core-concepts/element-identification.mdx
index dfbcb67b7f..1f2e42e385 100644
--- a/docs/ui-coverage/core-concepts/element-identification.mdx
+++ b/docs/ui-coverage/core-concepts/element-identification.mdx
@@ -5,9 +5,9 @@ sidebar_label: Element Identification
sidebar_position: 20
---
-# Element Identification
+
-
+# Element Identification
Elements are uniquely identified across views and snapshots by their HTML attributes, location, and other signals in the DOM.
diff --git a/docs/ui-coverage/core-concepts/interactivity.mdx b/docs/ui-coverage/core-concepts/interactivity.mdx
index f6f55a915e..47e1fde148 100644
--- a/docs/ui-coverage/core-concepts/interactivity.mdx
+++ b/docs/ui-coverage/core-concepts/interactivity.mdx
@@ -5,9 +5,9 @@ sidebar_label: Interactivity
sidebar_position: 10
---
-# Interactivity
+
-
+# Interactivity
## Interactive Elements
diff --git a/docs/ui-coverage/core-concepts/views.mdx b/docs/ui-coverage/core-concepts/views.mdx
index 015a49cbc3..46543e3b58 100644
--- a/docs/ui-coverage/core-concepts/views.mdx
+++ b/docs/ui-coverage/core-concepts/views.mdx
@@ -5,9 +5,9 @@ sidebar_label: Views
sidebar_position: 100
---
-# Views
+
-
+# Views
UI Coverage organizes all unique URLs across snapshots from end-to-end tests and mounted components from component tests into "Views". A View represents a distinct page or state in your application.
diff --git a/docs/ui-coverage/get-started/introduction.mdx b/docs/ui-coverage/get-started/introduction.mdx
index eb110136c1..63d230a7c7 100644
--- a/docs/ui-coverage/get-started/introduction.mdx
+++ b/docs/ui-coverage/get-started/introduction.mdx
@@ -6,7 +6,9 @@ sidebar_position: 10
sidebar_custom_props: { 'new_label': true }
---
-# UI Coverage
+ Add-on
+
+
+# Identify testing gaps with UI Coverage
Easily track, monitor, and visualize the test coverage of your UI to prevent regressions by ensuring critical flows of your app are tested. Save CI resources by removing redundant tests and improve your team's productivity with a visual overview of UI coverage across every page and component.
diff --git a/docs/ui-coverage/get-started/setup.mdx b/docs/ui-coverage/get-started/setup.mdx
index 87ad0d3964..0a6349ddbd 100644
--- a/docs/ui-coverage/get-started/setup.mdx
+++ b/docs/ui-coverage/get-started/setup.mdx
@@ -5,6 +5,8 @@ sidebar_label: Get Started
sidebar_position: 20
---
+
+
# Get Started
UI Coverage works instantly, with no setup or code instrumentation required. If you record test runs to the Cypress Cloud with Test Replay, you're ready to start using UI Coverage.
diff --git a/docs/ui-coverage/results-api.mdx b/docs/ui-coverage/results-api.mdx
index e4469f3a2f..746b3c9de1 100644
--- a/docs/ui-coverage/results-api.mdx
+++ b/docs/ui-coverage/results-api.mdx
@@ -5,9 +5,9 @@ sidebar_label: Results API
sidebar_position: 100
---
-# Results API
+
-
+# Results API
The `@cypress/extract-cloud-results` module provides the `getUICoverageResults` utility which enables you to programmatically fetch your run's UI Coverage results in a CI environment. It determines the Cypress run created for the given CI workflow and will return the UI Coverage results associated with that run. The results will be returned once the Cypress run has finished and the UI Coverage report has been processed.
diff --git a/docs/ui-coverage/troubleshooting.mdx b/docs/ui-coverage/troubleshooting.mdx
index ef1955ecc4..cb78022ad1 100644
--- a/docs/ui-coverage/troubleshooting.mdx
+++ b/docs/ui-coverage/troubleshooting.mdx
@@ -5,9 +5,9 @@ sidebar_label: Troubleshooting
sidebar_position: 150
---
-# Troubleshooting
+
-
+# Troubleshooting
## A single element is showing up as multiple different elements
diff --git a/src/components/badge/style.module.css b/src/components/badge/style.module.css
index 4ca26d4ae6..a5acb2194d 100644
--- a/src/components/badge/style.module.css
+++ b/src/components/badge/style.module.css
@@ -32,6 +32,12 @@ h1 > .badge {
color: var(--ifm-color-teal-600);
}
+a:hover > .success,
+a:focus > .success {
+ background-color: var(--ifm-color-jade-200);
+ color: var(--ifm-color-jade-800);
+}
+
/* large light-green badge in page/content titles */
.hint {
background-color: #cff1e6;
diff --git a/src/components/product-heading/index.tsx b/src/components/product-heading/index.tsx
new file mode 100644
index 0000000000..e867804065
--- /dev/null
+++ b/src/components/product-heading/index.tsx
@@ -0,0 +1,51 @@
+import Icon from '@cypress-design/react-icon'
+import Badge from "@site/src/components/badge"
+import s from './style.module.css'
+
+import React from 'react';
+
+// Define the types for the props
+interface ProductHeadingProps {
+ product: 'app' | 'cloud' | 'accessibility' | 'ui-coverage'
+ plan?: 'team' | 'business' | 'enterprise'
+}
+
+// Build the Button component with the specified props
+const ProductHeading: React.FC
= ({
+ product, // The product to display
+ plan, // The plan to display for Cloud product
+}) => {
+ const productName = product === 'ui-coverage' ? 'UI Coverage' : product === 'accessibility' ? 'Cypress Accessibility' : product === 'cloud' ? 'Cypress Cloud' : 'Cypress App'
+ const iconName = product === 'ui-coverage' ? 'technology-ui-coverage' : product === 'accessibility' ? 'cypress-accessibility-outline' : 'technology-cypress'
+ const linkPath = product === 'cloud' ? 'pricing' : product
+
+ let badgeContent = product === 'cloud' ? 'Free Trial' : '+ Add-on'
+
+ if (product === 'cloud' && plan) {
+ badgeContent = plan === 'team' ? 'Team Plan' : plan === 'business' ? 'Business Plan' : 'Enterprise Plan'
+ }
+
+ return (
+
+ )
+}
+
+export default ProductHeading
\ No newline at end of file
diff --git a/src/components/product-heading/style.module.css b/src/components/product-heading/style.module.css
new file mode 100644
index 0000000000..b58aca146d
--- /dev/null
+++ b/src/components/product-heading/style.module.css
@@ -0,0 +1,19 @@
+.productHeading {
+ margin-bottom: 1rem;
+}
+
+.productHeadingIcon {
+ display: inline;
+ margin-right: 0.5rem;
+ vertical-align: text-top;
+}
+
+.productHeadingLink {
+ border-bottom: none !important;
+ outline: none;
+}
+
+.productHeadingText {
+ font-size: 1.2rem;
+ margin-right: 0.5rem;
+}
\ No newline at end of file
diff --git a/src/theme/MDXComponents.js b/src/theme/MDXComponents.js
index 98830e7ded..115d202c99 100644
--- a/src/theme/MDXComponents.js
+++ b/src/theme/MDXComponents.js
@@ -24,6 +24,7 @@ import HeaderYields from "@site/docs/partials/_header-yields.mdx";
import Icon from "@site/src/components/icon";
import ImportMountFunctions from "@site/docs/partials/_import-mount-functions.mdx";
import IntellisenseCodeCompletion from "@site/docs/partials/_intellisense-code-completion.mdx";
+import ProductHeading from "@site/src/components/product-heading";
import SupportFileConfiguration from "@site/docs/partials/_support-file-configuration.mdx";
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
@@ -167,6 +168,7 @@ export default {
Icon,
ImportMountFunctions,
IntellisenseCodeCompletion,
+ ProductHeading,
SupportFileConfiguration,
Tabs,
TabItem,