walk-that-type
walk-that-type copied to clipboard
A tool for evaluating TypeScript types step by step.
Walk That Type

Debugging complex TypeScript types is painful, because you can't simply put log statements in them and the obscure syntax doesn't help. Introducing Walk That Type: a tool that lets you paste or write any type, then step through it while explaining what happens at each step!
🚧 Warning: this project is still in early development stage. It might include bugs and missing features (see ROADMAP to see what's still coming).
Contributing
- Fork this repo
- Create a new branch, push your changes, and open a PR.
Feel free to report any issues or feature requests using Github issues.
Development setup
- Install pnpm
- Run
pnpm install - Run
pnpm devto start the dev server - Run
pnpm testto run tests (in watch mode)
Implementing new features:
- Make sure
mapASTToTypeNodeshandles parsing syntax for this feature, if not, add it. This requires adding a newTypeNodevariant. Fill missing cases in functions that useTypeNode(usepnpm check:typesto find all these places). - Add tests and implement
evalTfor this feature. - Add tests and implement
extendsTfor this feature (if needed). - Add traverse logic in
traversefunction. - In
eval-tree.tsadd new cases incalculateNextStepandchooseNodeToEval. - Finally, update
EvalDescriptioncomponent.
Implementing built-in types
To add a missing built-in type (e.g. Pick) you just need to implement it in the global-types.ts files according to GlobalTypeFn type.