Testing Blocks

What problem does it solve?

Ensuring code quality and preventing regressions in AEM Edge Delivery projects can be complex and time-consuming. This skill provides a comprehensive, pragmatic testing framework, guiding developers through unit, browser, and performance testing to deliver high-quality code efficiently.

Core Features & Use Cases

• Pragmatic Testing Workflow: Guides through a "value vs. cost" testing philosophy, distinguishing between "keeper" unit tests for critical logic and "throwaway" browser tests for UI validation.
• Automated Quality Checks: Integrates linting, unit testing (Vitest), and automated performance validation (via GitHub checks) into the development lifecycle.
• Browser Testing Guidance: Provides detailed instructions for using Playwright/Puppeteer for visual and functional UI validation, including screenshot capture.
• Use Case: After implementing a new AEM block, this skill ensures you've covered all bases: unit tests for helper functions, browser tests for visual and interactive behavior, linting for code style, and performance checks for site speed, all before submitting a pull request.

Quick Start

Example: Run all unit tests

npm test

Example: Run linting and auto-fix issues

npm run lint:fix

Example: Run a throwaway browser test (requires Playwright setup)

First, ensure dev server is running: aem up --html-folder drafts

Then, execute your temporary Playwright script:

node test/tmp/test-my-block.js