How do I install the Docs Diff Review skill?

Run npx skillmds@latest add kenn-io/docs-diff-review in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Docs Diff Review safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Docs Diff Review?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Docs Diff Review free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Docs Diff Review?

kenn-io (@kenn-io) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Docs Diff Review by kenn-io — Agent Skill

Name: Docs Diff Review
Author: kenn-io

Docs Diff Review

Render kenn-forge documentation changes for human review as aligned before-and-after blocks. Use when docs are rewritten, screenshots or navigation change, or a reviewer asks to see what changed on the rendered pages rather than reading a source diff.

kenn-io ebfb7e1 5 files · 29.9 KB Updated Sep 17, 2026

File contents

Docs diff review

Build both versions of the docs, assemble the review bundle, inspect it, and open it for the user.

Trust boundary

Use this skill only for documentation the user authored or approved for local execution. The docs build runs code from the checkout before the viewer opens, so it trusts HTML from that checkout. Review untrusted branches as source, or build them in a disposable environment.

Keep checkouts and review bundles in private temporary directories. Bind preview servers to 127.0.0.1, and keep bundles local.

Build the two sites

Choose the comparison base. Use the merge base with origin/main unless the user names another ref.
Stop only preview servers created during the current task before running the canonical build. If another process owns port 4178, inspect it and ask before stopping it.
Run make docs-build in the working tree. This is the after site.
Export the base revision to a private temporary directory. Symlink the working tree's node_modules into it, then run make docs-build there. This is the before site. Keep application state inside the repository's isolated screenshot harness.

Both builds must pass before assembling the review. A source-only comparison is not a substitute because screenshots, Markdown extensions, navigation, and theme behavior affect what readers see.

Assemble and review

Create a fresh temporary output path, then run:

node skills/docs-diff-review/scripts/assemble-review.mjs \
  --before-site <base-checkout>/site \
  --after-site site \
  --output <temporary-root>/review \
  --base <comparison-ref>

The script copies both rendered sites and writes a manifest of changed user-facing pages. Its bundled viewer aligns headings, paragraphs, lists, tables, code, and screenshots. It hides unchanged blocks by default.

The aligned blocks use the review viewer's own styles. When a stylesheet, template, or navigation file changes, use Open before and Open final page to inspect the complete rendered pages as well.

Serve the review directory on a free loopback port with an explicit loopback binding, for example:

python3 -m http.server <port> --bind 127.0.0.1

Open the review URL and the final rendered site in the user's browser. Before calling it ready, inspect at least one changed page in a real browser and confirm that the page list, aligned rows, screenshots, and "Open final page" link work.

Leave the preview running while the user reviews it. Report the two local URLs, the comparison ref, and both build results.

---name: docs-diff-reviewdescription: Render kenn-forge documentation changes for human review as aligned before-and-after blocks. Use when docs are rewritten, screenshots or navigation change, or a reviewer asks to see what changed on the rendered pages rather than reading a source diff.---# Docs diff reviewBuild both versions of the docs, assemble the review bundle, inspect it, andopen it for the user.## Trust boundaryUse this skill only for documentation the user authored or approved for localexecution. The docs build runs code from the checkout before the viewer opens,so it trusts HTML from that checkout. Review untrusted branches as source, orbuild them in a disposable environment.Keep checkouts and review bundles in private temporary directories. Bindpreview servers to `127.0.0.1`, and keep bundles local.## Build the two sites1. Choose the comparison base. Use the merge base with `origin/main` unless the user names another ref.2. Stop only preview servers created during the current task before running the canonical build. If another process owns port 4178, inspect it and ask before stopping it.3. Run `make docs-build` in the working tree. This is the after site.4. Export the base revision to a private temporary directory. Symlink the working tree's `node_modules` into it, then run `make docs-build` there. This is the before site. Keep application state inside the repository's isolated screenshot harness.Both builds must pass before assembling the review. A source-only comparison isnot a substitute because screenshots, Markdown extensions, navigation, andtheme behavior affect what readers see.## Assemble and reviewCreate a fresh temporary output path, then run:```shnode skills/docs-diff-review/scripts/assemble-review.mjs \ --before-site <base-checkout>/site \ --after-site site \ --output <temporary-root>/review \ --base <comparison-ref>```The script copies both rendered sites and writes a manifest of changeduser-facing pages. Its bundled viewer aligns headings, paragraphs, lists,tables, code, and screenshots. It hides unchanged blocks by default.The aligned blocks use the review viewer's own styles. When a stylesheet,template, or navigation file changes, use **Open before** and **Open finalpage** to inspect the complete rendered pages as well.Serve the review directory on a free loopback port with an explicit loopbackbinding, for example:```shpython3 -m http.server <port> --bind 127.0.0.1```Open the review URL and the final rendered site in the user's browser. Beforecalling it ready, inspect at least one changed page in a real browser andconfirm that the page list, aligned rows, screenshots, and "Open final page"link work.Leave the preview running while the user reviews it. Report the two local URLs,the comparison ref, and both build results.

Frequently asked questions