swagger-api / swagger-api/swagger-ui

OAS 3.1 array items with contentMediaType render as text inputs instead of file pickers

Open Beginner friendly
#10,825 0 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
29k
Forks
9.3k
Avg merge
2d 23h
Merged PRs (30d)
25

Description

Q&A
  • OS: macOS
  • Browser: Chrome
  • Method of installation: npm
  • Swagger-UI version: 5.x (latest)
  • Swagger/OpenAPI version: OpenAPI 3.1
Content & configuration

Example Swagger/OpenAPI definition:

openapi: 3.1.0
info:
  title: Example
  version: 1.0.0
paths:
  /upload:
    post:
      requestBody:
        content:
          multipart/form-data:
            schema:
              type: object
              properties:
                files:
                  type: array
                  items:
                    type: string
                    contentMediaType: application/octet-stream
Describe the bug you're encountering

When a multipart/form-data body has an array property whose items use
contentMediaType (the OAS 3.1 / JSON Schema 2020-12 way to declare binary
content), Swagger UI renders plain text inputs instead of "Choose File" buttons.

This is reproducible with FastAPI 0.129.1+, which stopped emitting
format: binary for UploadFile fields in favour of contentMediaType: application/octet-stream to comply with the OAS 3.1 spec.

To reproduce...
  1. Serve the YAML above in Swagger UI
  2. Open POST /upload and click "Try it out"
  3. Click "Add string item"
  4. See a plain text input instead of a file picker
Expected behavior

Clicking "Add item" should produce a type="file" input (a "Choose File"
button), consistent with how format: binary array items are handled and
how single-file contentMediaType fields are already handled in
oas31/oas3-extensions/fn.js.

Screenshots

Current (broken):

Image

Expected:

Image

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in oas31/oas3-extensions/fn.js, where single-file contentMediaType handling is already implemented, and compare it with the array-item path. Reproduce the provided OpenAPI 3.1 multipart example in Swagger UI and verify that adding an item produces a file input rather than a text input.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
72/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.