Everything you need to work with OpenDoc UI day to day — loading, reading, running, generating, remembering and sharing.
The fastest route: open the live demo and drop any .json / .yaml / .yml OpenAPI file onto it. Parsing, normalization and rendering happen in your browser — the file is never uploaded, and the original document is never modified.
To run it yourself:
With no configuration at all, OpenDoc UI runs in local mode: open files straight from your device and get a persistent history of everything you opened. When the browser supports file handles, the refresh button can even re-read the file from disk.
When the build enables URL loading, paste any reachable specification URL. The browser fetches it directly; for restrictive networks, optional proxy agents (reference implementations in six frameworks) fetch on your behalf, with direct-fetch fallbacks and clear CORS guidance when something is unreachable. If a generator emits invalid flow-style oneOf/anyOf/allOf without sequence brackets, an experimental load-time YAML repair rewrites just enough text for the document to parse — originals on disk are never modified.
Deployments can ship a curated catalog through public/config.json or window.INITIAL_CONFIG. The hybrid option combines a configured catalog with local file opening — teams get the official specs and the freedom to inspect anything else.
Remote specifications are cached in IndexedDB. A fresh entry is trusted for five minutes; after that the app revalidates with If-None-Match and/or If-Modified-Since when the server supplied those headers. If revalidation fails, the stale copy can serve as an offline fallback — but stale data is never treated as fresh indefinitely.
The refresh button (circular arrows beside the spec selector) drops the cache and reloads: it clears every cached spec and re-fetches the current one. In local mode the same button re-reads the opened file from disk or re-parses the stored text. The icon spins while a refresh is in flight.
The sidebar groups endpoints by tag — nested groups via x-tagGroups, counts, protection and deprecation indicators — and respects sorting, route-display and natural name order. Each operation opens a documentation view that leaves nothing hidden: parameter tables with types, formats, style/explode serialization, patterns and examples; request bodies and responses through the shared SchemaViewer (Format media type, generated examples, named OpenAPI examples, body-level combinator rails); and a response matrix with a scroll-aware code navigator and deep links like #response-200.
Pattern constraints carry a built-in regex tester and a serializer playground that can hand values to the Runner. Recursive and mutually referencing schemas render cycle-safe, with recursive branches marked by a loop icon at their boundary. On phones, a pinned response pill follows what you are reading and opens a sheet to jump between codes.
OpenDoc UI behaves like an IDE. Endpoints, the overview, global search, the schema explorer, the about page and the assistant all open as tabs in the same bar. Single-click previews a tab, double-click (or middle-click in the sidebar) pins it permanently; drag to reorder, middle-click or use the context menu to close. A split view shows documentation and the Runner side by side, with a draggable divider whose width is remembered.
Switch any endpoint to the API Runner tab. Inputs are generated from the specification: path/query/header/cookie parameters (serialized with the declared style/explode), a live final URL, a recursive form editor for bodies (or raw JSON/YAML/XML with format-aware validation), and multipart file uploads. OAS 3.2 QUERY operations send a body where the browser allows it — GET and HEAD still warn if a body is present. Press Ctrl/⌘ + Enter to send; inspect status, headers, body and history below, cancel long requests (including binary streams), and keep per-endpoint inputs saved between sessions.
Requests use the browser's fetch API, so standard CORS rules apply. The Runner Compatibility report — one click from the overview — states per endpoint what the browser can and cannot do for the API, before you waste time guessing.
The Authorize dialog understands the security schemes your spec declares: bearer tokens, API keys (header/query/cookie), basic auth and OAuth flows — including a native /oauth/callback route for authorization-code flows. Credentials are stored locally per specification, injected into Runner requests automatically, and redacted from generated snippets and AI context.
Open the Schema Explorer from the sidebar, open a schema modal from any reference, or stay inside an endpoint — request bodies, responses and the modal share one SchemaViewer. Composed structures use body-level rails and field-level menus for nested oneOf (exclusive), anyOf (multi-select merge with All), allOf (focus with dimming) and not (inspection only). Generated examples follow the active branch across formats; named OpenAPI examples live on their own tab. Modern 3.1/3.2 keywords — const, prefixItems, unevaluatedProperties, if/then/else, type unions, bare $ref combinators — are handled explicitly. Multiple schemas can be open at once, and the set is encoded in the URL (?schemas=Pet,Order) so the exact view is shareable.
Open the Settings tab from the workspace (deep link #/<spec>/settings#<section>). Sections cover General, Appearance (theme gallery), Navigation, Code viewer and AI. Representation defaults choose whether documentation and schema modals remember example vs schema per schema or globally. Tables can become cards when a pane runs out of room; preferences prefer IndexedDB with a localStorage emergency fallback only.
Every endpoint offers fetch, axios and Angular snippets; every schema offers TypeScript models. Download the whole set as a zip. Secrets you entered for the Runner are replaced with placeholders before anything is rendered or exported.
Attach Markdown notes and todos to any endpoint in fourteen translucent, theme-safe tones. Deleting moves a note to the trash, never oblivion; if a spec changes and a note's endpoint disappears, orphaned-note detection flags it so nothing is silently lost. Export and import everything as JSON to move machines or make backups.
Ask questions about the open specification and get answers grounded in retrieved, redacted endpoint/schema context — with citations that open the source view. Configure a direct provider (OpenAI, Anthropic, Ollama, OpenRouter or any OpenAI-compatible endpoint) or point at a server-side gateway that keeps keys out of the browser. Swagger/REST skill packs sharpen its answers, conversations save per spec, and the assistant can pre-fill the Runner with a ready-to-send request.
Everything after the # is handled by the application and never reaches the server — so the same URL works on GitHub Pages, nginx, S3 or even file:// without rewrite rules, and refreshing or sharing a link always restores the exact view. The main shapes:
| Route | Meaning |
|---|---|
| #/ | Home (no specification) |
| #/parsable/<key> | Home of a configured or local specification |
| #/parsable/<key>/api/<endpointId> | A specific endpoint in a permanent tab |
| #/…/schema-explorer?schemas=Pet | Schema Explorer with schemas open |
| #/…/notes · #/…/compatibility | Local notes · Runner compatibility matrix |
| #/…/settings#appearance | Settings page (section deep links) |
| #/…/about · #/…/assistant | About page · AI assistant |
Query parameters inside the hash include ?tab=examine|doc and ?search=…; response deep links append #response-200 after the route.
All persistence goes through an IndexedDB-first storage layer that hydrates before the UI starts, validates every read, self-repairs corrupt entries, and falls back to localStorage only when IndexedDB is unavailable. Sidebar width, collapsed folders, split-view width, per-spec themes, open tabs, per-endpoint Runner inputs, response history, notes and AI conversations all persist — on your machine, in your browser, and nowhere else. Per-spec data is pruned automatically when a spec disappears from the configuration.
Choose from 17 hand-picked palettes in the Settings → Appearance gallery (the old theme-only modal is gone); light, dark and system modes apply on top. The choice is remembered per specification, so each API keeps its own look. Notes, method badges and code views stay legible in every combination.
The About page inside the app lists the full set, including every mouse interaction.