Code Monkey home page Code Monkey logo

Comments (8)

moneil avatar moneil commented on May 24, 2024 1

Thanks for taking a look @tatomyr!

Unfortunately, on my system:
$ wget https://anthology-devdocs.s3.amazonaws.com/academics.yaml
$ npx @redocly/cli@latest preview-docs ~/Downloads/academics.yaml
Using Redoc community edition.
Login with redocly login or use an enterprise license key to preview with the premium docs.

🔎 Preview server running at http://127.0.0.1:8080

Bundling...

👀 Watching /Users/moneil/Downloads/academics.yaml and all related resources for changes

Created a bundle for /Users/moneil/Downloads/academics.yaml successfully
GET /: 17.636ms
GET /hot.js: 5.378ms
GET /simplewebsocket.min.js: 12.112ms
GET /favicon.ico: 1.084ms
GET /openapi.json: 26.406ms
GET /apple-touch-icon-precomposed.png: 0.464ms
GET /apple-touch-icon.png: 0.402ms

Loading the page fails (Safari endless load spinner, Chrome times out, etc)

Same results for GA @redocly/cli

I have managed to successfully split, then bundle and build-docs for all except academics_AreaOfStudy and academics_ProgramVersion - both of which bundle fine, but then issue heap errors on building. Perhaps that may help in tracing the issue?

from redoc.

Orest-Yastremskyy avatar Orest-Yastremskyy commented on May 24, 2024

Hi @moneil

Thank you for reporting this. I was able to replicate this issue from our side.

Let us check it, please.

from redoc.

tatomyr avatar tatomyr commented on May 24, 2024

I was trying to investigate what's happening here, and it looks like the definition itself uses too many references. I was able to track down more than 40 nested refs, and it doesn't seem to help much.
The particular error comes from this line, so it might also be related to react-dom/server package.
Also tried to bundle with --dereferenced option; then lint fails with the Maximum call stack size exceeded. error. It's not clear whether the definition indeed exceeds some hard limit of nested calls or there are some circular dependencies that Redocly CLI doesn't catch.

from redoc.

nwp avatar nwp commented on May 24, 2024

Thanks, @tatomyr for responding! This is a small subset of a much much larger open-api file (it represents maybe 10% of that file). so in extracting a subset, it may indeed include some references that are not immediately necessary. However, our longer-term goal is to import the whole file into Redoc.

from redoc.

tatomyr avatar tatomyr commented on May 24, 2024

@nwp I see,
Strange thing is that it gets rendered with preivew-docs command, as far as I can see. Could you confirm the bigger file also gets rendered in the preview mode?

from redoc.

moneil avatar moneil commented on May 24, 2024

Per the above I just realized I did not share the failed bundles... here are a couple links:
(fails)only_academics_AreaOfStudy.yaml
(fails)only_academics_ProgramVersion.yaml

from redoc.

tatomyr avatar tatomyr commented on May 24, 2024

I wrote a small plugin for investigating $refs, which could also help to investigate your API descriptions. In particular, I found A LOT of circular references in the provided example, and the max reference depth is 56. That might be one of the causes of the original issue.

If you're interested, here's the code:

// refs-plugin.js

module.exports = {
  id: 'refs-plugin',
  rules: {
    oas3: {
      'no-circular-refs': () => {
        let depth = 0;
        let maxDepth = 0;
        const pointers = new Set();

        return {
          ref: {
            enter(node, { location, report }) {
              depth++;
              maxDepth = Math.max(maxDepth, depth);
              const thisPointer = location.source.absoluteRef + node.$ref;
              if (pointers.has(thisPointer)) {
                report({
                  message: `Circular reference detected: ${thisPointer}`,
                  location: location.child('$ref'),
                });
              } else {
                pointers.add(thisPointer);
              }
            },
            leave(node, { location }) {
              depth--;
              const thisPointer = location.source.absoluteRef + node.$ref;
              pointers.delete(thisPointer);
            },
          },
          Root: {
            leave(node, ctx) {
              console.log(`\n\nMax $ref depth is ${maxDepth} \n\n`);
            },
          },
        };
      },
    },
  },
};

Redocly config file:

# redocly.yaml

plugins: 
  -  refs-plugin.js
rules: 
  refs-plugin/no-circular-refs: error

from redoc.

tatomyr avatar tatomyr commented on May 24, 2024

I'm transferring this as the issue is specific to Redoc (it doesn't get reproduced with the preview-docs command using a licence key).

Also it makes sense to consolidate this with other similar Redoc issues: #2399 and #2383

from redoc.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.