About extract-annotation-source
A skill for reading Axhub prototype context from a runtime snapshot through page JavaScript. It is intended for inspecting annotations and directory data without modifying the page.
Key features
- 01Read the annotation runtime snapshot
- 02Extract directory and PRD entries
- 03Summarize annotation fields and image status
- 04Locate an optional source manifest
Use cases
- 01Inspect prototype page annotations
- 02Collect PRD content from the directory
- 03Report annotations and source handoff details
Install
Copy the command and run it in a terminal.
$
npx skills add https:/ / github.com/ lintendo/ axhub-skills --skill extract-annotation-sourceAfter installing, type/extract-annotation-sourcein Claude Code to confirm it loaded.
Bundled filesreferences/review-report-submission.md
Details
From the project READMEExtract Annotation Source
Read Axhub prototype context from the runtime snapshot. Treat the page as read-only.
Workflow
- Open the requested prototype URL with Playwright, Browser, Chrome, or an equivalent tool that can evaluate page JavaScript.
- Wait until the app renders, then poll briefly for
window.__AXHUB_ANNOTATION_SOURCE__. - Evaluate and return that value. Do not modify the object or write anything back to
window. - If the value is missing, report the URL, page title, relevant console errors, and that the annotation runtime snapshot was not published.
- If the user asks to submit a review report back to Axhub Make, read
references/review-report-submission.md.
Minimal page evaluation:
await page.waitForFunction(() => window.__AXHUB_ANNOTATION_SOURCE__, { timeout: 10000 });
const source = await page.evaluate(() => window.__AXHUB_ANNOTATION_SOURCE__);
What To Report
- Directory / PRD outline from
source.directory. - Markdown or PRD entries from directory nodes with
type: "markdown". - Annotation count and the important node fields:
id,title,pageId,locator,annotationText,aiPrompt,color, andcontrols. - Source handoff from
source.sourcewhen present. Reportrootandmanifest; when source is needed, read the manifest and relevant files viaroot. - Mention whether images are attached by checking
images.length; do not download images unless the user asks.
Data Shape
type AnnotationSourceRuntimeSnapshot = {
directory: AnnotationDirectory | null;
nodes: AnnotationNode[];
source?: {
root?: string;
manifest?: string;
};
};
directory.nodesis the prototype tree. Node types arefolder,route,link, andmarkdown.nodesis the full annotation list, independent of current page, selected state, and color filter.- Each annotation node includes
id,index, optionaltitle, optionalpageId,locator,aiPrompt,annotationText,hasMarkdown,color,images, optionalcontrols,createdAt, andupdatedAt. sourceis only a source-code discovery reference. In HTML published with source included,manifestpoints tosource/manifest.json; resolve its paths relative tosource.root.
Comments
Markdown supported