Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Loading windows with Collections results error messages: "Too many re-renders", "cyclic object value" #4016

Closed
lutzhelm opened this issue Dec 5, 2024 · 1 comment
Closed

Loading windows with Collections results error messages: "Too many re-renders", "cyclic object value" #4016

lutzhelm opened this issue Dec 5, 2024 · 1 comment
Labels
bug manifest compatibility Investigate why specific manifests are not loading or rendering correctly Mirador 4

Comments

@lutzhelm
Copy link
Contributor

lutzhelm commented Dec 5, 2024

(Just wanted to drop this here, might have a look at it myself later...)

Example Collection URLs:

Observed behavior

Configuring Mirador with a Collection as window resource or selecting a Collection from the resource list results in the following error messages. I suspect that this is caused by updated dependencies (that have not been pinned by a package-lock.json); I get similar errors if I try to load collections with fresh local installs of v3.2.0 through v 3.4.0.

UI error message:

Error
Too many re-renders. React limits the number of renders to prevent an infinite loop.
Call Stack
 renderWithHooks
  node_modules/react-dom/cjs/react-dom.development.js:2659:139
 mountIndeterminateComponent
  node_modules/react-dom/cjs/react-dom.development.js:3297:1445
 beginWork
  node_modules/react-dom/cjs/react-dom.development.js:3636:93
 callCallback
  node_modules/react-dom/cjs/react-dom.development.js:730:119
 invokeGuardedCallbackDev
  node_modules/react-dom/cjs/react-dom.development.js:750:45
 invokeGuardedCallback
  node_modules/react-dom/cjs/react-dom.development.js:771:126
 beginWork$1
  node_modules/react-dom/cjs/react-dom.development.js:4702:22
 performUnitOfWork
  node_modules/react-dom/cjs/react-dom.development.js:4518:150
 workLoopSync
  node_modules/react-dom/cjs/react-dom.development.js:4504:47
 renderRootSync
  node_modules/react-dom/cjs/react-dom.development.js:4500:159

Console messages:

Uncaught Error: Too many re-renders. React limits the number of renders to prevent an infinite loop.
    React 18
    Redux 21
    s http://localhost:4444/collections.html:3
    Redux 3
    addWindow webpack-internal:///./src/state/actions/window.js:33
    middleware Redux
    dispatch http://localhost:4444/collections.html:6
    key Redux
    handleOpenButtonClick webpack-internal:///./src/components/ManifestListItem.js:27
    React 23
    renderInto webpack-internal:///./src/lib/MiradorViewer.js:21
    MiradorViewer webpack-internal:///./src/lib/MiradorViewer.js:18
    viewer webpack-internal:///./src/init.js:12
    <anonymous> http://localhost:4444/collections.html:14
