Render array/object examples correctly according to style/explode

[cmeeren]

Parameter examples should render correctly based on the style and explode fields.

For example, consider this parameter definition:

parameters:
  - in: query
    name: scopes
    description: A comma-separated list of scopes
    schema:
      type: array
      items: string
    style: form
    explode: false
    example:
      - foo
      - bar

This currently renders like this:

I would expect the example to render like foo,bar (also without quotes).

A possible workaround would be to write example: foo,bar, but this renders as "foo,bar" with quotes, which is incorrect since it's a query parameter. So there's no workaround I know of to correctly display an example for a query string, except manually writing an example in the description.

Further reading: https://swagger.io/docs/specification/serialization

[RomanHotsiy]

Thanks for the detailed issue report!

This is a good issue for the first PR

[cmeeren]

I can't promise I can do anything (I don't have much JS experience), but could you point at the approximate location(s) in the code where changes would be needed? (This will be helpful for anyone else too.)

[RomanHotsiy]

I can't promise I can do anything

Don't worry, maybe someone else may take it up 👍

First step would be to create function in src/utils/openapi.ts which takes example and style and explode values and produces valid example value.

Then this function should be used here for value parameter: https://github.com/Rebilly/ReDoc/blob/f3b611e76de24ef9053792fa0521745ce9df500a/src/components/Fields/FieldDetails.tsx#L50

Also FieldDetail should be modified a bit to allow raw output (without JSON.stringify)

[Sebruck]

The same issue applies for style: form and explode: true, there i would expect Example: scopes=foo&scope=bar