Redocly / Redocly/redoc

Passing JSON object to spec results in error

Open
#1,460 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
25.9k
Forks
2.4k
Avg merge
13h 10m
Merged PRs (30d)
4

Description

Hi

When looking to use RedocStandalone, passing a json object to spec results in incorrect behaviour.

I am using a spec from:
https://raw.githubusercontent.com/OAI/OpenAPI-Specification/master/examples/v3.0/api-with-examples.json

ReDoc Version: 2.0.0-rc.45
npm --version: 6.14.8

Expected Output

Provide either:

  • json object to spec
  • or path/ url to specUrl

Should result in the docs being displayed.

Current Output

I get the following error:

Document must be valid OpenAPI 3.0.0 definition
Stack trace
Error: Document must be valid OpenAPI 3.0.0 definition
    at OpenAPIParser.validate (http://localhost:3000/static/js/0.chunk.js:101908:19)
    at new OpenAPIParser (http://localhost:3000/static/js/0.chunk.js:101895:16)
    at new SpecStore (http://localhost:3000/static/js/0.chunk.js:102219:25)
    at new AppStore (http://localhost:3000/static/js/0.chunk.js:105287:23)
    at StoreBuilder.makeStore (http://localhost:3000/static/js/0.chunk.js:103097:20)
    at StoreBuilder.render (http://localhost:3000/static/js/0.chunk.js:103183:25)
    at finishClassComponent (http://localhost:3000/static/js/0.chunk.js:71760:35)
    at updateClassComponent (http://localhost:3000/static/js/0.chunk.js:71713:28)
    at beginWork (http://localhost:3000/static/js/0.chunk.js:73298:20)
    at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/0.chunk.js:58263:18)
    at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/0.chunk.js:58312:20)
    at invokeGuardedCallback (http://localhost:3000/static/js/0.chunk.js:58372:35)
    at beginWork$1 (http://localhost:3000/static/js/0.chunk.js:78114:11)
    at performUnitOfWork (http://localhost:3000/static/js/0.chunk.js:76950:16)
    at workLoopSync (http://localhost:3000/static/js/0.chunk.js:76887:9)
    at renderRootSync (http://localhost:3000/static/js/0.chunk.js:76853:11)
    at performSyncWorkOnRoot (http://localhost:3000/static/js/0.chunk.js:76470:22)
    at http://localhost:3000/static/js/0.chunk.js:65723:30
    at unstable_runWithPriority (http://localhost:3000/static/js/0.chunk.js:109251:16)
    at runWithPriority$1 (http://localhost:3000/static/js/0.chunk.js:65669:14)
    at flushSyncCallbackQueueImpl (http://localhost:3000/static/js/0.chunk.js:65718:13)
    at flushSyncCallbackQueue (http://localhost:3000/static/js/0.chunk.js:65706:7)
    at scheduleUpdateOnFiber (http://localhost:3000/static/js/0.chunk.js:76070:13)
    at Object.enqueueSetState (http://localhost:3000/static/js/0.chunk.js:66846:9)
    at StoreBuilder.push../node_modules/react/cjs/react.development.js.Component.setState (http://localhost:3000/static/js/0.chunk.js:86153:20)
    at StoreBuilder.<anonymous> (http://localhost:3000/static/js/0.chunk.js:103139:24)
    at step (http://localhost:3000/static/js/0.chunk.js:107933:17)
    at Object.next (http://localhost:3000/static/js/0.chunk.js:107864:14)
    at fulfilled (http://localhost:3000/static/js/0.chunk.js:107819:24)

Interestingly, passing the url to either spec or specUrl it works.

The way I am downloading the json:

  async function getJson(url) {
    const resp = await fetch(url);
    const json = await resp.json();

    if (resp.status !== 200) {
      throw Error(resp.message)
    };

    return json;
  }

When I console.log the output looks correct:

image

Any thoughts on this are appreciated - thanks!

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start at the RedocStandalone spec prop and follow the OpenAPIParser and SpecStore entries named in the stack trace. Reproduce the issue with the supplied fetched JSON object, compare it with the working URL input, and verify that passing the object renders the documentation without the validation error.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
documentation, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.