npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

@swedevtools/livedoc-vitest

v0.3.0

Published

BDD extensions for Vitest that support LiveDoc reporting with Gherkin syntax and MSpec-style specifications.

Readme

@swedevtools/livedoc-vitest

Turn your tests into living documentation

npm version License: MIT

Write tests in Gherkin. Get documentation that never goes stale.

📖 Full Documentation →


What is LiveDoc?

LiveDoc brings Behavior-Driven Development to Vitest with full Gherkin syntax — Feature / Scenario / Given / When / Then, Specification / Rule, Scenario Outlines, Tags & Filtering, and beautiful reports.

Quick Start

Install

npm install --save-dev vitest@^4.0.16 @swedevtools/livedoc-vitest

Fastest Setup: Point Your AI at the Bootstrap URL

Tell your assistant:

Read https://livedoc.swedevtools.com/ai/setup.md and configure this Vitest project for LiveDoc. Inspect it first, ask me one configuration question at a time, and wait for approval before making changes.

No LiveDoc package or skill needs to be installed first. AI project setup →

AI setup installs version-matched skills inside the repository for every selected tool. Run npx livedoc-vitest-setup --tool copilot,codex,claude later to refresh them or add another tool. It also adds test:livedoc and, when coverage is enabled, test:livedoc:coverage package scripts.

Create a spec

// tests/Calculator.Spec.ts
import { feature, scenario, given, when, Then as then, and } from '@swedevtools/livedoc-vitest';

feature("Calculator", () => {
  scenario("Adding two numbers", () => {
    let result = 0;

    given("I have entered '50' into the calculator", (ctx) => {
      result = ctx.step.values[0];
    });

    and("I have entered '70' into the calculator", (ctx) => {
      result += ctx.step.values[0];
    });

    when("I press add", () => {
      // Addition already happened above
    });

    then("the result should be '120'", (ctx) => {
      expect(result).toBe(ctx.step.values[0]);
    });
  });
});

Why Then as then? ES modules treat then as a thenable indicator. We export Then (uppercase) and you alias it.

Configure Vitest

// vitest.config.ts
import { defineConfig } from 'vitest/config';
import { LiveDocSpecReporter } from '@swedevtools/livedoc-vitest/reporter';

export default defineConfig({
  test: {
    globals: true,
    include: ['**/*.Spec.ts'],
    reporters: [new LiveDocSpecReporter()],
  },
});

Run

npx vitest run

Publish a focused partial run

After publishing one full baseline, mark an isolated development run as partial so the Viewer keeps the complete latest-known picture:

LIVEDOC_RUN_TYPE=partial npx vitest run features/Login.Spec.ts

You can also set publish.runType or LiveDocViewerReporter({ runType: 'partial' }) in configuration. Partial runs require a running LiveDoc server and a completed full baseline for the same project and environment. Direct JSON/static partial export is not supported; release and production exports should use a full run.

Add coverage evidence

LiveDoc can attach Vitest coverage as optional run evidence. It does not change the test run status; threshold misses appear as warnings in the viewer.

Install the V8 provider on the same version as Vitest:

npm install --save-dev @vitest/coverage-v8
// vitest.config.ts
import { defineConfig } from 'vitest/config';
import { LiveDocSpecReporter } from '@swedevtools/livedoc-vitest/reporter';

export default defineConfig({
  test: {
    reporters: [
      new LiveDocSpecReporter({
        coverage: { enabled: true, thresholds: { lines: 80 } },
      }),
    ],
    coverage: {
      enabled: true,
      provider: 'v8',
      reporter: ['text', 'html', 'json-summary'],
    },
  },
});
npx vitest run --coverage

LiveDoc consumes Vitest's in-memory coverage map before the run is published. It also auto-detects coverage/coverage-summary.json and coverage/lcov.info as fallbacks. For custom artifact paths, set coverage.artifactPath in the reporter or use LIVEDOC_COVERAGE_PATH.

See the Code Coverage guide for provider choices, thresholds, troubleshooting, and the Viewer module hierarchy.


Documentation

📖 Full documentation at livedoc.swedevtools.com →

Covers getting started, BDD & Specification patterns, data extraction, scenario outlines, tags & filtering, reporters, viewer integration, CI/CD, troubleshooting, and more.


License

MIT