testing-blocks

Run npm run lint first, then validate the block in a real browser across mobile, tablet, and desktop viewports while checking for console errors. Capture screenshots as proof, then run npm test to confirm existing tests pass.

Write a temporary Playwright script that launches Chromium, navigates to your local test URL, waits for the block selector, and captures screenshots at 375px, 768px, and 1200px viewports. Delete the script after analyzing the artifacts.

Write unit tests for logic-heavy utility functions, data processing, API integrations, and complex business logic using Vitest. Skip unit tests for simple DOM manipulation, CSS-only changes, and straightforward decoration logic, which browser testing covers.

Common causes include the dev server not running, missing test content, or timing issues. Verify the server with aem up, confirm the test URL loads manually, and add waitForSelector calls for the block element.

Yes, install vitest, jsdom, and optionally @vitest/coverage-v8, then create a vitest.config.js with the jsdom environment. Add test scripts to package.json and exclude test files from production via .hlxignore.