swagger-api / swagger-api/swagger-ui

Swagger UI freezes when processing a 1.5MB response

Open
#7,687 4 comments 3 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
29k
Forks
9.3k
Avg merge
2d 23h
Merged PRs (30d)
25

Description

Q&A (please complete the following information)
  • OS: Linux Mint 19.3
  • Browser: Firefox 90.0 and Chromium 95.0
  • Method of installation: dist assets
  • Swagger-UI version: 4.1.0
  • Swagger/OpenAPI version: OpenAPI 3.0
Content & configuration

openapi2.json.txt

The path GET /definition/template/adl1.4/{template_id} retrieves an XML that is 1.5 MB long.

Swagger-UI configuration options:

window.onload = function() {
        // Begin Swagger UI call region
        const ui = SwaggerUIBundle({
          url: "/assets/openapi2.json",
          dom_id: '#swagger-ui',
          deepLinking: true,
          presets: [
            SwaggerUIBundle.presets.apis//,
            //SwaggerUIStandalonePreset // commented to remove the topbar plugin
          ],
          plugins: [
            SwaggerUIBundle.plugins.DownloadUrl
          ]//,
          //layout: "StandaloneLayout" // commented to remove the topbar plugin
        });
        // End Swagger UI call region

        window.ui = ui;
      };
Describe the bug you're encountering

Call to the endpoint freezes the whole page and stays in "LOADING" forever.

Screenshot_2021-11-29_14-03-18

In the JS console I see this trace from highlight.js:

Script terminated by timeout at:
O@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:182485
C@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:182558
R<@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:185916
oi@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:790540
qi@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:800058
Hu@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:843753
Os@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:829987
ks@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:829915
Ss@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:829776
vs@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:826763
Jo/<@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:776435
t.unstable_runWithPriority@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:853474
Wo@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:776212
Jo@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:776382
$o@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:776315
gs@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:827084
notify@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:252413
O</t.notifyNestedSubs@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:253048
O</t.handleChangeWrapper@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:253116
p@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:946287
Ce/</</<@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:61301
$/<@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:946718
ze/</<@http://localhost:8095/assets/swagger-ui-bundle.js?compile=false:2:89982

Maybe this is not a swagger-ui issue per se, it seems the highlight lib doesn't have the power to handle the big XML.

Can highlight be disabled to test?

To reproduce...

The API is not public so it can't be reproduced publicly. Internally what I do is:

  1. Invoke the authentication endpoint
  2. Copy the token to the AUTHORIZATION button
  3. Invoke the list templates endpoint
  4. Copy the template id from the response
  5. Invoke the get template endpoint with the template id
  6. Everything freezes
Expected behavior

Avoid freezing.

Screenshots

See above.

Additional context or thoughts

Allow to disable the response highlight to test.

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 with the supplied openapi2.json.txt, the GET /definition/template/adl1.4/{template_id} response, and the highlight.js stack trace in the generated swagger-ui-bundle.js asset. Reproduce with a large XML response if possible and investigate the response-highlighting path. Done means the 1.5 MB response no longer freezes the page, or response highlighting can be disabled for verification.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, performance
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.