DEV Community

Roberto Luna
Roberto Luna

Posted on

Implementing Reports PDF and Call Center Features with Enhanced Testing in PlayaMXCRM

Implementing Reports PDF and Call Center Features with Enhanced Testing in PlayaMXCRM

TL;DR: This article covers the technical implementation of the Reports PDF and Call Center features in PlayaMXCRM, along with significant enhancements to the testing suite, particularly focusing on achieving around 40% test coverage. The changes include updates to various files across the API and web applications, addition of new tests, and adjustments to CI/CD workflows.

The Problem

The primary challenge was to integrate the Reports PDF feature and enhance the Call Center module while significantly improving test coverage. The Reports PDF feature required generating PDF documents based on data from the application, which involved selecting the right libraries, setting up the PDF generation logic, and ensuring that the generated PDFs were correctly formatted and contained the necessary information. On the other hand, the Call Center module needed updates to support new functionalities, including stats, logs CRUD (Create, Read, Update, Delete), and filters by status and direction. Additionally, there was a requirement to enhance test coverage to ensure the reliability and stability of the application.

What I Tried First

Initially, I explored using pdfkit and jsPDF libraries for generating PDFs. However, after evaluating their documentation and community support, I decided to use pdf-lib due to its comprehensive feature set and ease of use. For the Call Center module, I started by reviewing existing code and identifying areas that needed updates to support the new requirements. I also began writing tests for the new features to ensure they were properly covered.

The Implementation

Updating Dependencies and Versioning

First, I updated the versioning across the project to reflect the new changes. This involved modifying the package.json files in both the API and web applications, as well as the main project package.json.

// apps/api/package.json
{
  "name": "@playamxcrm/api",
  "private": true,
  "version": "1.6.3",
  // ...
}

// apps/web/package.json
{
  "name": "@playamxcrm/web",
  "private": true,
  "version": "1.6.3",
  // ...
}

// package.json
{
  "name": "playamxcrm",
  "version": "1.6.3",
  // ...
}
Enter fullscreen mode Exit fullscreen mode

Adding Tests for Call Center and Reports

I added new test files for the Call Center and Reports features. For instance, call-center.test.ts was created to cover stats, logs CRUD, and filters by status and direction.

// apps/api/src/__tests__/call-center.test.ts
import { describe, it, expect, beforeAll, afterAll } from '@jest/globals';

describe('Call Center Module', () => {
  beforeAll(async () => {
    // Setup
  });

  afterAll(async () => {
    // Teardown
  });

  it('should fetch call center stats', async () => {
    const stats = await callCenterStats();
    expect(stats).toHaveProperty('totalCalls');
    expect(stats).toHaveProperty('successfulCalls');
  });

  // More tests...
});
Enter fullscreen mode Exit fullscreen mode

Similarly, I implemented tests for reports in reports.test.ts.

Implementing Reports PDF Feature

The Reports PDF feature was implemented in reports.controller.ts, where I used pdf-lib to generate PDFs.

// apps/api/src/reports/reports.controller.ts
import { PDFDocument } from 'pdf-lib';

export async function generateReportPdf(data) {
  const pdfDoc = await new PDFDocument().addPage();
  const text = `Report for ${data.date}`;
  pdfDoc.addText(text, 100, 100);
  // More PDF generation logic...
  return pdfDoc.save();
}
Enter fullscreen mode Exit fullscreen mode

Adjusting CI/CD Workflows

To incorporate the new tests and ensure that the application builds and tests pass, I updated the .github/workflows/e2e.yml file.

# .github/workflows/e2e.yml
jobs:
  build-and-test:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v2

      - name: Install dependencies
        run: npm install

      - name: Run tests
        run: npm test

      - name: Build and deploy
        run: npm run build && npm run deploy
Enter fullscreen mode Exit fullscreen mode

Key Takeaway

A crucial technical lesson from this implementation was the importance of selecting the right tools and libraries for specific tasks. Choosing pdf-lib for PDF generation significantly simplified the implementation process. Additionally, writing comprehensive tests from the outset ensured that the new features were robust and helped catch issues early in the development process.

What's Next

The next steps include further enhancing test coverage to ensure that the application is thoroughly tested. I plan to focus on integrating more advanced testing mechanisms, such as end-to-end tests using Playwright, and exploring additional features for the Call Center module. Moreover, optimizing the PDF generation process for better performance and supporting more complex report structures are on the agenda.

vibecoding #buildinpublic #typescript #pdfgeneration #testing #devto


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-07-07

#playadev #buildinpublic

Top comments (0)