The Never-Ending Quest for Reliable E2E Testing
As I sat in front of my computer, sipping my morning coffee and staring at the lines of code in front of me, I couldn't help but think about the importance of end-to-end (E2E) testing in our development workflow. It's a crucial step that ensures our application behaves as expected, from the user's perspective, and catches any bugs or issues that might have slipped through the cracks. But, as many of you know, setting up a robust E2E testing infrastructure can be a daunting task, especially when dealing with complex systems and multiple integrations. This is the story of how I tackled this challenge and implemented E2E testing for our PlayaMXCRM application against our Neon production environment.
The Problem We Were Facing
Our application, PlayaMXCRM, is a complex system that involves multiple APIs, databases, and third-party integrations. As we continued to add new features and functionality, our testing suite was becoming increasingly outdated and inefficient. We were relying heavily on manual testing, which was not only time-consuming but also prone to human error. We needed a more automated and reliable way to test our application, and that's where E2E testing came in. But, as I soon discovered, setting up E2E testing was not going to be a straightforward task. Our application was built using a microservices architecture, with multiple services communicating with each other through APIs. We were using Docker to containerize our services, and we had a complex network configuration that involved multiple environments and databases.
The Context of Our Project
Our project, PlayaMXCRM, is a customer relationship management (CRM) system designed for small to medium-sized businesses. It's built using a combination of Node.js, TypeScript, and React, with a PostgreSQL database and a Neon production environment. We were using GitHub Actions for our CI/CD pipeline, and we had a separate environment for testing and staging. Our goal was to set up E2E testing that would simulate real-user interactions with our application, covering scenarios such as user authentication, data creation, and API calls. We wanted to ensure that our application was working as expected, from the user's perspective, and that we were catching any bugs or issues that might have slipped through the cracks.
The Exploration and Initial Attempts
My first attempt at setting up E2E testing was to use a tool called Cypress. I had heard great things about it, and it seemed like a good fit for our project. I spent several hours setting up the initial configuration, writing tests, and debugging issues. However, as I delved deeper into the process, I realized that Cypress was not the best choice for our project. It was too heavy, and it required a lot of configuration and maintenance. I decided to explore other options, and that's when I stumbled upon Vitest. Vitest is a fast and lightweight testing framework that's designed for JavaScript and TypeScript projects. It's highly configurable, and it supports a wide range of features, including E2E testing. I was impressed by its simplicity and ease of use, and I decided to give it a try.
The Solution We Implemented
After deciding to use Vitest, I started by setting up the initial configuration. I created a new test file, e2e-broker-portal.test.ts, and I began writing tests for our broker portal feature. I used the supertest library to simulate HTTP requests and verify the responses. I also used the vitest API to write assertions and verify the behavior of our application. As I wrote more tests, I realized that I needed a way to configure and run our tests against our Neon production environment. That's when I decided to use GitHub Actions to automate our testing pipeline. I created a new workflow file, .github/workflows/e2e.yml, and I configured it to run our tests against our Neon production environment. I used the cron feature to schedule our tests to run daily, and I set up notifications to alert us in case of any failures.
Here's an example of one of our test files:
/**
* e2e-broker-portal.test.ts — Tests E2E portal broker contra Neon
*/
import { describe, it, expect, beforeAll, afterAll } from "vitest";
import request from "supertest";
describe("Broker Portal E2E Tests", () => {
beforeAll(async () => {
// Set up test data and configure the environment
});
it("should authenticate user", async () => {
const response = await request(app).post("/api/auth/login");
expect(response.status).toBe(200);
});
it("should create new data", async () => {
const response = await request(app).post("/api/data");
expect(response.status).toBe(201);
});
afterAll(async () => {
// Clean up test data and restore the environment
});
});
And here's an example of our GitHub Actions workflow file:
name: E2E Tests — Neon producción
on:
push:
branches: [main]
schedule:
- cron: '0 6 * * *'
jobs:
e2e-tests:
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v2
- name: Install dependencies
run: npm install
- name: Run E2E tests
run: npm run test:e2e
Lessons Learned and Takeaways
As I look back on this experience, I realize that setting up E2E testing was not a straightforward task. It required a lot of research, experimentation, and debugging. However, the end result was well worth the effort. We now have a robust E2E testing infrastructure that simulates real-user interactions with our application, covering scenarios such as user authentication, data creation, and API calls. We've caught several bugs and issues that might have slipped through the cracks, and we've improved the overall quality and reliability of our application. One of the most important lessons I learned was the importance of choosing the right tools and technologies for the job. Vitest and GitHub Actions were instrumental in helping us set up our E2E testing infrastructure, and I would highly recommend them to anyone looking to implement E2E testing in their own projects.
Next Steps and Future Plans
As we continue to evolve and improve our application, we'll be expanding our E2E testing infrastructure to cover more scenarios and features. We'll be exploring new tools and technologies, such as AI and machine learning, to help us improve the efficiency and effectiveness of our testing pipeline. We'll also be investing in automated testing and continuous integration, to ensure that our application is always up-to-date and reliable. Our goal is to create a world-class CRM system that's fast, secure, and reliable, and we're committed to using the latest technologies and best practices to achieve that goal. As I finish writing this article, I'm reminded of the importance of sharing knowledge and experiences with others. I hope that our story will inspire and motivate other developers to implement E2E testing in their own projects, and I look forward to hearing about their own experiences and lessons learned.
Part of my Build in Public series — sharing the real process of building Building PlayaMXCRM from Playa del Carmen, México.
Repo: zaerohell/VS · 2026-06-20
#playadev #buildinpublic
