The sandbox form could do more client side validations

[ajvondrak]

For instance, consider this simple swagger.yaml:

swagger: '2.0'
info:
  title: Example
  version: '1.0'
paths:
  /example:
    get:
      parameters:
        - name: age
          in: query
          description: user's age
          required: true
          type: integer
          format: int32
          minimum: 18
          maximum: 24

When loaded in swagger-ui, the "Try it out!" button (which submits the so-called "sandbox form") comes with some slick client-side validation: I try to click the submit button without filling in the age, the text box shakes at me and gets a red border. When I plug in anything else for the age - 12, 30, asdf - the form submission works just fine. This in spite of the JSON Schema validations declared in the API.

I went digging and found out that required fields are the only ones that get validated by this Javascript. It seems to me like there could (should?) be way more client side validations that give similar signals to the user.

I realize this is kind of a big task: determining the correct UI for each sort of field (e.g., enums already get dropdown lists, but date formats don't get a fancy datepicker), adding the JS to perform the validation, the fact that there are quite a few different kinds of validations, interactions between different validations & types, etc. But I think there's plenty of room for enhancement.

I have a hard time telling if this is a duplicate of any of the issues brought up on the list already, so just let me know if I should watch some other ticket. Thanks!

[webron]

This is related to #808 - that issue talks about the display of the validation attributes but we extended the discussion to the validation as well (which should probably be toggled).

@bshamblen has done amazing work in promoting the display, and I hope he'll have time to help with the validation as well.

Of course, we'd appreciate PRs for this from anyone as well :)

[heldersepu]

@webron I would like to help with this issue...
Is this the file where the validation takes place:
https://github.com/swagger-api/swagger-ui/blob/master/src/core/utils.js#L503

[webron]

Maybe - @shockey or @owenconti would be able to say ;)

Thanks for your contributions, @heldersepu - you're really helping the project.

[shockey]

@heldersepu, that's the place! Feel free to rearrange things if you think it's best.

Feel free to reach out to me over email (in profile) if you need any pointers 😄

[heldersepu]

This issue can be closed...
All requested validations have been added

[shockey]

🎉

Closing!