[Bug] Showing extensions with long values causes rendering issues

[codyaray]

We have an extension x-extensible-enum that, when the number of items in the list goes beyond a certain limit, causes rendering issues in the HTML. We're passing --options.showExtensions=x-extensible-enum to Redoc CLI bundle.

You can see the rendering effects when the sub-object is exanded here:

Instead of wrapping to a new line, the extension list keeps growing. You can see it behind the right panel, and you also see strange horizontal line rendering artifacts as well. Also notice that the field description lines are no longer wrapping, on both the field with the extension and the other field as well.

When its collapsed, everything appears normally:

Here's a minimal reproducible example:

openapi: 3.0.0
info:
  title: Support API
  version: 1.0.0

paths:
  /support/v1/organizations:
    post:
      summary: Create an Organization
      requestBody:
        content:
          application/json:
            schema:
              $ref: '#/components/schemas/support.v1.Organization'
components:
  schemas:
    support.v1.Organization:
      type: object
      description: Search, create or update support organizations
      properties:
        name:
          type: string
          description: A unique name for the organization. This has to be globally unique. Otherwise bad things happen. Like long lines of text that don't break.
          example: An Organization
        organization_fields:
          type: object
          properties:
            timezone:
              type: string
              description: Primary Timezone
              default: gmtminus7
              example: gmtminus7
              x-extensible-enum:
                - gmtplus0
                - gmtplus1
                - gmtplus2
                - gmtplus3
                - gmtplus4
                - gmtplus5
                - gmtplus6
                - gmtplus7
                - gmtplus8
                - gmtplus9
                - gmtplus10
                - gmtplus11
                - gmtplus12
                - gmtplus13
                - gmtplus14
                - gmtminus11
                - gmtminus10
                - gmtminus9
                - gmtminus8
                - gmtminus7
                - gmtminus6
                - gmtminus5
                - gmtminus4
                - gmtminus3
                - gmtminus2
                - gmtminus1
          description: Custom fields for this organization
      additionalProperties: false

This was build using redoc-cli as

$ redoc-cli --version
0.9.13

$ redoc-cli bundle openapi.yaml --output openapi.html --options.showExtensions=x-extensible-enum
Prerendering docs

🎉 bundled successfully in: openapi.html (958 KiB) [⏱ 0.203s]

[codyaray]

Hi - can someone take a look a tthis?

[codyaray]

Just ran into this again with a new API. Can anyone take a look? 🙏

[codyaray]

Hello there! More than a year has passed. Plleaaaseeee

[RomanHotsiy]

Hey @codyaray.

PRs are welcome 🙌

[codyaray]

Alas, React and frontend tooling in general is my kryptonite. But thank you for responding, regardless. :)