Skip to content

topoaa.mol.description causes app to error #81

Description

@sverhoeven

The topoaa.mol parameter is the first type=array parameter which has a description.
When schema is tested on https://rjsf-team.github.io/react-jsonschema-form/ the description is rendered correctly.

To reproduce

  1. In public/catalog/haddock3.easy.yaml find the mol schema and add description: Some description.
  2. npm run dev
  3. Load example
  4. Select topoaa in middle column
  5. Expand Input molecules

I expected to see a sub form, but I got a error.

Error in console
react.development.js:220 Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `ArrayFieldDescription2`.
    at ArrayFieldDescription2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:212:33)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:207:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:169:23
    at div
    at DefaultNormalArrayFieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:296:39)
    at ArrayFieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:192:22)
    at ArrayField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:11676:5)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:490:23
    at FieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:368:17)
    at SchemaField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:13480:5)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:207:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:169:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:204:23
    at ObjectFieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:387:32)
    at ObjectField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:12867:5)
    at div
    at CollapsibleField (http://localhost:3000/src/CollapsibleField.tsx:22:13)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:490:23
    at FieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:368:17)
    at SchemaField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:13480:5)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:207:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:169:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:204:23
    at ObjectFieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:387:32)
    at ObjectField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:12867:5)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:490:23
    at FieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:368:17)
    at SchemaField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:13480:5)
    at form
    at Form2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:16497:5)
    at http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:16976:23
    at NodeForm (http://localhost:3000/src/NodeForm.tsx:22:35)
    at fieldset
    at NodePanel (http://localhost:3000/src/NodePanel.tsx:22:29)
    at div
    at GridArea (http://localhost:3000/src/App.tsx:28:3)
    at div
    at Suspense
    at ErrorBoundary (http://localhost:3000/src/ErrorBoundary.tsx:5:8)
    at DndProvider2 (http://localhost:3000/node_modules/.vite/deps/react-dnd.js?v=8f9c04b2:2784:23)
    at RecoilRoot_INTERNAL (http://localhost:3000/node_modules/.vite/deps/recoil.js?v=8f9c04b2:2464:3)
    at RecoilRoot (http://localhost:3000/node_modules/.vite/deps/recoil.js?v=8f9c04b2:2575:5)
    at Wrapper (http://localhost:3000/src/Wrapper.tsx:25:3)
    at App
printWarning @ react.development.js:220
react-dom.development.js:25058 Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `ArrayFieldDescription2`.
    at createFiberFromTypeAndProps (react-dom.development.js:25058:21)
    at createFiberFromElement (react-dom.development.js:25086:15)
    at reconcileSingleElement (react-dom.development.js:14052:23)
    at reconcileChildFibers2 (react-dom.development.js:14112:35)
    at reconcileChildren (react-dom.development.js:16990:28)
    at mountIndeterminateComponent (react-dom.development.js:17890:5)
    at beginWork (react-dom.development.js:19049:16)
    at HTMLUnknownElement.callCallback2 (react-dom.development.js:3945:14)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:16)
    at invokeGuardedCallback (react-dom.development.js:4056:31)
react-dom.development.js:20085 The above error occurred in the <ArrayFieldDescription2> component:

    at ArrayFieldDescription2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:212:33)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:207:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:169:23
    at div
    at DefaultNormalArrayFieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:296:39)
    at ArrayFieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:192:22)
    at ArrayField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:11676:5)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:490:23
    at FieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:368:17)
    at SchemaField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:13480:5)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:207:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:169:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:204:23
    at ObjectFieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:387:32)
    at ObjectField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:12867:5)
    at div
    at CollapsibleField (http://localhost:3000/src/CollapsibleField.tsx:22:13)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:490:23
    at FieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:368:17)
    at SchemaField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:13480:5)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:207:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:169:23
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-BK3S5FMQ.js?v=8f9c04b2:204:23
    at ObjectFieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:387:32)
    at ObjectField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:12867:5)
    at div
    at http://localhost:3000/node_modules/.vite/deps/chunk-YBP25ECQ.js?v=8f9c04b2:490:23
    at FieldTemplate2 (http://localhost:3000/node_modules/.vite/deps/@rjsf_bootstrap-4.js?v=8f9c04b2:368:17)
    at SchemaField2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:13480:5)
    at form
    at Form2 (http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:16497:5)
    at http://localhost:3000/node_modules/.vite/deps/chunk-T4IBOB7J.js?v=8f9c04b2:16976:23
    at NodeForm (http://localhost:3000/src/NodeForm.tsx:22:35)
    at fieldset
    at NodePanel (http://localhost:3000/src/NodePanel.tsx:22:29)
    at div
    at GridArea (http://localhost:3000/src/App.tsx:28:3)
    at div
    at Suspense
    at ErrorBoundary (http://localhost:3000/src/ErrorBoundary.tsx:5:8)
    at DndProvider2 (http://localhost:3000/node_modules/.vite/deps/react-dnd.js?v=8f9c04b2:2784:23)
    at RecoilRoot_INTERNAL (http://localhost:3000/node_modules/.vite/deps/recoil.js?v=8f9c04b2:2464:3)
    at RecoilRoot (http://localhost:3000/node_modules/.vite/deps/recoil.js?v=8f9c04b2:2575:5)
    at Wrapper (http://localhost:3000/src/Wrapper.tsx:25:3)
    at App

React will try to recreate this component tree from scratch using the error boundary you provided, ErrorBoundary.

When debugging I see ArrayFieldDescription at https://github.com/rjsf-team/react-jsonschema-form/blob/master/packages/bootstrap-4/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx#L179 is undefined.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions