terminal-screenshot

Render terminal ANSI output into images!

Under the hood, it uses XTerm.js to render the terminal output to html, and Puppeteer to capture a screenshot of the page.

Usage (API)

import {renderScreenshot} from "terminal-screenshot";

const image = await renderScreenshot({
  data: "[[DATA]]", // Data to be render to the terminal.
  margin: 0, // Margin to leave around the terminal area in pixels. (default: 0)
  fontFamily: "Monaco", // Font family to use in terminal output. (default: Monaco)
  backgroundColor: "black", // Background color of the terminal. (default: black)
  type: "png", // Type of the screenshot to be generated. (default: png)
});

await fs.writeFile(destination, image);

Usage (CLI)

# Render command output
$(command) | terminal-screenshot --output screenshot.png

# Render ANSI string
terminal-screenshot --output screenshot.png --data "[[DATA]]"

# Print help options
terminal-screenshot --help

CLI Options

  -d, --data [string]                Data to be render to the terminal.
  -m --margin [number]               Margin to leave around the terminal area in pixels. (default: 0)
  -f --font-family [string]          Font family to use in terminal output. (default: Monaco)
  -b --background-color [css-color]  Background color of the terminal. (default: black)
  -t --type [png|jpeg]               Type of the screenshot to be generated. (default: png)
  -o --output [path]                 Output path to save the screenshot to.
  -h, --help                         display usage help.

Examples

npx cfonts $'   terminal\nscreenshot' -g red,blue | terminal-screenshot --output foo.png

node ./plot-graph.js | terminal-screenshot --output foo.png

Testing

You can also combine this library with the jest-image-snapshot library to assert screenshots as snapshots in your Jest tests:

it("can render screenshots", async () => {
  const image = await renderScreenshot({data});
  expect(image).toMatchImageSnapshot();
});

Support

Please use GitHub Issues to report any issues, or ask questions.