swagger-ui icon indicating copy to clipboard operation
swagger-ui copied to clipboard

File browser shows in Swagger Editor but not in Swagger UI

Open dwwarr opened this issue 3 years ago • 2 comments

Q&A (please complete the following information)

  • OS: Linux or MacOS
  • Browser: Chrome, Firefox
  • Version: 90.0, 88.0
  • Method of installation: dist assets, docker, tried out at https://validator.swagger.io
  • Swagger-UI version: 3.48.0
  • Swagger/OpenAPI version: OpenAPI 3.0.1

Content & configuration

Example Swagger/OpenAPI definition:

openapi: 3.0.1
info:
  title: Product Services
  version: 2.3.0
servers:
  - url: /dp/api
tags:
  - name: Image
    description: Operations on Images
  - name: OtherProduct
    description: Operations on \'Other\' Product type data
paths:
  /stage:
    post:
      tags:
        - OtherProduct
        - Image
      summary: Stage content for up to 30 while user completes form.
      operationId: stageContent
      requestBody:
        content:
          multipart/form-data:
            schema:
              type: object
              required:
                - content
              properties:
                content:
                  type: string
                  description: content (source image or \'Other\' file)
                  format: binary
        required: true
      responses:
        200:
          description: Content staged
          content:
            application/json:
              schema:
                $ref: '#/components/schemas/StagedContent'
        500:
          description: Unexpected error
          content: { }
      security:
        - jwt: [ ]

components:
  schemas:
    StagedContent:
      required:
        - id
      type: object
      properties:
        id:
          type: string
          description: staged content id

  securitySchemes:
    jwt:
      type: "http"
      scheme: "bearer"
      bearerFormat: "JWT"

Describe the bug you're encountering

The /stage POST service described in the YAML above takes a file. When I view the UI for the service rendered by the Swagger editor at https://editor.swagger.io (swagger-editor-bundle.js, swagger-editor-standalone-preset.js), a file picker is shown.
When I view the UI for the service rendered by the Swagger UI (swagger-ui-bundle.js, swagger-ui-standalone-preset.js), a textbox is shown. I've tried installing the Swagger UI dist files locally, running the swaggerapi/swagger-ui Docker image, and using https://validator.swagger.io. Results are the same for all three.

It appears to me from this stack overflow question that the behavior was fixed in Swagger Editor in 2018, but that fix wasn't made in Swagger UI. I also realize that this could be related to issue 5636, but am not completely sure.

To reproduce...

Steps to reproduce the behavior:

  1. Render the YAML above in the Swagger UI
  2. Expand the POST stage/ service. See that a text box is shown rather than a file picker.
  3. Render the YAML above in the Swagger Editor at https://editor.swagger.io
  4. Expand the POST stage/ service. See that a file picker is shown, which is what should be shown.

Expected behavior

Swagger UI should show a file picker for services with requestBody item of type=string and format=binary

Screenshots

Swagger Editor swagger_editor_stage Swagger UI at https://validator.swagger.io swagger_validator_stage Swagger UI (dist files) swagger-ui_stage

dwwarr avatar May 12 '21 14:05 dwwarr

validator.swagger.io needs to get an updated version of swagger-ui. File upload dialog displays properly on my local dev version of swagger-ui

tim-lai avatar Jun 10 '21 18:06 tim-lai

Same problem

mazyvan avatar Jul 28 '22 16:07 mazyvan