Swagger-ui: text overflow

[yoyo837]

ref: #3899

Q&A (please complete the following information)

• OS: [macOS]
• Browser: [chrome]
• Version: [3.25.0]
• Method of installation: [dist assets]
• Swagger-UI version: [3.25.0]
• Swagger/OpenAPI version: []

Content & configuration

Swagger-UI configuration options:

SwaggerUIBundle({
  url: "/api.do",
  dom_id: '#swagger-ui',
  deepLinking: true,
  presets: [
    SwaggerUIBundle.presets.apis,
    SwaggerUIStandalonePreset
  ],
  plugins: [
    SwaggerUIBundle.plugins.DownloadUrl
  ],
  layout: "StandaloneLayout"
})

Describe the bug you're encountering

To reproduce...

Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior

Screenshots

Additional context or thoughts

[sujithnath]

Can I pick up this bug fix?

[ffranchina]

Hello, I would like to work on this issue but I cannot reproduce the unexpected behavior. The UI works very fine on the most common resolutions both on Firefox and Chrome, it just breaks at very weird width (around 260).
Only in case of very long words (like JWT tokens or similar) the text for the default value overflows like in the screenshot.

Do you confirm it is the behavior we want to address?
Thanks for the info!

[yoyo837]

Yes, I think. I still got this problem. If the default value of the parameter is too long (cookie string、image base64 string), there is this problem.

[ffranchina]

Hello everyone!

The proposed fix addresses the specified issue but, on unusually small screens, most of the content of the page still overflows. The behavior is due to the usage of <table> to structure the content and a major refactoring is required in order to solve such problems. It seems that the problem is already known, though.

Please, let me know if you think this issue still needs more attention.

[yoyo837]

This is enough. That problem about very small screen is already known, let's handle it in another fix. Thanks great works.