Skip to content

Feature/10 render mermaid diagrams drop vscode web - #334

Closed
maurice30120 wants to merge 48 commits into
microsoft:mainfrom
maurice30120:feature/10-render-mermaid-diagrams-drop-vscode-web
Closed

Feature/10 render mermaid diagrams drop vscode web#334
maurice30120 wants to merge 48 commits into
microsoft:mainfrom
maurice30120:feature/10-render-mermaid-diagrams-drop-vscode-web

Conversation

@maurice30120

Copy link
Copy Markdown

No description provided.

dhuyet added 30 commits August 31, 2026 13:29
Adds a standalone Node.js/TypeScript package at packages/mcp-server/
exposing a workspace-confined stdio MCP server with two tools:
create_project_tour (.tours/project.tour) and create_changes_tour
(.tours/changes.tour).

The server validates proposals deterministically (aggregated errors,
Tour Anchor rules, V1 security boundary: no commands/when/uri, no
active Markdown schemes, symlink confinement), applies the Git rules
(merge-base, full-head-SHA check, STALE_HEAD, NO_CHANGES, uncommitted
change handling) and atomically replaces the reserved tour file, then
validates its output against the general CodeTour schema.

Closes #1
…includeUncommittedChanges

- Updated README.md to reflect changes in parameter names for the Changes Tour.
- Modified package.json to include additional files in the distribution.
- Enhanced cli.ts to enforce single --workspace-root argument.
- Updated server.ts to use new parameter names and improve error handling.
- Refactored types.ts to rename parameters in ChangesParams interface.
- Adjusted validation.ts to validate new parameter names in Changes Tour.
- Updated test-utils.ts to support environment variable overrides in server tests.
- Refactored changes-tour.test.ts to use new parameter names and improve test coverage.
- Added cli.test.ts to ensure correct handling of command-line arguments.
- Created packaged-binary.test.ts to test the installed binary functionality.
- Updated validation.test.ts to validate new parameter names and ensure correct behavior.
…validation

chore: Update GitHub Actions workflows to use Node.js 20 and improve testing

feat: Add test workflow for multi-platform CI

feat: Introduce MCP server tour for understanding the CodeTour MCP server

fix: Update .vscodeignore to exclude mcp-server package

docs: Expand glossary in CONTEXT.md with new terms related to tours and diagrams

docs: Update README.md to include AI-generated tours and MCP server usage

refactor: Modify ADRs for MCP server to reflect new configuration and discovery methods

chore: Update package-lock.json and package.json for dependency versions

feat: Implement Codex integration for MCP server configuration

feat: Add desktop integration for MCP server in VS Code

fix: Adjust player and recorder logic to handle source ranges correctly

chore: Update TypeScript target to ES2019 for better compatibility

build: Configure Webpack for MCP server CLI and adjust output settings
Drop the browser entry point from the extension manifest and delete the
Web Worker webpack configuration, so the build only emits the Node
extension and the bundled MCP server. The os/path browser polyfill
fallback existed only for the web target and goes with it.

Implements #11
The shim existed only as the webworker build's alias target for
./desktopIntegration and is unreferenced now that no web bundle is
built. The Node implementation in src/desktopIntegration.ts is
unchanged.

Implements #11
os-browserify and path-browserify were only referenced by the deleted
web build's resolve.fallback and have no other usage in the repo.

Implements #11
Exclude any stale dist/extension-web.js* from packaging and have CI
verify the produced VSIX ships no web extension artifact.

Implements #11
The codetour-description-renderer package owns the description-to-comment-content
seam: it takes a complete Markdown description plus the effective theme and
returns the final Markdown, replacing each captioned mermaid fence with an
in-memory PNG data URI. Mermaid runs strict and offline inside a JSDOM
environment with bounded text-measurement heuristics; the intermediate SVG is
sanitized, normalized and rasterized with @resvg/resvg-js without writing any
generated asset. Dependencies are exact-pinned (mermaid 11.12.2, jsdom 26.1.0,
@resvg/resvg-js 2.6.2) so the MCP validation side can reuse the same locked
Mermaid version and diagram rules.

Implements #12
Playback now renders the step description through the description renderer
before building the comment: captioned mermaid fences become PNG data URI
images in the native Tour comment, while the editing mode keeps the raw
source so saving a step cannot persist a rendered image. The extension reads
the effective color theme and passes it through the seam so diagrams adapt to
light and dark themes. The webpack build resolves the renderer package from
its own node_modules, externalizes @resvg/resvg-js (native binaries), and
keeps the bundled dynamic Mermaid import in a single chunk; the root carries
the exact-pinned rasterizer so the development extension host can require it.
CI installs and tests the new package alongside the MCP server.

Implements #12
Introduce the single source of truth for the first-version diagram rules:
the five-kind allowlist (flowchart, sequenceDiagram, stateDiagram-v2,
classDiagram, erDiagram), the Diagram caption grammar, the three-diagrams-
per-description and 20 KB-per-source limits, and the per-fence evaluation
order (caption, then size, then kind). The module is pure and
dependency-free so playback and the upcoming MCP validation evaluate the
same rules identically. The package now exports the rule surface alongside
findDiagramFences.

Implements #13
Harden the defense-in-depth sanitizer: image/img elements (which a
rasterizer could resolve as remote resources) are now removed outright,
and href/xlink:href attributes survive only when they reference an
internal fragment. Anchors, scripts, event handlers and foreign content
were already removed; ordinary diagram markup and internal references
are preserved.

Implements #13
Every mermaid fence in a description is now processed: the five allowed
kinds render as PNG images, while unsupported kinds, missing or malformed
captions, sources over 20 KB and fences beyond the third per description
fail locally with a compact warning that never exposes the Mermaid
source. Fences render independently, so a rejected diagram never hides
its valid siblings, and renderMermaidDiagram refuses unsupported kinds on
its own so the low-level API stays safe. The suite now covers all five
kinds through the seam (including sequence message arrows and class
members, the rasterizer-panic risk areas), the caption grammar, both
limits at their exact boundaries, every failure mode's independence,
hostile constructs per kind, and offline rendering of all five kinds with
the network blocked.

Implements #13
Extract the Insert Code step of generatePreviewContent into a pure
appendInsertCodeLinks module that never offers a mermaid fence as
insertable code and never swallows one into another fence's payload,
while descriptions without mermaid fences keep byte-identical Insert
Code behavior. The tree tooltip, which runs the transformation on raw
descriptions, is covered by the bypass until the rendering seam reaches
it. The transformation is unit-tested through a new root test step that
compiles src/player/insertCode with tsconfig.test.json and runs it with
node --test; the test build lands in dist/test and stays out of the
packaged VSIX.

Implements #13
…/10 (stack test)

# Conflicts:
#	package.json
#	packages/mcp-server/package-lock.json
#	packages/mcp-server/package.json
#	packages/mcp-server/src/mermaid-validation.ts
#	packages/mcp-server/src/server.ts
#	webpack.config.js
@maurice30120
maurice30120 marked this pull request as draft September 3, 2026 09:39
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants