swagger-api/swagger-ui · error · TypeError

Need a string, to fetch a component. Was given a ${typeof co

Error message

Need a string, to fetch a component. Was given a ${typeof componentName}

What it means

getComponent is a curried factory (src/core/plugins/view/root-injects.jsx:91) that resolves a registered component by its string name from the Swagger UI system's component registry. It throws a TypeError when the first argument is not a string, because the registry is keyed by component names. The second argument is a container flag ("root" | truthy | falsy) and the third is an optional config object such as { failSilently: true }.

Source

Thrown at src/core/plugins/view/root-injects.jsx:94

      return <WrappedComponent {...cleanProps} />
    }
  }
  WithMappedContainer.displayName = `WithMappedContainer(${fn.getDisplayName(WrappedComponent)})`
  return WithMappedContainer
}

export const render = (getSystem, getStore, getComponent, getComponents) => (domNode) => {
  const App = getComponent(getSystem, getStore, getComponents)("App", "root")
  const { createRoot } = ReactDOM
  const root = createRoot(domNode)

  root.render(<App/>)
}

export const getComponent = (getSystem, getStore, getComponents) => (componentName, container, config = {}) => {

  if (typeof componentName !== "string")
    throw new TypeError("Need a string, to fetch a component. Was given a " + typeof componentName)

    // getComponent has a config object as a third, optional parameter
    // using the config object requires the presence of the second parameter, container
    // e.g. getComponent("JsonSchema_string_whatever", false, { failSilently: true })
  const component = getComponents(componentName)

  if (!component) {
    if (!config.failSilently) {
      getSystem().log.warn("Could not find component:", componentName)
    }
    return null
  }

  if(!container) {
    return component
  }

  if(container === "root") {

View on GitHub (pinned to 3d9d0916d4)

Solutions

1. Pass the registered component name as a string: getComponent("Operation", "root").
2. Check the registry first with getComponents() to confirm the exact registered name.
3. For optional lookups pass { failSilently: true } as the third argument to get null instead of a warning — but the name must still be a string.
4. Remember getComponent is curried: the outer call takes (getSystem, getStore, getComponents) and returns the resolver; do not swap the two call sites.

Example fix

// before
const Comp = getComponent(SomeReactComponent, "root")

// after
const Comp = getComponent("Operation", "root")
// or, for an optional lookup:
const Maybe = getComponent("MaybeMissing", true, { failSilently: true })

// Ensure the name is a non-empty string before resolving.
const name = possiblyName
if (typeof name !== "string" || name.length === 0) {
  throw new Error(`component name must be a non-empty string, got ${typeof name}`)
}
const Comp = getComponent(name, true, { failSilently: true })

// Narrows a value to a valid registered component name.
const isComponentName = (v) => typeof v === "string" && v.length > 0

let Comp
try {
  Comp = getComponent(name, "root")
} catch (e) {
  if (/Need a string, to fetch a component/.test(e.message)) {
    console.error("getComponent needs a registered component name string; got:", name)
    Comp = null
  } else {
    throw e
  }
}

When it happens

Trigger: Calling the inner resolver with a non-string, e.g. getComponent(...)(undefined), getComponent(...)(SomeReactClass), or getComponent(...)(42); passing a config object as the first argument; mistaking the outer factory for the resolver and calling getComponent(SomeComponent); a plugin overriding getComponent and forwarding a non-string value.

Common situations: Custom code calling system.getComponent with a component reference instead of its registered name; destructure mistakes (const { getComponent } = system; getComponent(MyComp)); porting from an older API where argument order or currying differed; React wrappers forwarding positional props into the resolver.

Related errors

• wrapActions needs to return a function that returns a new fu
• wrapSelector needs to return a function that returns a new f

AI-assisted analysis of swagger-api/swagger-ui@3d9d0916d4 (2026-08-13). Data as JSON: /api/errors/c508dc7a5d0c17a7. Report an issue: GitHub.