enum and boolean type in parameters cause Objects are not valid as a child in swagger-ui-react

Reproduce example:

https://github.com/cywhale/test_swagger

To reproduce…

Steps to reproduce the behavior:

1. git clone https://github.com/cywhale/test_swagger.git
2. npm i
3. npm start

Example Swagger/OpenAPI definition: test data in repo: public/test.json (format had been validated in https://editor.swagger.io/ without errors) link: https://github.com/cywhale/test_swagger/blob/main/public/test.json

Swagger-UI configuration options: js source in src/components/Swagger/index.jsx link: https://github.com/cywhale/test_swagger/blob/main/src/components/Swagger/index.jsx

Describe the bug you’re encountering

1. After npm start, open browser: http://localhost:8080/swag/
2. A Swagger-UI with three testing paths: /v1/{id}, /v1/test_enum to test the error cases: boolean, and enum type, and the 3rd path: /v1/test_ok/{z} is a normal case (without error). Just pull down the paths, and get the errors in console and devTools

That’s, if I have boolean or enum type in json, just like the following, error occurred (logs pasted in the end of this issue), and the swagger-ui-react cannot correctly render. If I remove boolean/enum, it correctly render.

        "parameters": [
          {
            "description": "Test boolean",
            "example": true,
            "in": "query",
            "name": "temporal-aggregation",
            "required": false,
            "schema": {
              "type": "boolean"
            }
          }
//or
          {
            "description": "Test enum",
            "example": "10days",
            "in": "query",
            "name": "interval",
            "required": false,
            "schema": {
              "enum": [
                "10days",
                "day",
                "hour"
              ],
              "type": "string"
            }
          }

Expected behavior

Screenshots

1. test boolean error: https://github.com/cywhale/test_swagger/blob/main/test/test_swagger_error_boolean01.PNG
2. test enum error: https://github.com/cywhale/test_swagger/blob/main/test/test_swagger_error_enum01.PNG

Error logs (in devTool)

Error: Objects are not valid as a child. Encountered an object with the keys {size,_origin,_capacity,_level,_root,_tail,__ownerID,__hash,__altered}.

  in select
  in qt
  in Nr
  in 
  in 
  in Tr
  in Et
  in ht
  in WithErrorBoundary(ht)
  in Ne2
  in 
  in G3
  in WithErrorBoundary(G3)
  in WithSystem(WithErrorBoundary(G3))
  in Connect(WithSystem(WithErrorBoundary(G3)))
  in Connect(WithSystem(WithErrorBoundary(G3)))
  in we
  in WithSystem(we)
  in Connect(WithSystem(we))
  in Connect(WithSystem(we))
  in Ar
  in WithErrorBoundary(Ar)
  in WithSystem(WithErrorBoundary(Ar))
  in Connect(WithSystem(WithErrorBoundary(Ar)))
  in Connect(WithSystem(WithErrorBoundary(Ar)))
  in Z3
  in WithErrorBoundary(Z3)
  in WithSystem(WithErrorBoundary(Z3))
  in Connect(WithSystem(WithErrorBoundary(Z3)))
  in Connect(WithSystem(WithErrorBoundary(Z3)))
  in WithRoot(Connect(WithSystem(WithErrorBoundary(Z3))))
  in SwaggerUI2 (at /home/odbadmin/proj/test_swagger/src/components/Swagger/index.jsx:9)
  in Swagger (at /home/odbadmin/proj/test_swagger/src/components/Home.jsx:15)
  in Home (at /home/odbadmin/proj/test_swagger/src/app.tsx:21)
  in App (at /home/odbadmin/proj/test_swagger/src/main.tsx:6)
    Preact 10
 
Object { componentStack: "  in select\n  in qt\n  in Nr\n  in \n  in \n  in Tr\n  in Et\n  in ht\n  in WithErrorBoundary(ht)\n  in Ne2\n  in \n  in G3\n  in WithErrorBoundary(G3)\n  in WithSystem(WithErrorBoundary(G3))\n  in Connect(WithSystem(WithErrorBoundary(G3)))\n  in Connect(WithSystem(WithErrorBoundary(G3)))\n  in we\n  in WithSystem(we)\n  in Connect(WithSystem(we))\n  in Connect(WithSystem(we))\n  in Ar\n  in WithErrorBoundary(Ar)\n  in WithSystem(WithErrorBoundary(Ar))\n  in Connect(WithSystem(WithErrorBoundary(Ar)))\n  in Connect(WithSystem(WithErrorBoundary(Ar)))\n  in Z3\n  in WithErrorBoundary(Z3)\n  in WithSystem(WithErrorBoundary(Z3))\n  in Connect(WithSystem(WithErrorBoundary(Z3)))\n  in Connect(WithSystem(WithErrorBoundary(Z3)))\n  in WithRoot(Connect(WithSystem(WithErrorBoundary(Z3))))\n  in SwaggerUI2 (at /home/odbadmin/proj/test_swagger/src/components/Swagger/index.jsx:9)\n  in Swagger (at /home/odbadmin/proj/test_swagger/src/components/Home.jsx:15)\n  in Home (at /home/odbadmin/proj/test_swagger/src/app.tsx:21)\n  in App (at /home/odbadmin/proj/test_swagger/src/main.tsx:6)\n" }

Additional context or thoughts

I use preactjs 10.11.1(latest version), and vite 3.1.4. I’m not sure if it’s will be a cause for this issue

  "dependencies": {
    "history": "^5.3.0",
    "preact": "^10.11.1",
    "preact-router": "^4.1.0",
    "swagger-ui-react": "^4.14.2"
  },
  "devDependencies": {
    "@preact/preset-vite": "^2.4.0",
    "@rollup/plugin-replace": "^4.0.0",
    "esbuild": "^0.15.9",
    "fs": "^0.0.1-security",
    "path": "^0.12.7",
    "typescript": "^4.8.4",
    "vite": "^3.1.4"
  }

[tim-lai]

closed via #8231

[cywhale]

@cywhale eventually did you have success with preact? i see similar errors on very basic schema

Ya. New release >= v4.15.1 actually solve this problem. I have a test repo https://github.com/cywhale/test_swagger but it had updated to v4.15.1, the original proposed problems disappears.