swagger-api / swagger-ui

Swagger UI is a collection of HTML, JavaScript, and CSS assets that dynamically generate beautiful documentation from a Swagger-compliant API.
https://swagger.io
Apache License 2.0
26.68k stars 8.97k forks source link

File browser shows in Swagger Editor but not in Swagger UI #7261

Open dwwarr opened 3 years ago

dwwarr commented 3 years ago

Q&A (please complete the following information)

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

tim-lai commented 3 years ago

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

mazyvan commented 2 years ago

Same problem