DEV Community

Wasef Hussain
Wasef Hussain

Posted on • Edited on

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

#javascript #typescript #testing #webdev

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

I built FixtureKit to fix that — a free developer tool, not a
product pitch.

What it does

Paste a TypeScript interface, type, or a Zod z.object(...) schema
→ get a copy-ready export const mock… fixture.

Try it: https://fixture-kit.vercel.app

Input:

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

Output:

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

What makes it useful

Semantic field inference — field names like email, name, url,
price, createdAt map to realistic value pools. Not just "string"
everywhere.

Deterministic output — hash-based, no Math.random(). Same schema
always gives the same output. Safe to commit.

No eval, no backend — everything runs in the browser. Nothing
leaves your machine.

4 output formats — TypeScript, JSON, MSW handler, Playwright route
interception.

Adversarial mode — injects XSS payloads, SQLi strings, and boundary
values to stress-test your validation logic.

Supports Partial, Pick, Omit — common utility types work
out of the box.

Supported input

TypeScript: interface, type, arrays, nested objects, optional
fields, unions, literal types, Partial<T>, Pick<T>, Omit<T>

Zod: z.object, z.string, z.number, z.boolean, z.array,
z.enum, z.union, z.literal, .optional(), .nullable(),
nested z.object

Generics, mapped types, .refine, .transform → clear error, not
broken output.

Tech

React 18 · TypeScript 5 · Vite · TypeScript compiler API (in-browser)
· No backend

Source

https://github.com/Wasef-Hussain/FixtureKit

Feedback welcome — especially schema patterns I haven't handled yet.

Update: Schemas are now shareable as links — click "Copy link"
in the output toolbar and anyone who opens the URL gets your schema
pre-loaded instantly. No backend, encoded in the URL hash.

Launched on Product Hunt today 🙏
FixtureKit on Product Hunt

Top comments (0)