Thanks @labris and sorry for the slow reply - busy week! This was actually a bug in AnimationGroup itself, and I have a PR to fix it here. Should be deployed early next week!
2 Likes
@labris there is not an Inspector v2 option named sidePaneRemapper that can help with this. It is a function that takes as an input each side pane definition, and as an output an overridden horizontal/vertical location, or null to exclude the pane entirely. Something like this was needed for back compat with Inspector v1, so I tried to set it up to support your scenario as well.
1 Like
The design of the new inspector looks “cleaner” in the screenshots, but when I tried it in practice, I discovered a number of issues.
-
Colors - It has become less convenient to find the necessary objects in the SceneExplorer because now all icons are the same color. What were the reasons for abandoning color differentiation?
-
The Properties panel - Due to the removal of horizontal dividing lines, it is now difficult to match a property name with its value. Now everything is a jumbled mess. Also, the dark theme is too high-contrast; my eyes started hurting after a few minutes of work. Honestly, 100% black background and 100% white text is terrible for the eyes.
I just wanted to bring this to your attention. I hope the design is not final and that you will pay attention to colors, padding, and font sizes. The old interface was much more convenient to work with, and I’m sure it’s not just a matter of habit.
1 Like
Hi.
Just a very brief response.
My first impression of the design is the same like diving in some Microsoft Windows menues.
Am i wrong to see the same font and gui elements or is this OS dependent?
It makes it more like setting some settings rather than as a tool for development.
Less powerful, less deep feeling (as Windows does the same to me).
Probably need to get used to it, as we would use it.
Best. Werner
Hi @ryantrem, I’ve found a weird behavior: for example, when I deploy nodes and select one, I can’t close the Nodes panel; but if I open the Materials panel, the Nodes panel can then be closed, and the Materials panel subsequently inherits this strange behavior. Maybe this was raised before ? “@babylonjs/inspector”: “^8.39.0-preview”,
No real reason, its just not the default behavior with the new UI system we are using. We could definitely add icon colors if this is the community preference! I’ve added it to the list of requests in this tracking issue: Inspector v2 bugs and feedback · Issue #17293 · BabylonJS/Babylon.js · GitHub
Would love to hear more community feedback on this one! We tried to make the UI less busy and easier to read, but if it is having the opposite effect for most people, we definitely want to know! @PatrickRyan
Oh wow, totally missed this! The contrast ratio looks good to me in Scene Explorer, but I can see in the other side panes the text appears white (whereas in Scene Explorer it is more of a light gray). This seems like a bug and we’ll look into it, thanks for pointing it out!
Appreciate the feedback. We don’t have significant UX changes planned, but are always open to feedback from the community. More feedback is always helpful so we can choose a design that works for most people, or add options when preferences are really divided.
There is a broader effort to overhaul the UI across all our tools (@georgie) so we can spend less time on generic React component development and more time on unique Babylon platform (libraries and tools) development. We chose @fluentui/react-components as our UI system. There were a few contenders, but we ultimately went with this choice because we felt it was the best fit for what we were looking for:
- UI library specifically for React
- Broad array of components out of the box, including more complex components we don’t want to build and maintain, like color pickers
- High performance with good support for things like tree view virtualization so we can scale to very large scenes
- CSS-in-JS to make bundling simple and avoid CSS collision issues with the host app
- Well maintained with good support options
This is definitely a bug that we were not aware of, thanks a ton for letting us know! I’ll try to get this addressed soon!
2 Likes
@samuelgirardin this is now fixed and has been deployed to Sandbox/Playground. Thanks again for reporting the issue!
1 Like
Inspector v2 is now ~95% backward compatible with v1 in terms of the Babylon APIs. The only things that are not backward compatible are a few things like options that don’t really have an equivalent in v2 because of design differences (enablePopup and enableClose for example, as the side panes always allow being popped out and closing them just redocks them).
So if you are already using Inspector.Show(...) or Scene.debugLayer.show(...), you can simply install the Inspector v2 package (e.g. @babylonjs/inspector@preview) and everything should still work.
3 Likes
Is there any plan on adding an edit button for node materials like in the v1 inspector? I find it useful to try different input values ^^ I see there is already an edit button in the properties tab for frame graphs so I don’t know if that was forgotten 
Nice catch, cc @ryantrem for after the break ?
1 Like
Hey @CrashMaster, it’s not there yet, but it is coming! The current plan is to finish the overall tools UI overhaul work first, which replaces scss with a css-in-js solution. Otherwise we would have to do very short term throw-away work to build and bundle scss in the Inspector v2 esm bundle/package. Right now we are expecting to have this up and running by the end of February. It’s the same problem for all the node based tools, including Frame Graph (the Edit button in the properties pane does nothing right now). @georgie
4 Likes
Thanks for the heads up ^^ I will wait for the proper release then, the new inspector is very good looking so far 
3 Likes
@CrashMaster launching all the node editors as well as other tools like gui editor is now supported in Inspector v2. Currently it is done through an Edit button in the properties pane though rather than directly on the entities in scene explorer. We may still add edit buttons in scene explorer as well.
1 Like
Inspector v2 is now the default in Sandbox and Playground!
Heads up everyone - starting with tomorrow’s build of Sandbox and Playground, Inspector v2 will be the default in Sandbox and Playground, and the “Try the New Inspector” buttons will no longer be present.
If you use Sandbox or Playground with a Babylon version of 8.40.0 or earlier (before the Inspector v2 umd bundle existed), it will load Inspector v1.
If you use Sandbox or Playground with a Babylon version of 8.40.1 or newer, it will load Inspector v2 by default.
We are making this switch now because we believe Inspector v2 is very close to feature parity with Inspector v1, and we are approaching the Babylon 9.0 release.
If you find any gaps or bugs, please do let us know! If you find a gap or bug and need to use Inspector v1, you can still do so by including the inspectorv1 query param in the url for either Sandbox or Playground (though you will need to reload the page when doing so).
5 Likes
Hey @ryantrem since the InspectorV2 is now default I’m discovering it.
I can’t find the export options, did I miss it or was it removed ? I mean the export to GLB options, where we would set several params such as “compress draco”, etc
1 Like
Currently all the features of the tools pane (like glb export) are setup as optional extensions (manually installed form the extensions dialog, which is accessed from the extensions button in the top right). We did this to keep the initial Inspector experience simple, but we are also having some discussion on the team right now about whether these should just be always enabled instead of optional extensions. The community feedback is also super helpful to make sure our solution is best aligned with expectations!
This will come back by default to prevent breaking back compat.
2 Likes
Sure 
Then here are my thoughts :
- I think for the online tools (Sandbox, Playground) as many things as possible should be enabled by default. These tools are temporary tools for testing, for example I don’t care about tree-shaking : Yes, the full BABYLON namespace is loaded, yes it’s heavy and most likely heavier than necessary in most cases, but at least everything works. Up to us to have precise three-shaked ES6 imports in our projects where size matters.
- For the core library, indeed it makes sense to let the user choose what’s being loaded ( for example in the
scene.debugLayer.show(config as IInspectorOptions)the interfaceIInspectorOptionscould be added some extra (imported and three-shaked) option such as GLB exporter, etc
4 Likes
Hi,
The UMD version doesn’t seem to work properly. The properties panel shows me this as soon as I select something
Something went wrong
An error occurred in this component. You can try again or continue using other parts of the inspector.
Try Again
Cannot read properties of undefined (reading ‘Atmosphere’)
In the console :
babylon.inspector-v2.bundle.js:2 TypeError: Cannot read properties of undefined (reading 'Atmosphere')
at Object.predicate (babylon.inspector-v2.bundle.js:2:464331)
at babylon.inspector-v2.bundle.js:2:137559
at Array.filter (<anonymous>)
at babylon.inspector-v2.bundle.js:2:137546
at Object.Ui [as useMemo] (babylon.inspector-v2.bundle.js:2:205160)
at t.useMemo (babylon.inspector-v2.bundle.js:2:779051)
at content (babylon.inspector-v2.bundle.js:2:137536)
at hi (babylon.inspector-v2.bundle.js:2:200784)
at zl (babylon.inspector-v2.bundle.js:2:214828)
at Bs (babylon.inspector-v2.bundle.js:2:260638)
I use it like this:
<script src="https://preview.babylonjs.com/inspector/babylon.inspector-v2.bundle.js"></script>
showInspectorBabylon() {
if (this.scene.debugLayer.isVisible()) {
this.scene.debugLayer.hide();
} else {
this.scene.debugLayer.show({
parentElement: document.getElementById("debugLayerHost")
});
this.scene.debugLayer.setAsActiveScene();
}
}
1 Like
Are you using the addons bundle? Currently Inspector v2 has a dependency on the addons bundle to be able to inspect things like Atmosphere from the addons bundle. The npm package has a peerDependency, so when you are bundling, it would naturally pull in the dependencies. But for umd, this won’t happen. It does seem like the Inspector v2 umd bundle should not require you to use the addons bundle, but rather should be able to gracefully ignore those things if the bundle isn’t loaded. But first can you confirm whether or not you use the addons bundle?