Javascript error while executing file upload request

[billybraga]

Q&A

• OS: Windows
• Browser: chrome
• Version: 99
• Method of installation: repro on editor.swagger.io and locally using npm+vuejs+webpack
• Swagger-UI version: 4.6.2 and 4.6.1
• Swagger/OpenAPI version: OpenAPI 3.0

Content & configuration

https://editor.swagger.io

Example Swagger/OpenAPI definition:

openapi: 3.0.0
info:
  title: Upload bug in swagger ui
  version: 1.0.0
servers:
- url: http://example.com
paths:
  /InsertFile:
    post:
      requestBody:
        content:
          image/png:
            schema:
              type: string
              format: binary
      responses:
        200:
          description: success
          content:
            application/octet-stream:
              schema:
                type: string
                format: binary

Describe the bug you're encountering

TypeError: (0 , zt.isPlainObject) is not a function
    at Object.nn [as execute] (swagger-ui-es-bundle-core.js:1:165216)
    at swagger-ui-es-bundle-core.js:1:111063
    at swagger-ui-es-bundle-core.js:1:198302
    at redux.js:546:12
    at swagger-ui-es-bundle-core.js:1:127167
    at Object.r (swagger-ui-es-bundle-core.js:1:410340)
    at Object.executeRequest (swagger-ui-es-bundle-core.js:1:414734)
    at swagger-ui-es-bundle-core.js:1:111836
    at swagger-ui-es-bundle-core.js:1:198302
    at redux.js:546:12

To reproduce...

Steps to reproduce the behavior:

1. Try it out
2. Choose file
3. Click execute
4. See error

Expected behavior

Request is sent

Screenshots

[pilotofbalance]

Im getting similar one TypeError: Ut.isPlainObject is not a function , any updates?

[youasl]

I have the same issue, for almost 3 weeks now. I also posted it on the community support forum. I noticed this issue is only with POST method. GET works.

[denarie]

I have the same issue just using the petstore example and executing the POST for a pet, I did not change any values, just executed the request as is.
Steps to reproduce:

• open https://editor.swagger.io/ in your browser (I am using firefox, but other browsers had the same issue)
• open the POST pet accordion
• click on "Try it out"
• click on "execute"
• when you open the browser console, you can see the error message:

TypeError: zt.isPlainObject is not a function
....
swagger-ui-es-bundle-core.js:1:414793

[umamahesh134]

I have the same issue just using the petstore example and executing the POST for a pet, I did not change any values, just executed the request as is.
Steps to reproduce:

open https://editor.swagger.io/ in your browser (I am using firefox, but other browsers had the same issue)
open the POST pet accordion
click on "Try it out"
click on "execute"
when you open the browser console, you can see the error message:

TypeError: (0 , zt.isPlainObject) is not a function
at Object.nn [as execute] (swagger-editor-bundle.js:sourcemap:2:323639)
at swagger-editor-bundle.js:sourcemap:2:271805
at Object.dispatch (swagger-editor-bundle.js:sourcemap:2:358668)
at dispatch (:3665:80)
at swagger-editor-bundle.js:sourcemap:2:2463140
at swagger-editor-bundle.js:sourcemap:2:287909
at Object.r (swagger-editor-bundle.js:sourcemap:2:570580)
at Object.executeRequest (swagger-editor-bundle.js:sourcemap:2:574979)
at swagger-editor-bundle.js:sourcemap:2:272578
at Object.dispatch (swagger-editor-bundle.js:sourcemap:2:358668)

[char0n]

Hello everybody,

After further analysis, it looks like this errors happens when SwaggerUI is build as part of SwaggerEditor. SwaggerUI build fragments are built using webpack@5, SwaggerEditor build fragments are built using webpack@4. It seems that if we build SwaggerUI as part of SwaggerEditor using current webpack configs this error and others are present.

Cause: we bundle SwaggerUI with webpack@5 into commonjs2 format, which means webpack runtime is bundled with the build fragment. When we build SwaggerEditor with webpack@4, it's using it'own runtime which is not compatible with webpack@5 one. This is something that webpack authors warn about as it may cause various issues like this one. There is an ongoing effort to migrate SwaggerEditor to webpack@5 which should resolve the issue - swagger-api/swagger-editor#2944. Probably the best course of action would be to make SwaggerUI produce native ESM bundle without webpack runtime and go from there.

Update 24.4.2022: looks like best course of action here will be build true ESM bundle in SwaggerUI and consume it here in SwaggerEditor. I've tested that this setup work.

Resources:

• [Webpack 5] (minimal repro included!) __webpack_modules__[moduleId] is undefined webpack/webpack#11277
• https://segmentfault.com/a/1190000040067453/en
• https://lifesaver.codes/answer/modules-moduleid-is-undefined-error-is-unhelpful-5429

[char0n]

Create #7937 to expose true ESM build which work with SwaggerEditor webpack@4 bunding. Tested that SwaggerEditor works correctly and eliminates the problem reported in this issue.

Final PR that provides remediation for this issue: swagger-api/swagger-editor#2985

Summary:

SwaggerUI now exposes true EMS build fragment that SwaggerEditor is using. This provides remediation for error reported in this issue and other that might be manifesting.

[char0n]

Released as https:/swagger-api/swagger-editor/releases/tag/v4.2.1 and successfully deployed to https://editor.swagger.io/