Skip to content

Inspector: CLI integration in Playground#18271

Draft
ryantrem wants to merge 13 commits intoBabylonJS:masterfrom
ryantrem:inspector-v2/playground-cli
Draft

Inspector: CLI integration in Playground#18271
ryantrem wants to merge 13 commits intoBabylonJS:masterfrom
ryantrem:inspector-v2/playground-cli

Conversation

@ryantrem
Copy link
Copy Markdown
Member

@ryantrem ryantrem commented Apr 9, 2026

Draft for now and probably will wait to talk with @RaananW about some Playground mcp experiments he was doing.

The main goal of this PR is to integrate the Inspector CLI into Playground and add Playground specific commands. Some pre-requisite changes were needed for this:

  • Inspectable tokens isDisposed returns true if the underlying container is disposed (e.g. because the scene was disposed).
  • Command arguments can be specified as file inputs, in which case the argument value is treated as a file path instead of a string literal.
  • Session names can be dynamic (e.g. they can change over time).
  • Playground puts the snippet id in the document.title (which is a small but nice improvement regardless, since it makes it easier to distinguish between Playground tabs in the browser). (document.title is the default session name for the Inspector CLI).
  • Playground Monaco state is better synchronized with Playground's globalState, and a bit more detail is exposed through globalState.
  • Allow globalState to save the current PG to a snippet without opening a dialog (e.g. name, description, and tags can be programmatically passed).

With these improvements in place, the actual changes for Inspector CLI integration in Playground are:

  • Call StartInspectable automatically (does not require opening Inspector).
  • Implement a bunch of Playground specific commands that are registered with the CLI service.
image

@ryantrem ryantrem requested a review from RaananW April 9, 2026 23:03
@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 9, 2026

Please make sure to label your PR with "bug", "new feature" or "breaking change" label(s).
To prevent this PR from going to the changelog marked it with the "skip changelog" label.

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 9, 2026

Snapshot stored with reference name:
refs/pull/18271/merge

Test environment:
https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18271/merge/index.html

To test a playground add it to the URL, for example:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/refs/pull/18271/merge/index.html#WGZLGJ#4600

Links to test your changes to core in the published versions of the Babylon tools (does not contain changes you made to the tools themselves):

https://playground.babylonjs.com/?snapshot=refs/pull/18271/merge
https://sandbox.babylonjs.com/?snapshot=refs/pull/18271/merge
https://gui.babylonjs.com/?snapshot=refs/pull/18271/merge
https://nme.babylonjs.com/?snapshot=refs/pull/18271/merge

To test the snapshot in the playground with a playground ID add it after the snapshot query string:

https://playground.babylonjs.com/?snapshot=refs/pull/18271/merge#BCU1XR#0

If you made changes to the sandbox or playground in this PR, additional comments will be generated soon containing links to the dev versions of those tools.

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 9, 2026

You have changed file(s) that made possible changes to the sandbox.
You can test the sandbox snapshot here:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/SANDBOX/refs/pull/18271/merge/

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 9, 2026

You have made possible changes to the playground.
You can test the snapshot here:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18271/merge/

The snapshot playground with the CDN snapshot (only when available):

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18271/merge/?snapshot=refs/pull/18271/merge

Note that neither Babylon scenes nor textures are uploaded to the snapshot directory, so some playgrounds won't work correctly.

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 9, 2026

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 9, 2026

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 10, 2026

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Integrates Inspector v2 CLI support into the Babylon.js Playground by auto-starting the inspectable bridge, adding Playground-specific CLI commands, and enhancing the CLI/bridge protocol to support dynamic session naming and file-backed command arguments.

Changes:

  • Add a Playground CLI command service (file ops, run, save, diagnostics) and start Inspectable automatically when Inspector v2 is present.
  • Extend Inspector CLI/bridge protocol to support getInfo (dynamic session names) and file-typed command arguments (CLI reads file contents).
  • Improve Playground state synchronization (Monaco ↔ GlobalState, snippet title in document.title, and programmatic save options).

Reviewed changes

Copilot reviewed 14 out of 14 changed files in this pull request and generated 4 comments.

Show a summary per file
File Description
packages/tools/playground/src/tools/saveManager.ts Adds save options payload support to bypass the metadata dialog.
packages/tools/playground/src/tools/playgroundCommandService.ts New Playground-specific CLI commands registered into Inspector CLI registry.
packages/tools/playground/src/tools/monaco/monacoManager.ts Sync Monaco models with globalState.files and expose diagnostics via markers.
packages/tools/playground/src/playground.tsx Syncs document.title with the URL hash (snippet id/revision).
packages/tools/playground/src/globalState.ts Adds ISaveOptions, IDiagnosticInfo, and updates observable typings.
packages/tools/playground/src/components/rendererComponent.tsx Auto-starts Inspectable bridge (CLI) and registers Playground command service.
packages/tools/playground/src/components/editor/monacoComponent.tsx Ensures editor switches Monaco model when the active file changes.
packages/dev/inspector-v2/test/unit/cli/bridge.test.ts Updates bridge tests for getInfo and dynamic name behavior.
packages/dev/inspector-v2/src/services/cli/inspectableCommandRegistry.ts Adds arg type to support file-backed arguments.
packages/dev/inspector-v2/src/services/cli/inspectableBridgeService.ts Implements getInfo handling in the browser-side bridge service.
packages/dev/inspector-v2/src/inspectable.ts Improves InspectableToken.isDisposed to reflect underlying container disposal.
packages/dev/inspector-v2/src/cli/protocol.ts Adds GetInfoRequest/InfoResponse and arg type to protocol types.
packages/dev/inspector-v2/src/cli/cli.ts Implements file arg resolution by reading content from disk before exec.
packages/dev/inspector-v2/src/cli/bridge.ts Queries sessions via getInfo to return up-to-date session names.

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 10, 2026

You have changed file(s) that made possible changes to the sandbox.
You can test the sandbox snapshot here:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/SANDBOX/refs/pull/18271/merge/

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 10, 2026

You have made possible changes to the playground.
You can test the snapshot here:

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18271/merge/

The snapshot playground with the CDN snapshot (only when available):

https://snapshots-cvgtc2eugrd3cgfd.z01.azurefd.net/PLAYGROUND/refs/pull/18271/merge/?snapshot=refs/pull/18271/merge

Note that neither Babylon scenes nor textures are uploaded to the snapshot directory, so some playgrounds won't work correctly.

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 10, 2026

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 10, 2026

@bjsplat
Copy link
Copy Markdown
Collaborator

bjsplat commented Apr 10, 2026

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants