screenshot_git_diff

Capture visual representations of Git diff output to document code changes. Generate screenshots showing differences in working directory or staged files with syntax highlighting.

Instructions

Generate a screenshot of git diff output. Shows changes in your working directory or staged changes.

Input Schema

TableJSON Schema

Name	Required	Description
`filePath`	No	Optional: Specific file to diff. If not provided, shows diff for all changes.
`staged`	No	Show staged changes (git diff --staged) instead of unstaged changes
`theme`	No	Color theme (dracula, nord, monokai, github-light, github-dark)

Implementation Reference

src/generator.ts:155-193 (handler)

The core handler function that executes the `git diff` command (optionally --staged and for specific file), captures stdout as diff code, and generates a syntax-highlighted screenshot using `generateScreenshot` with language 'diff'.

export async function screenshotGitDiff(
  options: ScreenshotGitDiffOptions
): Promise<GenerateScreenshotResult> {
  try {
    // Build git diff command
    let command = "git diff";

    if (options.staged) {
      command += " --staged";
    }

    if (options.filePath) {
      command += ` -- "${options.filePath}"`;
    }

    // Execute git diff
    const { stdout, stderr } = await execAsync(command);

    if (stderr && !stdout) {
      throw new Error(`Git diff error: ${stderr}`);
    }

    if (!stdout || stdout.trim().length === 0) {
      throw new Error("No changes to display");
    }

    // Generate screenshot with diff language
    return generateScreenshot({
      code: stdout,
      language: "diff",
      theme: options.theme,
    });
  } catch (error) {
    if (error instanceof Error) {
      throw new Error(`Failed to generate git diff screenshot: ${error.message}`);
    }
    throw error;
  }
}

src/index.ts:85-106 (schema)

MCP tool registration schema defining the 'screenshot_git_diff' tool, its description, and input schema (filePath optional, staged boolean, theme enum).

  name: "screenshot_git_diff",
  description: "Generate a screenshot of git diff output. Shows changes in your working directory or staged changes.",
  inputSchema: {
    type: "object",
    properties: {
      filePath: {
        type: "string",
        description: "Optional: Specific file to diff. If not provided, shows diff for all changes.",
      },
      staged: {
        type: "boolean",
        description: "Show staged changes (git diff --staged) instead of unstaged changes",
      },
      theme: {
        type: "string",
        description: "Color theme (dracula, nord, monokai, github-light, github-dark)",
        enum: ["dracula", "nord", "monokai", "github-light", "github-dark"],
      },
    },
    required: [],
  },
},

src/index.ts:241-282 (registration)

MCP CallToolRequest handler dispatch for 'screenshot_git_diff' that parses arguments, calls the screenshotGitDiff function, and returns image content or error.

if (name === "screenshot_git_diff") {
  try {
    const { filePath, staged, theme = "dracula" } = (args || {}) as {
      filePath?: string;
      staged?: boolean;
      theme?: string;
    };

    // Generate the screenshot from git diff
    const result = await screenshotGitDiff({
      filePath,
      staged,
      theme,
    });

    const diffType = staged ? "Staged changes" : "Unstaged changes";
    const fileInfo = filePath ? `\nFile: ${filePath}` : "\nAll files";

    return {
      content: [
        {
          type: "text",
          text: `✅ Git diff screenshot generated successfully!\n\n${diffType}${fileInfo}\nSaved to: ${result.path}\n\nTheme: ${theme}\n\nYou can view the image in your file browser.`,
        },
        {
          type: "image",
          data: result.base64,
          mimeType: "image/png",
        },
      ],
    };
  } catch (error) {
    return {
      content: [
        {
          type: "text",
          text: `❌ Error generating git diff screenshot: ${error instanceof Error ? error.message : String(error)}`,
        },
      ],
      isError: true,
    };
  }

src/generator.ts:149-153 (schema)
TypeScript interface defining the input options for the screenshotGitDiff handler.
```
export interface ScreenshotGitDiffOptions {
  filePath?: string;
  staged?: boolean;
  theme?: string;
}
```

Code Screenshot Generator