"Try it out" doesn't prompt with form when parameters are a schema

[andrew-regan]

The following path used to provide username/password text input fields. In 3.0.2 it now requires the "Example Value" text box to be edited. It looks like this happens when the input parameters are specified using schema.

        "/auth/token": {
            "post": {
                "tags": [
                    "auth"
                ],
                "summary": "Get an API key",
                "description": "",
                "operationId": "getApiKey",
                "security": [],
                "consumes": [
                    "application/json"
                ],
                "produces": [
                    "application/json; version=1.0"
                ],
                "parameters": [
                    {
                        "in": "body",
                        "name": "body",
                        "description": "Authentication",
                        "required": true,
                        "schema": {
                            "$ref": "#/definitions/auth_credentials"
                        }
                    }
                ],
                "responses": {
                    "200": {
                        "description": "Successful Authentication",
                        "schema": {
                            "description": "Authorization Result",
                            "allOf": [
                                {
                                    "$ref": "#/definitions/Response"
                                },
                                {
                                    "properties": {
                                        "result": {
                                            "description": "API Key",
                                            "type": "string",
                                            "example": "example_api-key_iZkjs8-Yc2LzRjpwKbai11kkPZg"
                                        }
                                    }
                                }
                            ]
                        }
                    },
                    "400": {
                        "description": "Invalid Format",
                        "schema": {
                            "$ref": "#/definitions/ErrorResponse"
                        }
                    },
                    "401": {
                        "description": "Invalid Credentials",
                        "schema": {
                            "$ref": "#/definitions/AuthErrorResponse"
                        }
                    }
                }
            }
        }
...
        "auth_credentials": {
            "type": "object",
            "properties": {
                "username": {
                    "type": "string",
                    "minLength": 1,
                    "title": "Username"
                },
                "password": {
                    "type": "string",
                    "format": "password",
                    "minLength": 1,
                    "title": "Password",
                    "secret": true
                }
            },
            "additionalProperties": false,
            "required": [
                "username",
                "password"
            ]
        },

As an example the following path which does not use schema provides a text input field for name:

        "/support_bundles/{name}": {
            "delete": {
                "tags": [
                    "support_bundles"
                ],
                "summary": "Delete a single support bundle",
                "description": "",
                "operationId": "deleteSupportBundle",
                "produces": [
                    "application/json; version=1.0"
                ],
                "parameters": [
                    {
                        "name": "name",
                        "in": "path",
                        "description": "Name of support bundle",
                        "required": true,
                        "type": "string"
                    }
                ],
                "responses": {
                    "200": {
                        "description": "Success",
                        "schema": {
                            "$ref": "#/definitions/Response"
                        }
                    }
                }
            }
        },

[webron]

That's because it's a JSON object. In the previous version we had a community contribution of a JSON Schema form editor, but we couldn't migrate it as-is and it wasn't well maintained.

We might be able to bring in a similar functionality to 3.X as we have experience doing so, however, the efforts in doing so are great (it introduces a lot of UI issues). Is this something you'd consider assisting with? We'll give guidance for the process.

[andrew-regan]

If I had the skills I would, but you don't want me writing Javascript. 😄

[andrew-regan]

Any idea if/when this will get implemented? Just curious...I assume the P3 label means its lower on the list? Thanks!

[webron]

It's not on any of our immediate plans, there's no ETA for it.

[jobec]

How about, instead of crafting a input fields from the model, make the current input text area a real Json editor?

Like the left side of the swagger editor tool (with all bells and whistles of the ACE editor) but with the model as the "schema" to validate against. (e.g. create a basic JSON schema of the model and use it to validate the input).

It will also make is easier to try our multiple different inputs by copy pasting. Which isn't possible when it are individual form fields. And on top of that, you support sheer infinite nesting of properties in the model.

Because... if you start making a form with the current screen spacing, you'll need to scroll forever. (see #4359)

[webron]

That's a solution that would appease some users, but I doubt that most. It can be an option, but can't be the only solution.

[pli41]

I just implemented JSON editor with package "react-jsonschema-form" in my fork(https://github.com/pli41/swagger-ui.git). Hopefully this can be helpful for people who need this feature! You can find more info in my commit's comments.

BTW I do not have prior experience with front end development. Please do correct me if I have done something terrible lol.