AEM Verification & QA
Component snapshots, dialog verification, automated QA with browser automation, and demo capture.
Core AEM Skills
From pre-development baseline to post-deployment QA, visual verification, and documentation.
/aem-snapshot
Before development — capture a baseline of dialog fields, JCR properties, and find pages using the component.
/aem-verify
After deployment — walk the dialog, compare fields with the baseline snapshot, create a test page on AEM with the component configured and demo data populated.
/aem-editorial-guide
Screenshot the component dialog, capture rendered output, and write an authoring guide for content authors.
/aem-qa
Full QA — verify dialog fields (BE via AEM MCP) and page rendering (FE via Chrome DevTools). Creates bug tickets (ADO or Jira) if issues are found.
/aem-fe-verify
Visual verification of frontend rendering on local AEM — screenshots the component, compares against Figma reference or requirements, and auto-fixes gaps in a loop (up to 3 iterations).
Verification Flow
The complete lifecycle from baseline to QA.
/aem-snapshot /aem-verify /aem-fe-verify /aem-editorial-guide /aem-qa AEM Project Knowledge
All AEM skills depend on a pre-built index of components, content paths, and architecture.
/aem-init
Run once per repo. Builds .ai/project/ with component-index, file-patterns,
content-paths, and architecture docs.
/aem-refresh
Syncs seed data when project structure changes. Updates component index and file patterns.
/aem-component
Finds all source files for a named component: JS, SCSS, HTL, dialog XML, Sling Model, content paths.
/aem-page-search
Find all AEM pages that use a specific component. Returns page paths with clickable author URLs grouped by site and language.
/aem-doctor
Health check for AEM infrastructure — verifies component definitions, OSGi configs, dispatcher rules, content structure, and AEM instance connectivity.
Seed Data Files
All stored in .ai/project/: project.yaml, file-patterns.yaml,
content-paths.yaml, component-index-project.md, architecture.md,
features.md.
QA Agent Detail
Two verification tracks run in parallel: backend and frontend.
Backend Track
Dialog fields and JCR properties verified via AEM MCP.
- Read dialog field definitions
- Check JCR property values
- Verify Sling Model mappings
- Validate exporter output
Frontend Track
Page rendering, layout, and interactions verified via Chrome DevTools MCP.
- Navigate to component page
- Check rendered output
- Test interactive behaviors
- Screenshot for evidence
Automatic Bug Filing
When the QA agent finds discrepancies between expected and actual behavior, it creates bug tickets directly in ADO or Jira with repro steps and screenshots attached.
AEM MCP Tools
Direct interaction with AEM via the Model Context Protocol.
| Tool | Purpose |
|---|---|
getNodeContent | Read JCR node properties and child nodes |
scanPageComponents | List all components on a page with their resource types |
getPageContent | Get full page content tree |
createPage | Create new pages for demo or testing |
updateComponent | Modify component properties on a page |
getTemplateStructure | Inspect template policies and allowed components |
searchContent | JCR query to find content across the repository |
getPageImages | List all image references on a page |
AEM Documentation Generation
/aem-doc-gen creates comprehensive component documentation.
Full Documentation Output
Generates complete documentation with dialog screenshots (each panel captured individually), website screenshots (rendered component on a live page), field descriptions, authoring instructions, and technical notes. Published to ADO Wiki, Confluence, or saved locally as Markdown.