Editor: "Error rendering component" - Inspector gone

cloud · November 11, 2021, 10:05am

Hello there,

After additing a Vector3-variable with the “@visibleInInspector”-decorator over the constructor inside a custom typescript-file the Inspector went away and left me alone with the message “Error rendering component”.

Here my Code and the response:

import {Vector3} from "@babylonjs/core";
import { visibleInInspector } from "./decorators";

export default class MyScript extends Node {
    @visibleInInspector("Vector3","Target: Move X") private x:Vector3;
...

Thanks for Help!

RaananW · November 11, 2021, 12:35pm

pinging @julien-moreau

andreaghiri · November 26, 2021, 11:51am

Hello Cloud, did you find any workaround? I have the same issue, just a default cube in the scene and a .dds file added in the texture panel.
Once I apply the .dds environment to the cube and I turn off the backface culling to see the inner faces of it, the inspector panel shows the message “Error rendering component” and all the tabs on the top disappear. I’ve already reinstalled the last version of the editor and the previous one too.

sebavan · November 26, 2021, 8:15pm

@julien-moreau probably missed the message nw he ll be answering soon

julien-moreau · November 30, 2021, 6:18pm

Hi @cloud and @andreaghiri !
So sorry for my late !

I just tried to reproduce but without success. In the top “Main toolbar → Edit → Preferences” there is checkbox that you can check to see the Editor’s console (it is called “Enable Electron DevTools”). Then, click the green button “Ok”.

Once done, can you restart the Editor, navigate until you reproduce the error and then paste all the console logs here? That would help me a lot as I fail when I try to reproduce

Thanks a lot !

andreaghiri · December 1, 2021, 11:45am

Thanks @julien-moreau for your answer!
I can’t upload any log file in attachment because I’m a new user, so I’m trying to paste there only the errors, splitted in 2 messages because of the characters limit:

react_devtools_backend.js:2540 Warning: `children` of Tree is deprecated. Please use `treeData` instead. 
    at Tree (C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/rc-tree/lib/Tree.js:65:36)
    at C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/antd/lib/tree/Tree.js:33:33
    at DirectoryTree (C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/antd/lib/tree/DirectoryTree.js:73:29)
    at div
    at div
    at Graph (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/components/graph.js:80:28)
    at ErrorBoundary (C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/flexlayout-react/lib/view/ErrorBoundary.js:23:28)
    at div
    at exports.Tab (C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/flexlayout-react/lib/view/Tab.js:14:24)
    at div
    at Layout (C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/flexlayout-react/lib/view/Layout.js:49:28)
overrideMethod @ react_devtools_backend.js:2540
warning @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/rc-util/lib/warning.js:20
call @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/rc-util/lib/warning.js:37
warningOnce @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/rc-util/lib/warning.js:43
getDerivedStateFromProps @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/rc-tree/lib/Tree.js:949
applyDerivedStateFromProps @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:13958
mountClassInstance @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:14367
updateClassComponent @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:18414
beginWork$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:20186
beginWork$$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:25756
performUnitOfWork @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24695
workLoopSync @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24671
performSyncWorkOnRoot @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24270
(anonymous) @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12199
unstable_runWithPriority @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\scheduler\cjs\scheduler.development.js:697
runWithPriority$2 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12149
flushSyncCallbackQueueImpl @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12194
flushSyncCallbackQueue @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12182
scheduleUpdateOnFiber @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:23709
enqueueSetState @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:13994
Component.setState @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react\cjs\react.development.js:325
Graph.refresh @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/components/graph.js:124
ProjectImporter._RefreshEditor @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:850
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:715
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:33
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:14
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:5
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:7
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:8
__awaiter @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:4
ProjectImporter._ImportProject @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:100
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:81
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:33
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:14
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:8
__awaiter @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:4
ProjectImporter.ImportProject @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/project/project-importer.js:75
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:829
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:52
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:33
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:24
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:26
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:24
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:26
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:24
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:26
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:24
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:26
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:27
__awaiter @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:23
Editor._init @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:765
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:383
setTimeout (async)
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:383
callback @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:27522
callCallback @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:13829
commitUpdateEffects @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:13867
commitUpdateQueue @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:13855
commitLifeCycles @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:22160
commitLayoutEffects @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:25344
callCallback @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:336
invokeGuardedCallbackDev @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:385
invokeGuardedCallback @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:440
commitRootImpl @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:25082
unstable_runWithPriority @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\scheduler\cjs\scheduler.development.js:697
runWithPriority$2 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12149
commitRoot @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24922
finishSyncRender @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24329
performSyncWorkOnRoot @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24307
scheduleUpdateOnFiber @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:23698
updateContainer @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:27103
(anonymous) @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:27528
unbatchedUpdates @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24433
legacyRenderSubtreeIntoContainer @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:27527
render @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:27608
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:382
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:52
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:33
fulfilled @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:24
Promise.then (async)
step @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:26
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:27
__awaiter @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:23
Editor.init @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:341
Editor @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/editor.js:334
(anonymous) @ editor.html:80
t._invokeFactory @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:23
t.complete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:24
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._onModuleComplete @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s._resolve @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:34
s.defineModule @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:28
o @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:32
(anonymous) @ editor.main.js:10
e._onLoad @ editor.main.js:9
(anonymous) @ editor.main.js:9
r @ editor.main.js:9
load (async)
e.attachListeners @ editor.main.js:9
e.createLinkTag @ editor.main.js:9
e.load @ editor.main.js:10
e.load @ editor.main.js:10
s._loadPluginDependency @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:32
s._resolve @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:33
s.defineModule @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:28
o @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:35
c @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:20
(anonymous) @ editor.main.js:304
(anonymous) @ editor.main.js:2179
t._createAndEvalScript @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:20
(anonymous) @ C:/Program Files/BabylonJS Editor/resources/app.asar/node_modules/monaco-editor/min/vs/loader.js:19
(anonymous) @ electron/js2c/asar.js:533
wrapper @ fs.js:470
C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:244 Uncaught TypeError: Cannot read property 'vignetteEnabled' of null
    at RenderingInspector._getDefaultState (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:244)
    at RenderingInspector._updateDefaultState (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:252)
    at Object.onChange (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:158)
    at InspectorBoolean._handleValueChanged (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/gui/inspector/fields/boolean.js:109)
    at onChange (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/gui/inspector/fields/boolean.js:70)
    at HTMLUnknownElement.callCallback (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:336)
    at Object.invokeGuardedCallbackDev (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:385)
    at invokeGuardedCallback (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:440)
    at invokeGuardedCallbackAndCatchFirstError (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:454)
    at executeDispatch (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:584)

I hope that it can help you in reproducing and resolving this annoying bug.
Thank you,
Andrea

andreaghiri · December 1, 2021, 11:46am

C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:475 Uncaught TypeError: Cannot read property 'vignetteEnabled' of null
    at RenderingInspector._getDefaultState (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:244)
    at RenderingInspector._updateDefaultState (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:252)
    at Object.onChange (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:158)
    at InspectorBoolean._handleValueChanged (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/gui/inspector/fields/boolean.js:109)
    at onChange (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/gui/inspector/fields/boolean.js:70)
    at HTMLUnknownElement.callCallback (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:336)
    at Object.invokeGuardedCallbackDev (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:385)
    at invokeGuardedCallback (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:440)
    at invokeGuardedCallbackAndCatchFirstError (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:454)
    at executeDispatch (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:584)
RenderingInspector._getDefaultState @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:244
RenderingInspector._updateDefaultState @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:252
onChange @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:158
InspectorBoolean._handleValueChanged @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/gui/inspector/fields/boolean.js:109
onChange @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/gui/inspector/fields/boolean.js:70
callCallback @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:336
invokeGuardedCallbackDev @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:385
invokeGuardedCallback @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:440
invokeGuardedCallbackAndCatchFirstError @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:454
executeDispatch @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:584
executeDispatchesInOrder @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:609
executeDispatchesAndRelease @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:713
executeDispatchesAndReleaseTopLevel @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:722
forEachAccumulated @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:692
runEventsInBatch @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:739
runExtractedPluginEventsInBatch @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:880
handleTopLevel @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:5803
batchedEventUpdates$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24401
batchedEventUpdates @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:1415
dispatchEventForPluginEventSystem @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:5894
attemptToDispatchEvent @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:6010
dispatchEvent @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:5914
unstable_runWithPriority @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\scheduler\cjs\scheduler.development.js:697
runWithPriority$2 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12149
discreteUpdates$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24417
discreteUpdates @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:1438
dispatchDiscreteEvent @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:5881
C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:244 Uncaught TypeError: Cannot read property 'vignetteEnabled' of null
    at RenderingInspector._getDefaultState (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:244)
    at new RenderingInspector (C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:70)
    at constructClassInstance (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:14204)
    at updateClassComponent (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:18413)
    at beginWork$1 (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:20186)
    at HTMLUnknownElement.callCallback (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:336)
    at Object.invokeGuardedCallbackDev (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:385)
    at invokeGuardedCallback (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:440)
    at beginWork$$1 (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:25780)
    at performUnitOfWork (C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24695)
RenderingInspector._getDefaultState @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:244
RenderingInspector @ C:/Program Files/BabylonJS Editor/resources/app.asar/build/src/renderer/editor/inspectors/scene/rendering-inspector.js:70
constructClassInstance @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:14204
updateClassComponent @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:18413
beginWork$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:20186
callCallback @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:336
invokeGuardedCallbackDev @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:385
invokeGuardedCallback @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:440
beginWork$$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:25780
performUnitOfWork @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24695
workLoopSync @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24671
performSyncWorkOnRoot @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24270
(anonymous) @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12199
unstable_runWithPriority @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\scheduler\cjs\scheduler.development.js:697
runWithPriority$2 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12149
flushSyncCallbackQueueImpl @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12194
flushSyncCallbackQueue @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12182
discreteUpdates$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24423
discreteUpdates @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:1438
dispatchDiscreteEvent @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:5881
react_devtools_backend.js:2540 The above error occurred in the <RenderingInspector> component:
    in RenderingInspector (created by Inspector)
    in div (created by Blueprint3.Tabs)
    in div (created by Blueprint3.Tabs)
    in Blueprint3.Tabs (created by Inspector)
    in div (created by Inspector)
    in Inspector
    in ErrorBoundary
    in div
    in Unknown (created by Layout)
    in div (created by Layout)
    in Layout

React will try to recreate this component tree from scratch using the error boundary you provided, ErrorBoundary.
overrideMethod @ react_devtools_backend.js:2540
logCapturedError @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:21843
logError @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:21880
update.payload @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:23247
getStateFromUpdate @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:13644
processUpdateQueue @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:13767
updateClassInstance @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:14521
updateClassComponent @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:18420
beginWork$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:20186
beginWork$$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:25756
performUnitOfWork @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24695
workLoopSync @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24671
performSyncWorkOnRoot @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24270
(anonymous) @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12199
unstable_runWithPriority @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\scheduler\cjs\scheduler.development.js:697
runWithPriority$2 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12149
flushSyncCallbackQueueImpl @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12194
flushSyncCallbackQueue @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:12182
discreteUpdates$1 @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:24423
discreteUpdates @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:1438
dispatchDiscreteEvent @ C:\Program Files\BabylonJS Editor\resources\app.asar\node_modules\react-dom\cjs\react-dom.development.js:5881

julien-moreau · December 1, 2021, 12:46pm

Hi @andreaghiri thanks ! That helped me a lot and I just fixed the bug.
I’ll deploy the version 4.0.5 today and include the fix for @cloud if I can get the logs here as well in case it’s another error

julien-moreau · December 2, 2021, 6:46pm

@andreaghiri version 4.0.5 deployed!

carolhmj · December 29, 2021, 2:19pm

Hi @andreaghiri @cloud just checking in if the new editor version solved the problem for you

rascheln · March 22, 2023, 12:12am

I’ll add to this, even though it’s been a year now. I was trying to edit the scene, because my PBR metallic roughness node material didn’t seem to be registering the baseColor to the scene (despite it showing up in preview)

I altered one of the colors for “ambient color” under the rendering tab, but then that number became “NaN” and the scene registered an ambient color of (0, 1, 1). I clicked something else, maybe when scrolling or who knows, and I, too, get the “Error rendering component” error in the inspector window, with zero ability to recover the inspector. Was I not supposed to click that field? No idea. The documentation is too sparse to determine.

I think it’s safe for me to conclude that this editor is way too experimental to do dev work on, for now. I was just looking for a safe way to save my material node graphs.

sebavan · March 22, 2023, 4:31pm

If it is just to save your material nodes graph, why not using nme.babylonjs.com directly ?

julien-moreau · March 28, 2023, 11:13am

Hi @rascheln !

@sebavan is right and I’m on it to try to reproduce and fix that bug

Topic		Replies	Views
Inspector's tools: n.Color3 is not a constructor Bugs	11	1622	February 26, 2020
Importing inspector in typescript cause failure if engine started with offscreen canvas Questions gui , inspector	23	1428	September 12, 2022
Babylonjs editor to reactjs Bugs	4	288	May 18, 2023
Babylon.inspector.module.d.ts 4.2 throws error Questions	4	869	February 22, 2021
DebugLayer on Babylon 3.3 Questions	4	559	March 7, 2019

Editor: "Error rendering component" - Inspector gone

Related Topics