{ "doc": { "id": "app/get-started/why-cypress", "title": "Cypress testing solutions | Cypress Documentation", "description": "Explore Cypress documentation for a comprehensive guide on end-to-end, component, and accessibility testing. Discover features, commands, best practices, and get started with Cypress today", "section": "app", "source_path": "/llm/markdown/app/get-started/why-cypress.md", "version": "ce02913654e2655ee63448bdc92bb92c7b46a619", "updated_at": "2026-04-22T19:37:51.587Z", "headings": [ { "id": "app/get-started/why-cypress#why-cypress", "text": "Why Cypress?", "level": 1 }, { "id": "app/get-started/why-cypress#what-youll-learn", "text": " What you'll learn", "level": 5 }, { "id": "app/get-started/why-cypress#in-a-nutshell", "text": "In a nutshell", "level": 2 }, { "id": "app/get-started/why-cypress#products", "text": "Products", "level": 2 }, { "id": "app/get-started/why-cypress#features", "text": "Features", "level": 2 }, { "id": "app/get-started/why-cypress#cypress-app", "text": "Cypress App", "level": 3 }, { "id": "app/get-started/why-cypress#cypress-cloud", "text": "Cypress Cloud", "level": 3 }, { "id": "app/get-started/why-cypress#cypress-accessibility", "text": "Cypress Accessibility", "level": 3 }, { "id": "app/get-started/why-cypress#ui-coverage", "text": "UI Coverage", "level": 3 }, { "id": "app/get-started/why-cypress#solutions", "text": "Solutions", "level": 2 }, { "id": "app/get-started/why-cypress#end-to-end-testing", "text": "End-to-end Testing", "level": 3 }, { "id": "app/get-started/why-cypress#component-testing", "text": "Component Testing", "level": 3 }, { "id": "app/get-started/why-cypress#accessibility-testing", "text": "Accessibility Testing", "level": 3 }, { "id": "app/get-started/why-cypress#ui-coverage", "text": "UI Coverage", "level": 3 }, { "id": "app/get-started/why-cypress#other", "text": "Other", "level": 3 }, { "id": "app/get-started/why-cypress#our-mission", "text": "Our mission", "level": 2 }, { "id": "app/get-started/why-cypress#key-differences", "text": "Key Differences", "level": 2 }, { "id": "app/get-started/why-cypress#architecture", "text": "Architecture", "level": 3 }, { "id": "app/get-started/why-cypress#native-access", "text": "Native access", "level": 3 }, { "id": "app/get-started/why-cypress#shortcuts", "text": "Shortcuts", "level": 3 }, { "id": "app/get-started/why-cypress#flake-resistant", "text": "Flake resistant", "level": 3 }, { "id": "app/get-started/why-cypress#debuggability", "text": "Debuggability", "level": 3 }, { "id": "app/get-started/why-cypress#trade-offs", "text": "Trade offs", "level": 3 }, { "id": "app/get-started/why-cypress#get-started", "text": "Get Started", "level": 2 }, { "id": "app/get-started/why-cypress#cypress-in-the-real-world", "text": "Cypress in the Real World", "level": 2 } ] }, "content": { "type": "root", "children": [ { "type": "heading", "depth": 1, "children": [ { "type": "text", "value": "Why Cypress?" } ] }, { "type": "heading", "depth": 5, "children": [ { "type": "text", "value": " What you'll learn" } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "The solutions Cypress provides for testing" } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "The features of Cypress App, Cypress Cloud, UI Coverage, and Cypress Accessibility" } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Our mission and what we believe in" } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Key differences between Cypress and other testing tools" } ] } ] } ] }, { "type": "heading", "depth": 2, "children": [ { "type": "text", "value": "In a nutshell" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress is a next generation front end testing tool built for the modern web.\nWe address the key pain points teams\nface when testing modern applications and maintaining test suites." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Our users are typically developers, QA engineers, and teams looking to build web applications\nand increase the quality of their existing applications." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress provides solutions for:" } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "#End-to-end-Testing", "children": [ { "type": "text", "value": "End-to-end testing" } ] } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "#Component-Testing", "children": [ { "type": "text", "value": "Component testing" } ] } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "#Accessibility-Testing", "children": [ { "type": "text", "value": "Accessibility testing" } ] } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "#UI-Coverage-1", "children": [ { "type": "text", "value": "UI Coverage" } ] } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "#Other", "children": [ { "type": "text", "value": "and more..." } ] } ] } ] } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress can test anything that runs in a browser and surface insights into how to improve the health\nof your test suite and the quality of your application." } ] }, { "type": "heading", "depth": 2, "children": [ { "type": "text", "value": "Products" } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "/llm/markdown/app/core-concepts/open-mode.md", "children": [ { "type": "text", "value": "Cypress App" } ] }, { "type": "text", "value": ", a free,\n" }, { "type": "link", "title": null, "url": "https://github.com/cypress-io/cypress", "children": [ { "type": "text", "value": "open source" } ] }, { "type": "text", "value": ",\nlocally installed app for writing and running tests." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "/llm/markdown/cloud/get-started/introduction.md", "children": [ { "type": "text", "value": "Cypress Cloud" } ] }, { "type": "text", "value": ", a paid service for recording tests, surfacing test results, and providing test analytics." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "/llm/markdown/ui-coverage/get-started/introduction.md", "children": [ { "type": "text", "value": "UI Coverage" } ] }, { "type": "text", "value": ", a premium solution providing a visual overview of test coverage across every page and component of your app, offering clear insights into uncovered areas that everyone can understand." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "/llm/markdown/accessibility/get-started/introduction.md", "children": [ { "type": "text", "value": "Cypress Accessibility" } ] }, { "type": "text", "value": ", a premium solution providing accessibility checks, which helps detect barriers for people with disabilities using your application." } ] } ] } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress is a robust solution that can improve the quality of your application." } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "First: Cypress helps you set up and start writing tests every day while\nyou build your application locally. Test Driven Development at its best!" } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Next: After building up a suite of tests and\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/continuous-integration/overview.md", "children": [ { "type": "text", "value": "integrating Cypress" } ] }, { "type": "text", "value": " with your\nCI Provider, " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/get-started/introduction.md", "children": [ { "type": "text", "value": "Cypress Cloud" } ] }, { "type": "text", "value": " can record your test\nruns surfacing exactly what happened during the test in " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/features/test-replay.md", "children": [ { "type": "text", "value": "Test Replay" } ] }, { "type": "text", "value": ". Use " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/cloud-mcp.md", "children": [ { "type": "text", "value": "Cloud MCP" } ] }, { "type": "text", "value": " to give your AI coding assistant the same run and failure context in your IDE. You'll never have to wonder: Why did this fail?" } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Finally: Add on " }, { "type": "link", "title": null, "url": "/llm/markdown/accessibility/get-started/introduction.md", "children": [ { "type": "text", "value": "Cypress Accessibility" } ] }, { "type": "text", "value": " to get continuous feedback on accessibility issues and regressions, and " }, { "type": "link", "title": null, "url": "/llm/markdown/ui-coverage/get-started/introduction.md", "children": [ { "type": "text", "value": "UI Coverage" } ] }, { "type": "text", "value": " to ensure you've tested\nevery part of your application." } ] } ] } ] }, { "type": "heading", "depth": 2, "children": [ { "type": "text", "value": "Features" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Below are listed some of the key features of each product." } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Cypress App" } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Time Travel: Cypress takes snapshots as your tests run. Hover over\ncommands in the " }, { "type": "link", "title": null, "url": "/llm/markdown/app/core-concepts/open-mode.md#Command-Log", "children": [ { "type": "text", "value": "Command Log" } ] }, { "type": "text", "value": "\nto see exactly what happened at each step." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Debuggability: Stop guessing why your tests are failing.\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/guides/debugging.md", "children": [ { "type": "text", "value": "Debug directly" } ] }, { "type": "text", "value": " from familiar tools like Developer\nTools. Our readable errors and stack traces make debugging lightning fast." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Automatic Waiting: Never add waits or sleeps to your tests. Cypress\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/core-concepts/introduction-to-cypress.md#Cypress-is-Not-Like-jQuery", "children": [ { "type": "text", "value": "automatically waits" } ] }, { "type": "text", "value": "\nfor commands and assertions before moving on. No more async hell." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Spies, Stubs, and Clocks: Verify and\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/guides/stubs-spies-and-clocks.md", "children": [ { "type": "text", "value": "control the behavior" } ] }, { "type": "text", "value": " of functions,\nserver responses, or timers. The same functionality you love from unit testing\nis right at your fingertips." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Network Traffic Control: Easily\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/guides/network-requests.md", "children": [ { "type": "text", "value": "control, stub, and test edge cases" } ] }, { "type": "text", "value": " without\ninvolving your server. You can stub network traffic however you like." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Consistent Results: Our architecture doesn't use Selenium or WebDriver.\nSay hello to fast, consistent and reliable tests that are flake-free." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress Studio & Studio AI: Record interactions in your app to generate and\nextend E2E tests, and let " }, { "type": "link", "title": null, "url": "/llm/markdown/app/guides/cypress-studio.md", "children": [ { "type": "text", "value": "Studio AI" } ] }, { "type": "text", "value": " recommend\nassertions automatically so you write less and cover more." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Cross Browser Testing: Run tests within Firefox and Chrome-family browsers\n(including Edge and Electron) locally and\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/guides/cross-browser-testing.md", "children": [ { "type": "text", "value": "in a Continuous Integration pipeline" } ] }, { "type": "text", "value": "." } ] } ] } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Cypress Cloud" } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Test Replay: Record to " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/get-started/introduction.md", "children": [ { "type": "text", "value": "Cypress Cloud" } ] }, { "type": "text", "value": " and replay the test exactly as it executed during the run for zero-configuration debugging using " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/features/test-replay.md", "children": [ { "type": "text", "value": "Test Replay" } ] }, { "type": "text", "value": "." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Smart Orchestration: Once you're set up to record to Cypress Cloud, easily\n" }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/features/smart-orchestration/parallelization.md", "children": [ { "type": "text", "value": "parallelize" } ] }, { "type": "text", "value": " your test\nsuite, rerun failed specs first with\n" }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/features/smart-orchestration/spec-prioritization.md", "children": [ { "type": "text", "value": "Spec Prioritization" } ] }, { "type": "text", "value": ",\nand cancel test runs on failures with\n" }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/features/smart-orchestration/run-cancellation.md", "children": [ { "type": "text", "value": "Auto Cancellation" } ] }, { "type": "text", "value": " for\ntight feedback loops." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Flake Detection: Discover and diagnose unreliable tests with Cypress\nCloud's " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/features/flaky-test-management.md", "children": [ { "type": "text", "value": "Flaky test management" } ] }, { "type": "text", "value": "." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Branch Review: Quickly identify the impact a pull request might have on your test suite in a single view using " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/features/branch-review.md", "children": [ { "type": "text", "value": "Branch Review" } ] }, { "type": "text", "value": ". Compare which tests are failing, flaky, pending, added, or modified between the source and base branches and prevent the merging of low-quality code." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Integrations: Integrate with " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/github.md", "children": [ { "type": "text", "value": "GitHub" } ] }, { "type": "text", "value": ", " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/gitlab.md", "children": [ { "type": "text", "value": "GitLab" } ] }, { "type": "text", "value": ", or " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/bitbucket.md", "children": [ { "type": "text", "value": "Bitbucket" } ] }, { "type": "text", "value": " to see test results directly on every push or pull request. Cypress Cloud also integrates with\n" }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/slack.md", "children": [ { "type": "text", "value": "Slack" } ] }, { "type": "text", "value": ", " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/jira.md", "children": [ { "type": "text", "value": "Jira" } ] }, { "type": "text", "value": ", and " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/teams.md", "children": [ { "type": "text", "value": "Microsoft Teams" } ] }, { "type": "text", "value": " to keep your team in the loop." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Test Analytics: Track test results over time with " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/features/analytics/overview.md", "children": [ { "type": "text", "value": "Test Analytics" } ] }, { "type": "text", "value": " to identify trends, regressions, and improvements in your test suite. Use our " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/data-extract-api.md", "children": [ { "type": "text", "value": "Data Extract API" } ] }, { "type": "text", "value": " to extract the data that is important to your team." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress Cloud MCP : Give AI coding assistants a direct window into your application's health and stability by connecting to " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/cloud-mcp.md", "children": [ { "type": "text", "value": "Cypress Cloud MCP" } ] }, { "type": "text", "value": "." } ] } ] } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Cypress Accessibility" } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Accessibility Checks: Maximize the value of your existing Cypress tests by instantly adding thousands of " }, { "type": "link", "title": null, "url": "/llm/markdown/accessibility/get-started/introduction.md", "children": [ { "type": "text", "value": "accessibility checks" } ] }, { "type": "text", "value": " with no setup, code changes, or performance penalty." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Run-level reports: Get a detailed report of accessibility issues found in your test runs with " }, { "type": "link", "title": null, "url": "/llm/markdown/accessibility/core-concepts/run-level-reports.md", "children": [ { "type": "text", "value": "Run-level reports" } ] }, { "type": "text", "value": "." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Results where you work: Use the " }, { "type": "link", "title": null, "url": "/llm/markdown/accessibility/guides/results-api.md", "children": [ { "type": "text", "value": "Results API" } ] }, { "type": "text", "value": " to integrate results into CI, and " }, { "type": "link", "title": null, "url": "/llm/markdown/cloud/integrations/cloud-mcp.md", "children": [ { "type": "text", "value": "Cloud MCP" } ] }, { "type": "text", "value": " to surface them in your AI agent for faster diagnosis and iteration." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Branch Review: Compare any report against a baseline to review only the new violations, without any noise from existing issues." } ] } ] } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "UI Coverage" } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Visualize Coverage: " }, { "type": "link", "title": null, "url": "/llm/markdown/ui-coverage/get-started/introduction.md", "children": [ { "type": "text", "value": "UI Coverage" } ] }, { "type": "text", "value": " provides a visual overview of test coverage across every page and component of your app, offering clear insights into uncovered areas that everyone can understand." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Results API: Use the UI Coverage " }, { "type": "link", "title": null, "url": "/llm/markdown/ui-coverage/results-api.md", "children": [ { "type": "text", "value": "Results API" } ] }, { "type": "text", "value": " to programmatically access test coverage data and integrate it into your existing workflows." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Branch Review: Compare runs to see newly introduced elements in your application or unexpected reductions in test coverage." } ] } ] } ] }, { "type": "heading", "depth": 2, "children": [ { "type": "text", "value": "Solutions" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress can be used to ensure several different types of test. This can provide\neven more confidence that your application under test is working as intended and accessible to all users." } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "End-to-end Testing" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress was originally designed to run " }, { "type": "link", "title": null, "url": "/llm/markdown/app/end-to-end-testing/writing-your-first-end-to-end-test.md", "children": [ { "type": "text", "value": "end-to-end (E2E) tests" } ] }, { "type": "text", "value": " on anything that\nruns in a browser. A typical E2E test visits the application in a browser and\nperforms actions via the UI just like a real user would." } ] }, { "type": "code", "lang": "js", "meta": null, "value": "it('adds todos', () => {\n cy.visit('https://example.cypress.io/')\n cy.get('[data-cy=\"new-todo\"]').type('write tests{enter}')\n // confirm the application is showing one item\n cy.get('[data-cy=\"todos\"]').should('have.length', 1)\n})" }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Component Testing" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress " }, { "type": "link", "title": null, "url": "/llm/markdown/app/component-testing/get-started.md", "children": [ { "type": "text", "value": "Component Testing" } ] }, { "type": "text", "value": " provides a component workbench for you to quickly\nbuild and test components from multiple front-end UI libraries — no matter how\nsimple or complex." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Learn more about how to test components for\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/component-testing/react/overview.md", "children": [ { "type": "text", "value": "React" } ] }, { "type": "text", "value": ",\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/component-testing/angular/overview.md", "children": [ { "type": "text", "value": "Angular" } ] }, { "type": "text", "value": ",\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/component-testing/vue/overview.md", "children": [ { "type": "text", "value": "Vue" } ] }, { "type": "text", "value": ", and\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/component-testing/svelte/overview.md", "children": [ { "type": "text", "value": "Svelte" } ] }, { "type": "text", "value": "." } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Accessibility Testing" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "You can write Cypress tests to check the accessibility of your application, and use plugins to run broad accessibility scans.\nWhen combined with " }, { "type": "link", "title": null, "url": "/llm/markdown/accessibility/get-started/introduction.md", "children": [ { "type": "text", "value": "Cypress Accessibility" } ] }, { "type": "text", "value": " in Cypress Cloud, insights can be surfaced when specific\naccessibility standards are not met through your testing - with no configuration required. See our " }, { "type": "link", "title": null, "url": "/llm/markdown/app/guides/accessibility-testing.md", "children": [ { "type": "text", "value": "Accessibility Testing guide" } ] }, { "type": "text", "value": " for more details." } ] }, { "type": "code", "lang": "js", "meta": null, "value": "it('adds todos', () => {\n cy.visit('https://example.cypress.io/')\n cy.get('img#logo')\n // Assert that an image has the correct alt text\n .should('have.attr', 'alt', 'Cypress Logo')\n})" }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "UI Coverage" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "You can increase release confidence by closing testing gaps in critical app flows using " }, { "type": "link", "title": null, "url": "/llm/markdown/ui-coverage/get-started/introduction.md", "children": [ { "type": "text", "value": "UI Coverage" } ] }, { "type": "text", "value": ". Leverage data-driven insights to cover untested areas, reduce incidents, and improve app quality." } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Other" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress can perform arbitrary HTTP calls, thus you can use it for API testing." } ] }, { "type": "code", "lang": "js", "meta": null, "value": "it('adds a todo', () => {\n cy.request('POST', '/todos', { title: 'Write API Tests' })\n .its('body')\n .should('contain', { title: 'Write API Tests' })\n})" }, { "type": "paragraph", "children": [ { "type": "text", "value": "And through a large number of " }, { "type": "link", "title": null, "url": "/llm/markdown/app/plugins/plugins-list.md", "children": [ { "type": "text", "value": "official and 3rd party plugins" } ] }, { "type": "text", "value": "\nyou can write many other types of tests!" } ] }, { "type": "heading", "depth": 2, "children": [ { "type": "text", "value": "Our mission" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Our mission is to build a thriving testing solution that enhances\nproductivity, makes testing an enjoyable experience, and generates developer\nhappiness. We hold ourselves accountable to champion a testing process that\nactually works." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "We believe our documentation should be approachable. This means enabling our\nreaders to understand fully not just the what but the why as well." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "We want to help developers build a new generation of modern applications faster,\nbetter, and without the stress and anxiety associated with managing tests. We\naim to elevate the art of software development by leveraging test results to\ngenerate actionable insights for long-term stability by proactively identifying\nareas for improvement." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "We know that in order for us to be successful we must enable, nurture, and\nfoster an ecosystem that thrives on open source. Every line of test code is an\ninvestment in your codebase, it will never be coupled to us as a paid\nservice or company. Tests will be able to run and work independently, always." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "We believe testing needs a lot of ❤️ and we are here to build a tool, a service,\nand a community that everyone can learn and benefit from. We're solving the\nhardest pain points shared by every developer working on the web. We believe in\nthis mission and hope that you will join us to make Cypress a lasting ecosystem\nthat makes everyone happy." } ] }, { "type": "heading", "depth": 2, "children": [ { "type": "text", "value": "Key Differences" } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Architecture" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Most testing tools (like Selenium) operate by running outside of the browser and\nexecuting remote commands across the network. Cypress is the exact opposite.\nCypress is executed in the same run loop as your application." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Behind Cypress is a Node server process. Cypress and the Node process constantly\ncommunicate, synchronize, and perform tasks on behalf of each other. Having\naccess to both parts (front and back) gives us the ability to respond to your\napplication's events in real time, while at the same time work outside of the\nbrowser for tasks that require a higher privilege." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress ultimately controls the entire automation process from top to bottom,\nwhich puts it in the unique position of being able to understand everything\nhappening in and outside of the browser. This means Cypress is capable of\ndelivering more consistent results than any other testing tool." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Because Cypress is\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/get-started/install-cypress.md", "children": [ { "type": "text", "value": "installed locally" } ] }, { "type": "text", "value": " on your machine,\nit can additionally tap into the operating system for automation tasks. This\nmakes performing tasks such as\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/guides/screenshots-and-videos.md", "children": [ { "type": "text", "value": "taking screenshots, recording videos" } ] }, { "type": "text", "value": ",\ngeneral " }, { "type": "link", "title": null, "url": "/llm/markdown/api/commands/exec.md", "children": [ { "type": "text", "value": "file system operations" } ] }, { "type": "text", "value": " and\n" }, { "type": "link", "title": null, "url": "/llm/markdown/api/commands/request.md", "children": [ { "type": "text", "value": "network operations" } ] }, { "type": "text", "value": " possible." } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Native access" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Because Cypress operates within your application, that means it has native\naccess to every single object. Whether it is the `window`, the `document`, a DOM\nelement, your application instance, a function, a timer, a service worker, or\nanything else - you have access to it in your Cypress tests." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "For instance you can:" } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "/llm/markdown/api/commands/stub.md", "children": [ { "type": "text", "value": "Stub" } ] }, { "type": "text", "value": " the browser or your application's functions and\nforce them to behave as needed in your test case." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Expose data stores so you can programmatically alter the state\nof your application directly from your test code." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Test edge cases like 'empty views' by forcing your server to send empty\nresponses." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Test how your application responds to errors on your server by modifying\nresponse status codes to be 500." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Modify DOM elements directly - like forcing hidden elements to be shown." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Use 3rd party plugins programmatically. Instead of fussing with complex UI\nwidgets like multi selects, autocompletes, drop downs, tree views or\ncalendars, you can call methods directly from your test code to control them." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "/llm/markdown/app/references/configuration.md#blockHosts", "children": [ { "type": "text", "value": "Prevent Google Analytics from loading before any of your application code executes" } ] }, { "type": "text", "value": "\nwhen testing." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Get synchronous notifications whenever your application transitions to a new\npage or when it begins to unload." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "/llm/markdown/api/commands/clock.md", "children": [ { "type": "text", "value": "Control time by moving forward or backward" } ] }, { "type": "text", "value": " so that\ntimers or polls automatically fire without having to wait for the required\ntime in your tests." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "Add your own event listeners to respond to your application. You could update\nyour application code to behave differently when under tests in Cypress. You\ncan control WebSocket messages from within Cypress, conditionally load 3rd\nparty scripts, or call functions directly on your application." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "For " }, { "type": "link", "title": null, "url": "/llm/markdown/app/component-testing/get-started.md", "children": [ { "type": "text", "value": "Component Tests" } ] }, { "type": "text", "value": ", Cypress is browser-based, allowing you to test not only your component's\nfunctionality but also styles and appearance. You can visually see your\ncomponent in action and interact with it in the app." } ] } ] } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Shortcuts" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress allows for browser context to be cached with\n" }, { "type": "link", "title": null, "url": "/llm/markdown/api/commands/session.md", "children": [ { "type": "text", "value": "`cy.session()`" } ] }, { "type": "text", "value": ". This means as a user, you only need to\nperform authentication once for the entirety of your test suite, and restore the\nsaved session between each test. That means you do not have to visit a login\npage, type in a username and password and wait for the page to load and/or\nredirect for every test you run. You can accomplish this once with\n" }, { "type": "link", "title": null, "url": "/llm/markdown/api/commands/session.md", "children": [ { "type": "text", "value": "`cy.session()`" } ] }, { "type": "text", "value": " and if needed,\n" }, { "type": "link", "title": null, "url": "/llm/markdown/api/commands/origin.md", "children": [ { "type": "text", "value": "`cy.origin()`" } ] }, { "type": "text", "value": "." } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Flake resistant" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress knows and understands everything that happens in your application\nsynchronously. It is notified the moment the page loads and the moment the page\nunloads. Cypress even knows how fast an element is animating and will\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/core-concepts/interacting-with-elements.md#Animations", "children": [ { "type": "text", "value": "wait for it to stop animating" } ] }, { "type": "text", "value": ".\nAdditionally, it\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/core-concepts/interacting-with-elements.md#Visibility", "children": [ { "type": "text", "value": "automatically waits for elements to become visible" } ] }, { "type": "text", "value": ",\nto " }, { "type": "link", "title": null, "url": "/llm/markdown/app/core-concepts/interacting-with-elements.md#Disability", "children": [ { "type": "text", "value": "become enabled" } ] }, { "type": "text", "value": ",\nand to\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/core-concepts/interacting-with-elements.md#Covering", "children": [ { "type": "text", "value": "stop being covered" } ] }, { "type": "text", "value": ".\nWhen pages begin to transition, Cypress will pause command execution until the\nfollowing page is fully loaded. You can also tell Cypress to\n" }, { "type": "link", "title": null, "url": "/llm/markdown/api/commands/wait.md", "children": [ { "type": "text", "value": "wait" } ] }, { "type": "text", "value": " on specific network requests to finish." } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Debuggability" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Above all else Cypress is built for usability." } ] }, { "type": "list", "ordered": false, "start": null, "spread": false, "children": [ { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "There are hundreds of custom error messages describing the exact reason Cypress\nfailed your test." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "There is a rich UI which visually shows you the command execution, assertions,\nnetwork requests, spies, stubs, page loads, or URL changes." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "The Cypress App takes snapshots of your application and enables you to time travel back\nto the state it was in when commands ran." } ] } ] }, { "type": "listItem", "spread": false, "checked": null, "children": [ { "type": "paragraph", "children": [ { "type": "text", "value": "You can use the Developer Tools while your tests run to see every console\nmessage or network request. You can inspect elements and use\ndebugger statements in your spec or application code - you can use all the tools you're already comfortable with. This\nenables you to test and develop all at the same time." } ] } ] } ] }, { "type": "heading", "depth": 3, "children": [ { "type": "text", "value": "Trade offs" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "While there are many new and powerful capabilities of Cypress - there are also\nimportant trade-offs that we've made in making this possible." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "If you're interested in understanding more, we've written\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/references/trade-offs.md", "children": [ { "type": "text", "value": "an entire guide" } ] }, { "type": "text", "value": " on this topic." } ] }, { "type": "heading", "depth": 2, "children": [ { "type": "text", "value": "Get Started" } ] }, { "type": "paragraph", "children": [ { "type": "link", "title": null, "url": "/llm/markdown/app/get-started/install-cypress.md", "children": [ { "type": "text", "value": "Install Cypress" } ] }, { "type": "text", "value": " so you can quickly see your first passing test within minutes for\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/end-to-end-testing/writing-your-first-end-to-end-test.md", "children": [ { "type": "text", "value": "End-to-end tests" } ] }, { "type": "text", "value": " or\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/component-testing/get-started.md", "children": [ { "type": "text", "value": "Component tests" } ] }, { "type": "text", "value": "." } ] }, { "type": "heading", "depth": 2, "children": [ { "type": "text", "value": "Cypress in the Real World" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "Cypress makes it quick and easy to start testing, and as you begin to test your\napp, you'll often wonder if you're using best practices or scalable\nstrategies." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "/* prettier-ignore */" } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "To guide the way, the Cypress team has created the ,\na full stack example application that demonstrates testing with Cypress in practical and realistic\nscenarios." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "The RWA achieves full " }, { "type": "link", "title": null, "url": "/llm/markdown/app/tooling/code-coverage.md", "children": [ { "type": "text", "value": "code-coverage" } ] }, { "type": "text", "value": " with\nend-to-end tests\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/guides/cross-browser-testing.md", "children": [ { "type": "text", "value": "across multiple browsers" } ] }, { "type": "text", "value": " and\n" }, { "type": "link", "title": null, "url": "/llm/markdown/api/commands/viewport.md", "children": [ { "type": "text", "value": "device sizes" } ] }, { "type": "text", "value": ", but also includes\n" }, { "type": "link", "title": null, "url": "/llm/markdown/app/tooling/visual-testing.md", "children": [ { "type": "text", "value": "visual regression tests" } ] }, { "type": "text", "value": ", API tests, unit\ntests, and runs them all in an\n" }, { "type": "link", "title": null, "url": "https://cloud.cypress.io/projects/7s5okt", "children": [ { "type": "text", "value": "efficient CI pipeline" } ] }, { "type": "text", "value": ". Use the RWA\nto learn, experiment, tinker, and practice web application testing with\nCypress." } ] }, { "type": "paragraph", "children": [ { "type": "text", "value": "The app is bundled with everything you need,\n" }, { "type": "link", "title": null, "url": "https://github.com/cypress-io/cypress-realworld-app", "children": [ { "type": "text", "value": "just clone the repository" } ] }, { "type": "text", "value": "\nand start testing." } ] } ] }, "token_estimate": 3332 }