[react-dom.development.js:15498:14](webpack://Mirador/node_modules/react-dom/cjs/react-dom.development.js?cada)
Uncaught TypeError: cyclic object value
    ErrorContent webpack-internal:///./src/components/ErrorContent.js:18
    React 18
    Redux 21
    s http://localhost:4444/collections.html:3
    Redux 3
    addWindow webpack-internal:///./src/state/actions/window.js:33
    middleware Redux
    dispatch http://localhost:4444/collections.html:6
    key Redux
    handleOpenButtonClick webpack-internal:///./src/components/ManifestListItem.js:27
    React 23
    renderInto webpack-internal:///./src/lib/MiradorViewer.js:21
    MiradorViewer webpack-internal:///./src/lib/MiradorViewer.js:18
    viewer webpack-internal:///./src/init.js:12
    <anonymous> http://localhost:4444/collections.html:14
[ErrorContent.js:47:48](webpack://Mirador/src/components/ErrorContent.js?c102)
    ErrorContent ErrorContent.js:47
    React 18
    checkForUpdates connect.tsx:166
    handleChangeWrapper Subscription.ts:129
    notify Subscription.ts:29
    defaultNoopBatch batch.ts:3
    notify Subscription.ts:26
    notifyNestedSubs Subscription.ts:124
    checkForUpdates connect.tsx:153
    handleChangeWrapper Subscription.ts:129
    notify Subscription.ts:29
    defaultNoopBatch batch.ts:3
    notify Subscription.ts:26
    notifyNestedSubs Subscription.ts:124
    checkForUpdates connect.tsx:153
    handleChangeWrapper Subscription.ts:129
    notify Subscription.ts:29
    defaultNoopBatch batch.ts:3
    notify Subscription.ts:26
    notifyNestedSubs Subscription.ts:124
    handleChangeWrapper Subscription.ts:129
    dispatch createStore.ts:220
    forEach self-hosted:1873
    dispatch createStore.ts:219
    s collections.html:3
    Redux 2
    dispatch applyMiddleware.ts:52
    addWindow window.js:91
    middleware Redux
    dispatch collections.html:6
    key bindActionCreators.ts:12
    handleOpenButtonClick ManifestListItem.js:91
    React 19
    forEach self-hosted:4281
    React 4
    renderInto MiradorViewer.js:30
    MiradorViewer MiradorViewer.js:21
    viewer init.js:15
    <anonym> collections.html:14
The above error occurred in the <ErrorContent> component:

ErrorContent@webpack-internal:///./src/components/ErrorContent.js:18:2322
PluginHoc@webpack-internal:///./src/extend/withPlugins.js:18:115
ConnectFunction@webpack-internal:///./node_modules/react-redux/dist/react-redux.mjs:53:277
I18nextWithTranslation@webpack-internal:///./node_modules/react-i18next/dist/es/withTranslation.js:8:3095
section
withEmotionCache/<@webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-7a1343fa.browser.development.esm.js:30:60
Paper@webpack-internal:///./node_modules/@mui/material/Paper/Paper.js:22:2308
MinimalWindow@webpack-internal:///./src/components/MinimalWindow.js:21:341
PluginHoc@webpack-internal:///./src/extend/withPlugins.js:18:115
ConnectFunction@webpack-internal:///./node_modules/react-redux/dist/react-redux.mjs:53:277
I18nextWithTranslation@webpack-internal:///./node_modules/react-i18next/dist/es/withTranslation.js:8:3095
Window/ErrorWindow<@webpack-internal:///./src/components/Window.js:29:94
ErrorBoundary@webpack-internal:///./node_modules/react-error-boundary/dist/react-error-boundary.development.esm.js:10:4548
Window@webpack-internal:///./src/components/Window.js:28:65
PluginHoc@webpack-internal:///./src/extend/withPlugins.js:18:115
ConnectFunction@webpack-internal:///./node_modules/react-redux/dist/react-redux.mjs:53:277
I18nextWithTranslation@webpack-internal:///./node_modules/react-i18next/dist/es/withTranslation.js:8:3095
div
div
InternalMosaicWindow@webpack-internal:///./node_modules/react-mosaic-component/lib/MosaicWindow.js:1:4098
ConnectedInternalMosaicWindow@webpack-internal:///./node_modules/react-mosaic-component/lib/MosaicWindow.js:1:11061
MosaicWindow@webpack-internal:///./node_modules/react-mosaic-component/lib/MosaicWindow.js:5:892
div
div
MosaicRoot@webpack-internal:///./node_modules/react-mosaic-component/lib/MosaicRoot.js:1:1870
div
MosaicWithoutDragDropContext@webpack-internal:///./node_modules/react-mosaic-component/lib/Mosaic.js:1:3152
DndProvider@webpack-internal:///./node_modules/react-dnd/dist/core/DndProvider.js:9:2171
Mosaic@webpack-internal:///./node_modules/react-mosaic-component/lib/Mosaic.js:1:6877
withEmotionCache/<@webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-7a1343fa.browser.development.esm.js:30:60
WorkspaceMosaic@webpack-internal:///./src/components/WorkspaceMosaic.js:37:69
PluginHoc@webpack-internal:///./src/extend/withPlugins.js:18:115
ConnectFunction@webpack-internal:///./node_modules/react-redux/dist/react-redux.mjs:53:277
div
withEmotionCache/<@webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-7a1343fa.browser.development.esm.js:30:60
div
IIIFDropTarget@webpack-internal:///./src/components/IIIFDropTarget.js:18:4093
Workspace@webpack-internal:///./src/components/Workspace.js:25:66
PluginHoc@webpack-internal:///./src/extend/withPlugins.js:18:115
ConnectFunction@webpack-internal:///./node_modules/react-redux/dist/react-redux.mjs:53:277
I18nextWithTranslation@webpack-internal:///./node_modules/react-i18next/dist/es/withTranslation.js:8:3095
main
withEmotionCache/<@webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-7a1343fa.browser.development.esm.js:30:60
div
withEmotionCache/<@webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-7a1343fa.browser.development.esm.js:30:60
WorkspaceArea@webpack-internal:///./src/components/WorkspaceArea.js:21:52
PluginHoc@webpack-internal:///./src/extend/withPlugins.js:18:115
ConnectFunction@webpack-internal:///./node_modules/react-redux/dist/react-redux.mjs:53:277
I18nextWithTranslation@webpack-internal:///./node_modules/react-i18next/dist/es/withTranslation.js:8:3095
Suspense
DndProvider@webpack-internal:///./node_modules/react-dnd/dist/core/DndProvider.js:9:2171
MaybeDndProvider@webpack-internal:///./src/components/AppProviders.js:29:73
DefaultPropsProvider@webpack-internal:///./node_modules/@mui/system/esm/DefaultPropsProvider/DefaultPropsProvider.js:12:150
RtlProvider@webpack-internal:///./node_modules/@mui/system/esm/RtlProvider/index.js:13:141
ThemeProvider@webpack-internal:///./node_modules/@mui/private-theming/ThemeProvider/ThemeProvider.js:20:47
ThemeProvider@webpack-internal:///./node_modules/@mui/system/esm/ThemeProvider/ThemeProvider.js:26:47
ThemeProvider@webpack-internal:///./node_modules/@mui/material/styles/ThemeProvider.js:14:82
StyledEngineProvider@webpack-internal:///./node_modules/@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js:14:187
I18nextProvider@webpack-internal:///./node_modules/react-i18next/dist/es/I18nextProvider.js:7:41
StoreAwareI18nextProvider@webpack-internal:///./src/components/AppProviders.js:34:89
div
FullScreen@webpack-internal:///./node_modules/react-full-screen/dist/index.modern.js:9:1524
FullScreenShim@webpack-internal:///./src/components/AppProviders.js:31:66
AppProviders@webpack-internal:///./src/components/AppProviders.js:41:52
PluginHoc@webpack-internal:///./src/extend/withPlugins.js:18:115
ConnectFunction@webpack-internal:///./node_modules/react-redux/dist/react-redux.mjs:53:277
PluginProvider@webpack-internal:///./src/extend/PluginProvider.js:14:1396
App@webpack-internal:///./src/components/App.js:19:43
Provider@webpack-internal:///./node_modules/react-redux/dist/react-redux.mjs:60:36

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries. [react-dom.development.js:18704:14](webpack://Mirador/node_modules/react-dom/cjs/react-dom.development.js?cada)
    React 17
    checkForUpdates connect.tsx:166
    handleChangeWrapper Subscription.ts:129
    notify Subscription.ts:29
    defaultNoopBatch batch.ts:3
    notify Subscription.ts:26
    notifyNestedSubs Subscription.ts:124
    checkForUpdates connect.tsx:153
    handleChangeWrapper Subscription.ts:129
    notify Subscription.ts:29
    defaultNoopBatch batch.ts:3
    notify Subscription.ts:26
    notifyNestedSubs Subscription.ts:124
    checkForUpdates connect.tsx:153
    handleChangeWrapper Subscription.ts:129
    notify Subscription.ts:29
    defaultNoopBatch batch.ts:3
    notify Subscription.ts:26
    notifyNestedSubs Subscription.ts:124
    handleChangeWrapper Subscription.ts:129
    dispatch createStore.ts:220
    dispatch createStore.ts:219
    s collections.html:3
    Redux 2
    dispatch applyMiddleware.ts:52
    addWindow window.js:91
    middleware Redux
    dispatch collections.html:6
    key bindActionCreators.ts:12
    handleOpenButtonClick ManifestListItem.js:91
    React 23
    renderInto MiradorViewer.js:30
    MiradorViewer MiradorViewer.js:21
    viewer init.js:15
    <anonym> collections.html:14
@lutzhelm lutzhelm added bug manifest compatibility Investigate why specific manifests are not loading or rendering correctly Mirador 4 labels Dec 5, 2024
cbeer added a commit that referenced this issue Dec 12, 2024
@cbeer
Remove forced re-render; it doesn't seem necessary any more. Part of #…
1ca7b5b 
…4016.
@cbeer cbeer mentioned this issue Dec 12, 2024
Merged
@cbeer
Copy link
Collaborator

cbeer commented Dec 12, 2024 

Converting circular structure to JSON
    --> starting at object with constructor 'Object'
    |     property '__collection' -> object with constructor 't'
    --- property '__jsonld' closes the circle
TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'Object'
    |     property '__collection' -> object with constructor 't'
    --- property '__jsonld' closes the circle
    at JSON.stringify (<anonymous>)
    at ErrorContent (webpack-internal:///./src/components/ErrorContent.js:18:4294)

@cbeer cbeer mentioned this issue Dec 12, 2024
Merged
cbeer added a commit that referenced this issue Dec 12, 2024
@cbeer
Remove forced re-render; it doesn't seem necessary any more. Part of #…
f6c092f 
…4016.
@cbeer cbeer closed this as completed Dec 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug manifest compatibility Investigate why specific manifests are not loading or rendering correctly Mirador 4
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@cbeer @lutzhelm