Execute button non-responsive when using form data input if read only field exists in schema

[LondonAppDev]

Q&A (please complete the following information)

• OS: macOS 11.3.1
• Browser: Tested with Brave 1.24.82 and Firefox 88.0
• Swagger-UI version: 3.44.0 (and whatever runs on editor.swagger.io)
• Swagger/OpenAPI version: OpenAPI 3.0.3

Content & configuration

Steps to re-produce:

1. Visit https://editor.swagger.io.
2. Paste the schema provided below.
3. Expand POST /sample/ endpoint
4. Set Request body: multipart/form-data
5. Enter any text in description
6. Click Execute

You should see that nothing happens.

Example Swagger/OpenAPI definition:

openapi: 3.0.3
info:
  title: 'Sample issue'
  version: 0.0.0
paths:
  /sample/:
    post:
      operationId: sample_create
      description: Sample viewset.
      tags:
      - sample
      requestBody:
        content:
          application/json:
            schema:
              $ref: '#/components/schemas/Sample'
          application/x-www-form-urlencoded:
            schema:
              $ref: '#/components/schemas/Sample'
          multipart/form-data:
            schema:
              $ref: '#/components/schemas/Sample'
        required: true
      responses:
        '201':
          content:
            application/json:
              schema:
                $ref: '#/components/schemas/Sample'
          description: ''
components:
  schemas:
    PatchedSample:
      type: object
      description: Sample serializer to demonstrate issue.
      properties:
        id:
          type: integer
          readOnly: true
        description:
          type: string
    Sample:
      type: object
      description: Sample serializer to demonstrate issue.
      properties:
        id:
          type: integer
          readOnly: true
        description:
          type: string
      required:
      - description
      - id

If you remove the readOnly: true line from the id field on the Sample schema, the problem goes away.

Describe the bug you're encountering

The execute button is non-responsive when trying to make a POST request to an API with a schema that contains a read only field.

Additional context or thoughts

I suspect that the validation done when hitting Execute is including the id read only field in the backround?

[tfranzel]

this is most likely related to #6250

the bug also appears for the most recent version 3.48.0

hitting execute simply won't work unless application/json is selected. both alternatives simply result in a dead button and no fired request.

[mathis-m]

This happens because your id property is explicitly required by the schema. @tim-lai what is the excpected behaviour here? From validation perspective this is fine. A required property is not provided. Question: should readonly disable the required check?

[tfranzel]

@mathis-m, is this why its not working in swagger-ui? the id field is marked as readOnly which makes it implicitly non-required on request. this is from the 3.0.3 spec:

If the property is marked as readOnly being true and is in the required list, the required will take effect on the response only.

also the json path correctly fills the the request body textfield from the template with description and without id. so the schema interpretation is correct there.

apart from that, user feedback should happen if the request cannot be sent and why. imho at least

[mathis-m]

@tfranzel Thanks the research on the spec. Going to look into this and provide a fix the next days.