Webinar Recap: Cypress & Azure DevOps

February 12, 2024

By Jessamyn Sweet

Recently, we were joined by Ivan Xue, Staff Software Engineer in Test at Prospa and automation aficionado, to discuss how Prospa built seamless test automation with Cypress and Azure DevOps. In this article, we’ve summarized the key takeaways from the webinar. The full recording is available on YouTube.

Prospa’s tech stack

Prospa is a financial technology company building cash flow products and services for the small business economy in AU & NZ. Prospa’s back-end is written in .Net, so they use Microsoft Azure for their platform–as-a-service and Azure DevOps for deployment. A few years ago, the Prospa team migrated their application front-end from Angular to React, choosing Cypress as their automation tool. “With Cypress, you don’t need to worry about having different frameworks for UI and API testing,” says Ivan, reducing complexity in their tech stack. Prospa also started using Cypress Cloud, benefiting from robust analytics of failures in CI/CD and easy debugging workflows.

Basic framework setup

Cypress’s default folder structure and configuration files can be found in our docs. You can find examples of framework setups online. Ivan walked through Prospa’s framework setup, which accommodates different testing scenarios including smoke tests and daily pipeline runs to ensure thorough testing before deployment. This includes the usage of:

  • TypeScript enums for storing constant values like page titles or HTTP status codes, facilitating easy reference in tests without hardcoding values
  • Interfaces for API automation to store request or response data, aiding in verification and issue emulation
  • TypeScript services for wrapping Cypress functions for endpoint verification, enabling the verification of response bodies or codes after sending requests
  • PowerShell scripts are utilized to handle tasks such as uploading screenshots and managing configuration files
  • Environmental variables are stored in a JSON file for security, and a PowerShell script is used to download data from keyboards
  • JUnit reports are uploaded to Azure DevOps pipelines for analysis, providing developers with clear insights into test results.

Integrating Cypress Tests with Azure Pipelines

Ivan centralized the QA YAML templates to ensure consistency and ease of maintenance across projects. He detailed steps for downloading data from Azure keyboards, managing npm packages, and replacing skeleton data with actual data, and demonstrated the full pipeline setup with gates for deployment decisions based on test results. Check out Cypress’s example for Azure DevOps here.

Enhancing the automation ecosystem

Here are a few more of Ivan’s favorite Cypress features for smoothing out the testing workflow and saving his team time:

  • Integrating with Github and Slack to keep developers within their workflow
  • Cy.origin for testing sign in workflows
  • Test Replay for powerful time-travel debugging with full DOM access

See you at our next webinar!

This was the first of our Customer Spotlight webinar series, where we highlight developers and QA engineers leading the testing process at their companies. They are eager to share their insights and expertise with the broader Cypress community. Sign up for future webinars on our website, and view previous webinars and events on our YouTube channel

Need help? Join our Discord community of over 10,000 Cypress users to ask questions, get the latest product updates, and connect with testing experts.