Introduction to Automated End-to-End Testing Using Cypress ![rw-book-cover](https://videos.files.wordpress.com/cKWTLhkG/video-9ed65be391_mp4_hd.original.jpg) ## Metadata - Author: [[WordPress.tv]] - Full Title: Introduction to Automated End-to-End Testing Using Cypress - Category: #articles - Document Note: --- tags: [WordPress, Testing, Cypress, End-to-End, DevOps, CI/CD] author: Paul Gilzow source: WordPress.tv reference: [https://wordpress.tv/2025/11/10/introduction-to-automated-end-to-end-testing-using-cypress/] date created: 2025-11-10 13:45 --- # 🏷️ Title: Introduction to Automated End-to-End Testing Using Cypress ## 🧭 Table of Contents - [📝 Summary](#-summary) - [📖 Main Content](#-main-content) - [🗒️ Notes](#️-notes) - [📚 References](#-references) - [🗣️ Paraphrase](#️-paraphrase) - [📰 Newsletter](#-newsletter) - [✅ Action Items](#-action-items) - [🧪 Hypotheses](#-hypotheses) - [📊 Methodology](#-methodology) - [❓ Questions](#-questions) - [🔮 Future Research](#-future-research) - [💡 Implications](#-implications) - [🧠 Learning Styles Assessment](#-learning-styles-assessment) - [📊 Accessibility Assessment](#-accessibility-assessment) - [🌍 DEIB Assessment](#-deib-assessment) - [✅ Logical Validity](#-logical-validity) - [🛡️ DARVO Analysis](#-darvo-analysis) - [🎯 Conclusion](#-conclusion) ### 🔗 References - [Cypress.io](https://www.cypress.io/) - Official Cypress testing framework - [Platform.sh](https://platform.sh/) - Cloud application platform mentioned by speaker - [GitHub Actions for Cypress](https://github.com/cypress-io/github-action) - CI/CD integration - [Cypress Cloud](https://www.cypress.io/cloud) - Test recording and debugging platform ## 📝 Summary Paul Gilzow, developer advocate at Platform.sh and former programmer analyst at the University of Missouri, introduces end-to-end (E2E) testing using Cypress at WordCamp. The presentation covers the fundamentals of E2E testing, demonstrates practical Cypress implementation, and shows real-world CI/CD integration with GitHub Actions and Platform.sh environments. **What happened:** A comprehensive walkthrough of Cypress E2E testing from installation through production integration, including live coding demonstrations and GitHub Actions workflow examples. **Why it matters:** E2E testing significantly reduces costs by catching bugs before production, automates manual testing workflows, and provides confidence in application functionality from the user's perspective. This is particularly valuable for WordPress developers managing complex sites with multiple features and user roles. **Key stakeholders:** WordPress developers, DevOps engineers, QA teams, hosting providers, and open source project maintainers who need reliable testing strategies. **Risks and tradeoffs:** E2E tests can be slower than unit tests, require maintenance as applications change, and may have false positives. Initial setup requires time investment and learning curve. Tests can become brittle if not properly architected with good selectors and waiting strategies. **Bottom line:** Cypress provides an accessible, developer-friendly framework for automating E2E tests with excellent debugging capabilities, making it practical for WordPress projects to implement comprehensive testing that catches issues before they reach production. ## 📖 Main Content ### What is End-to-End Testing? End-to-end testing validates application functionality from the user's perspective by testing complete workflows in production-like environments. Unlike unit testing (which tests individual code components) or integration testing (which tests component interactions), E2E testing mimics real user behavior by navigating through the application interface, performing actions, and verifying expected outcomes. Paul Gilzow defines it as "testing the application from the user's perspective in totality" - walking through the application to mimic real users in production-like environments to verify the application works as anticipated. ### Why Cypress? The presentation positions Cypress as a particularly accessible E2E testing framework with several advantages: 1. **Easy installation and setup** via npm/yarn with minimal configuration required 2. **Interactive test runner** that shows visual feedback as tests execute 3. **Time-travel debugging** that lets developers see exactly what happened at each test step 4. **Automatic waiting** for elements to appear, reducing flaky tests 5. **Built-in screenshot and video recording** for failed tests 6. **Strong CI/CD integration** including official GitHub Actions ### Core Testing Workflow The presentation demonstrates a typical testing workflow: 1. **Installation:** `npm install cypress --save-dev` 2. **Initialization:** `npx cypress open` creates default folder structure 3. **Test creation:** Writing tests in `cypress/e2e/` directory using describe/it blocks 4. **Execution:** Running tests interactively or headlessly 5. **CI/CD integration:** Implementing automated testing on pull requests ### Key Cypress Concepts Covered **Selectors and Assertions:** - Using `cy.get()` to find elements via CSS selectors, data attributes, or text content - Chaining assertions like `.should('exist')`, `.should('be.visible')`, `.should('contain', 'text')` - Best practice: Use `data-cy` attributes for stable, test-specific selectors **Navigation and Interactions:** - `cy.visit()` to navigate to URLs - `.click()`, `.type()`, `.select()` for user actions - `.check()` and `.uncheck()` for checkboxes and radio buttons **Waiting Strategies:** - Cypress automatically waits for elements and commands - Custom waits with `cy.wait(milliseconds)` or waiting for network requests - Using aliases to wait for specific XHR/fetch requests **Authentication Testing:** - Demonstrating login workflows - Session persistence across tests - Testing different user roles (editor, administrator, etc.) ### Real-World Implementation Example The presentation concludes with a production scenario showing: 1. **GitHub integration** with Platform.sh that automatically creates preview environments for pull requests 2. **Cypress GitHub Action** that runs tests against these preview environments 3. **Test failure detection** that prevents merging broken code 4. **Cypress Cloud integration** for viewing failed test recordings and debugging In the demonstrated example, a test caught a permission regression where an editor role lost the ability to delete their own posts - the trash icon was missing, causing the test to fail and blocking the PR merge. ### Uncertainties and Contested Claims The presentation is primarily instructional without significant contested claims. However, some considerations: - **Performance claims** about Cypress being "fast" are relative and context-dependent - **Ease of use** assertions are subjective and depend on developer experience - The claim that E2E tests "reduce costs" assumes proper implementation and maintenance - Platform.sh integration examples are vendor-specific and may not apply universally ## 🗒️ Notes #### ⏱️ [00:00:06](https://videopress.com/v/cKWTLhkG?at=6) Introduction and Speaker Background - Paul Gilzow introduced as developer advocate at Platform.sh - Former programmer analyst at University of Missouri - Web application accessibility evangelist - Presents and teaches software instruction internationally #### ⏱️ [00:00:35](https://videopress.com/v/cKWTLhkG?at=35) Platform.sh Overview - Cloud application platform that removes infrastructure management complexity - Supports multiple frameworks: Drupal, WordPress, Django, Sylius - Handles scaling from one site to thousands - Plays crucial role in E2E testing workflows through preview environments #### ⏱️ [00:01:10](https://videopress.com/v/cKWTLhkG?at=70) Session Goals and Objectives - Define what end-to-end testing is - Recall at least one benefit of E2E testing in workflows - Understand how to install, configure, and write first Cypress test - Build foundational knowledge for writing additional tests #### ⏱️ [00:01:54](https://videopress.com/v/cKWTLhkG?at=114) Defining End-to-End Testing - Audience participation: How do you test a new feature? - Manual testing: log in, navigate, perform actions, verify response - E2E testing automates this exact workflow - Tests application from user's perspective in totality - Mimics real users in production-like environments - Verifies application works as anticipated #### ⏱️ [00:02:42](https://videopre - Summary: Every year we’re asked to “do more with less” while budgets continue to shrink. As a development team, how do we continue to manage all our responsibilities while taking on even more? Automation. W… - URL: https://wordpress.tv/2025/11/10/introduction-to-automated-end-to-end-testing-using-cypress/ Some content could not be imported from the original document. [View content ↗](https://video.wordpress.com/embed/cKWTLhkG?hd=1&autoPlay=0&permalink=1&loop=0&preloadContent=metadata&muted=0&playsinline=0&controls=1&cover=1) Every year we’re asked to “do more with less” while budgets continue to shrink. As a development team, how do we continue to manage all our responsibilities while taking on even more? Automation. While developers understand how helpful automated testing can be, getting started can be overwhelming. Finding time to learn and research, as well as designing tests tailored to specific needs, can be daunting. As a result, automated testing is often pushed to the back burner and forgotten due to various constraints. In this workshop, attendees will gain insight into the benefits of end-to-end testing. This involves testing an application from start to finish, simulating a real user scenario, and testing the application as an integrated whole. Using the Cypress testing framework, we will go hands-on in the setup of the testing framework, and the process of integrating it into our workflows, before writing our first test together. Attendees will leave with a set of tests they can immediately put into practice, and a solid idea of how they can expand those tests to fit their unique needs. [Subtitle this video →](https://wordpress.tv/subtitle/?video=136010) [![Creative Commons License](https://i.creativecommons.org/l/by-sa/4.0/88x31.png)](https://creativecommons.org/licenses/by-sa/4.0/)[Creative Commons License](https://creativecommons.org/licenses/by-sa/4.0/), Introduction to Automated End-to-End Testing Using Cypress, WordPress.tv, 01k9r39n98hhx42nkhyke7f7vj.