Swagger-Editor 4.12.1 failure when using latest swagger-ui (5.17.2) as a local dependency

[michaeljwiebe]

Q&A (please complete the following information)

• OS: macOS 12.7.4
• Node: 18.20.2
• Browser: Chrome
• Version: 124.0.6367.91
• Method of installation: npm
• Swagger-Editor version: 4.12.1
• Swagger-UI version:
  • 5.17.2 downloaded from https://github.com/swagger-api/swagger-ui/releases/tag/v5.17.2
  • installed, built using npm run build
  • modified package.json swagger-ui dependency like so: "swagger-ui": "../swagger-ui-5.17.2",
• Swagger/OpenAPI version: [e.g. Swagger 2.0, OpenAPI 3.0]

Content & configuration

src/index.js is unmodified:

import SwaggerUI from “swagger-ui-local”

const defaults = {
  // we have the `dom_id` prop for legacy reasons
  dom_id: "#swagger-editor", // eslint-disable-line camelcase
  layout: "EditorLayout",
  presets: [
    SwaggerUI.presets.apis
  ],
  plugins: [
    ...Object.values(plugins),
    () => ({ components: { EditorLayout } }),
    SwaggerUI.plugins.SafeRender({
      fullOverride: true,
      componentList: [
        "StandaloneLayout",
        "EditorLayout",
        "Topbar",
        "EditorContainer",
      ],
    })
  ],
  showExtensions: true,
  swagger2GeneratorUrl: "https://generator.swagger.io/api/swagger.json",
  oas3GeneratorUrl: "https://generator3.swagger.io/openapi.json",
  swagger2ConverterUrl: "https://converter.swagger.io/api/convert",
}

export default function SwaggerEditor(options) {
  let mergedOptions = deepMerge(defaults, options)

  mergedOptions.presets = defaults.presets.concat(options.presets || [])
  mergedOptions.plugins = defaults.plugins.concat(options.plugins || [])
  return SwaggerUI(mergedOptions)
}

SwaggerEditor.plugins = plugins

Screenshots

How can we help?

I am unable to use a local version of Swagger-UI in place of the npm package swagger-ui with the default configuration. I get this error: TypeError Cannot set properties of undefined (setting 'runtime').

In the console I also see Uncaught TypeError: SwaggerEditorBundle is not a function at window.onload, here is the implementation that error is coming from (this was not changed, it is the default):

window.onload = function() {
    // Webpack outputs library variables with file-names-like-this
    window["SwaggerEditorBundle"] = window["SwaggerEditorBundle"] || window["swagger-editor-bundle"]
    window["SwaggerEditorStandalonePreset"] = window["SwaggerEditorStandalonePreset"] || window["swagger-editor-standalone-preset"]
    // Build a system
    const editor = SwaggerEditorBundle({
      dom_id: '#swagger-editor',
      layout: 'StandaloneLayout',
      presets: [
        SwaggerEditorStandalonePreset
      ],
      plugins: [
        SwaggerEditorStandalonePreset.plugins.TopbarNewEditorButton,
      ],
      queryConfigEnabled: true,
    })

[michaeljwiebe]

We've determined the issue here was npm. Once we tried out yarn it works fine!

[michaeljwiebe]

Reopening because this is still an issue for the repo generally, even if I'm not dealing with it anymore. I do have a PR now that fixes it though! See above ^^