Swagger UI React doesn't render the spec on first mount.

[maddymanu]

Q&A (please complete the following information)

• OS: macOS
• Browser: chrome
• Version: swagger-ui-react
• Method of installation: Yarn add
• Swagger-UI version: Multiple Versions [ 3.52.5, 4.0.0-rc.4 ]
• Swagger/OpenAPI version: OpenAPI 3.0.1

Describe the bug you're encountering

Hey Guys!

We're using swagger-ui-react at our organization, and I think we uncovered a bug.
The spec isn't rendered on the first mount of the SwaggerUI component, even though the props are being passed in.

The UI just says No API definition provided.

I've matched the react app versions as well (15.x, 16.x and 17.x).
I've tried the stable/beta/alpha releases. With the corresponding React versions.

Screenshots attached!

Swagger-UI configuration options:

        <SwaggerUI
          spec={selectedSpec.spec}
          docExpansion={'list'}
        />

where selectedSpec.spec refers to the plain string YAML spec.

Expected behavior

The first mount should render the spec (second image).

Screenshots

First Mount:

Second:

[char0n]

@maddymanu you're right. I could reproduce, the spec prop is not propagated to the redux store and nothing gets renderered.

Rendering doesn't work when spec is provided as a string. If provided as POJO the rendering works.

[char0n]

Looking into this now.

[char0n]

Fix provided in #7856

componentDidUpdate in swagger-ui-react now uses current/prev props comparisons along with comparisons with current redux state. This guarantees that swagger-ui-react will rerender whenever needed.

[char0n]

Released as https://github.com/swagger-api/swagger-ui/releases/tag/v4.5.2