See the run before the run.
- Year
- 2026
- Role
- Author
- Stack
- TypeScript, Vite, YAML, SVG
Overview
Paste a GitHub Actions workflow and explore it as a job graph – which jobs a push would start, what a matrix expands to, and how a change reshapes the pipeline.
Workflows are graphs written as YAML. gha-preview parses them in the browser and draws the graph: jobs, `needs`, matrix expansion, conditions that decide whether a job runs for a given event.
It is honest about what it can't know – runtime conditions are shown as conditional instead of guessed – and every job links back to its line in the YAML. No account, nothing uploaded.
Implementation
01
Everything in the browser
Parsing, evaluation of `if:` expressions against a chosen event and the graph layout all run client-side – the workflow never leaves the page.
02
From graph to source
Nodes keep their YAML source ranges, so clicking a job highlights exactly the lines that define it.
Technical challenges
Unknown is a valid answer
Expressions that depend on runtime values are marked conditional rather than evaluated with made-up inputs.