Redoc demo readFile undefined

[ocole007]

Describe the bug
When we use the "Try It" feature at https://redocly.github.io/redoc/ e.g. https://redocly.github.io/redoc/?url=https://docs.graphhopper.com/openapi.json, an exception is raised.

Expected behavior
The URL passed to redoc should render the based on the swagger JSON description.

Minimal reproducible OpenAPI snippet(if possible)

Screenshots

Cannot read properties of undefined (reading 'readFile')
Stack trace
Error: Cannot read properties of undefined (reading 'readFile')
at t.BaseResolver. (https://redocly.github.io/redoc/redoc-demo.bundle.js:2:27238)
at Generator.next ()
at https://redocly.github.io/redoc/redoc-demo.bundle.js:2:25385
at new Promise ()
at r (https://redocly.github.io/redoc/redoc-demo.bundle.js:2:25130)
at t.BaseResolver.loadExternalRef (https://redocly.github.io/redoc/redoc-demo.bundle.js:2:27020)
at t.BaseResolver. (https://redocly.github.io/redoc/redoc-demo.bundle.js:2:27751)
at Generator.next ()
at https://redocly.github.io/redoc/redoc-demo.bundle.js:2:25385
at new Promise ()

ReDoc Version: 2.0.0-rc.68
Commit: 494122f
Additional context

[AlexVarchuk]

Hi @ocole007, we released the next version 2.0.0-rc.69. It works for me.

Please verify or add additional steps to reproduce(browser version, OS, etc)

[jaaufauvre]

I'm getting the same error.

[AlexVarchuk]

Hi @jaaufauvre, can you add me steps to reproduce and some additional information(browser version, OS, screenshot of network tab, etc)

[jaaufauvre]

Hi @AlexVarchuk,

Edge 101.0.1210.47, Chrome 101.0.4951.64, Brave 101.0.4951.41

Windows 10, Windows 11

✔️ https://redocly.github.io/redoc/?url=https://api.apis.guru/v2/specs/googleapis.com/calendar/v3/openapi.yaml&nocors

❌ https://redocly.github.io/redoc/?url=https://api.apis.guru/v2/specs/googleapis.com/calendar/v3/openapi.yaml

Something went wrong...
Cannot read properties of undefined (reading 'readFile')
Stack trace
Error: Cannot read properties of undefined (reading 'readFile')
    at t.BaseResolver.<anonymous> (https://redocly.github.io/redoc/redoc-demo.bundle.js:2:27238)
    at Generator.next (<anonymous>)
    at https://redocly.github.io/redoc/redoc-demo.bundle.js:2:25385
    at new Promise (<anonymous>)
    at r (https://redocly.github.io/redoc/redoc-demo.bundle.js:2:25130)
    at t.BaseResolver.loadExternalRef (https://redocly.github.io/redoc/redoc-demo.bundle.js:2:27020)
    at t.BaseResolver.<anonymous> (https://redocly.github.io/redoc/redoc-demo.bundle.js:2:27751)
    at Generator.next (<anonymous>)
    at https://redocly.github.io/redoc/redoc-demo.bundle.js:2:25385
    at new Promise (<anonymous>)

ReDoc Version: 2.0.0-rc.68
Commit: 494122f9

[AlexVarchuk]

@jaaufauvre we redeployed the demo page.
Hopes it helps. Please check.

[jaaufauvre]

Hi @AlexVarchuk, nop it didn't help. It works with Firefox though.

[ocole007]

Hi @AlexVarchuk , upon further inspection, this could be a CORS issue as I tested without CORS checked and it worked in some instances.

[AlexVarchuk]

Hi @ocole007. Seems it can be true. We have a special checkbox for it. One of the cases should be working.

[jaaufauvre]

Yes, this is what I mentioned earlier ☝
✔️ https://redocly.github.io/redoc/?url=https://api.apis.guru/v2/specs/googleapis.com/calendar/v3/openapi.yaml&nocors
❌ https://redocly.github.io/redoc/?url=https://api.apis.guru/v2/specs/googleapis.com/calendar/v3/openapi.yaml

[AlexVarchuk]

I missed it. 🙈
I think it is expected behavior. One of CORS's cases should work.

[AlexVarchuk]

I close this issue. Because it is expected behavior. The demo page should work in one of the CORS cases (enabled/disabled).

[kiwisincebirth]

@AlexVarchuk - This tread helped me identify an issue that I was having. As a suggestion - It would be good if you handled the error, and correctly reported it in user friendly way - It would simplify the understanding of the issue, and make the tool easier to use. - Great Tool BTW :)

[ayame113]

The demo page should work in one of the CORS cases (enabled/disabled).

It looks like this problem still exists.

• https://redocly.github.io/redoc/?url=https://apiland.deno.dev/~/spec&nocors -> It fails with a CORS error.
• https://redocly.github.io/redoc/?url=https://apiland.deno.dev/~/spec -> Chrome on windows fails with Cannot read properties of undefined (reading 'readFile') error. works fine in firefox.

---

I've debugged this and it seems that different browsers have different ways of handling the URL constructor.
The code below returns different results.

new URL("\\\\cors.redoc.ly/https://apiland.deno.dev/~/spec", "https://redocly.github.io/redoc/?url=https://apiland.deno.dev/~/spec")

I think maybe correcting the url in this line from \\\\cors.redoc.ly/ to https://cors.redoc.ly/ will fix the problem.

redoc/demo/index.tsx

Line 89 in 3d410b6

? '\\\\cors.redoc.ly/' + new URL(specUrl, window.location.href).href