I built a tool that generates TypeScript fixtures from interfaces and Zod schemas

Published: (June 4, 2026 at 04:15 PM EDT)
2 min read
Source: Dev.to

Source: Dev.to

Every TypeScript project reaches the same point: you’ve defined your types, now you need mock data for tests, Storybook stories, or local development. You end up hand‑writing the same boilerplate mockUser, mockProduct, mockOrder objects over and over.

FixtureKit generates TypeScript fixtures from interfaces, types, or Zod schemas directly in the browser.

Try it

https://fixture-kit.vercel.app

Input

interface Product {
  id: string;
  name: string;
  price: number;
  inStock: boolean;
  tags: string[];
}

Output

export const mockProduct: Product = {
  id: "f47ac10b-58cc-4372-a567-0e02b2c3d479",
  name: "Wireless Keyboard",
  price: 49.99,
  inStock: true,
  tags: ["electronics", "accessories"],
};

Features

  • Deterministic output – uses a hash of the field name + fixture index; no Math.random(). The same schema always yields the same fixture, safe to commit.
  • No eval, no backend – Zod schemas are parsed with a custom recursive‑descent parser; TypeScript schemas use the TypeScript compiler API. Everything runs client‑side.
  • Multiple fixtures – generate up to 5 fixtures at once, handy for seeding UI components or table/list test cases.

Supported input

  • Zod: z.object, z.string, z.number, z.boolean, z.array, z.enum, z.union, z.literal, .optional(), .nullable(), nested z.object
  • TypeScript: interfaces and type aliases (parsed via the TypeScript compiler API)

Advanced features such as generics, utility types, .refine, or .transform are out of scope and will return a clear error.

Tech

  • Source:
  • Feedback welcome, especially on schema shapes that aren’t yet handled.
0 views
Back to Blog

Related posts

Read more »