Skip to content

feat(viewer): add configurable browser tab and toolbar title - #30

Open
ericgozzi wants to merge 4 commits into
feature/panel-dockingfrom
feature/browser-tab-title
Open

ericgozzi wants to merge 4 commits into
feature/panel-dockingfrom
feature/browser-tab-title

Conversation

@ericgozzi

@ericgozzi ericgozzi commented Sep 21, 2026 •

Copy link
Copy Markdown
Collaborator

This pull request adds support for customizing the viewer's toolbar title and browser tab title via a new title option. The title can now be set when creating a viewer instance, and it will update both the toolbar heading and the browser tab if provided. The changes also include an example HTML file demonstrating this feature and updates to the type definitions and context injection.

Customizable Viewer Title:

  • Added a new title option to CompasViewerOptions, allowing the browser tab and toolbar heading to be set at viewer creation.
  • Updated createViewer in src/library/index.ts to set document.title and provide the title for dependency injection if the option is present. [1] [2]

Toolbar Heading Update:

  • Introduced a new injection key toolbarTitleKey and a useToolbarTitle composable to retrieve the toolbar title, defaulting to "COMPAS ThreeJs". [1] [2]
  • Modified Toolbar.vue to use the injected toolbarTitle instead of the hardcoded heading. [1] [2] [3]

Examples and Usage:

  • Added examples/embedded_tab_title.html to demonstrate live updating of the viewer and tab title using the new option.
  • Updated src/main.ts to use the title option from the query string for standalone viewer demos.

Checklist

  • npm run check is green (formatting, lint, types, unit tests, both builds).
  • npm run test:browser and npm run test:package pass.

ericgozzi and others added 2 commits September 21, 2026 14:49
createViewer() now accepts a title option that sets document.title
when provided, and is also injected as the toolbar's heading text
(previously hardcoded "COMPAS ThreeJs") via a new toolbarTitleKey/
useToolbarTitle(), following the same provide/inject pattern as
toolbarPlacement/openbarPlacement/objectActionsPlacement.

The standalone websocket entry point (main.ts) reads the title from
a `title` URL query param, matching how ws_host/ws_port are already
passed through, so a Python App can set both per instance without
any frontend-side wiring.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Interactive demo of createViewer's title option: retyping it recreates the
viewer, showing the browser tab title and the toolbar heading (normally
hardcoded "COMPAS ThreeJs") both update. Verified in a real browser via
Playwright.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@ericgozzi
ericgozzi added this pull request to stack #29 September 21, 2026 13:05
@ericgozzi ericgozzi changed the title Feature/browser tab title feat(viewer): add configurable browser tab and toolbar title Sep 23, 2026

This branch has not been deployed

No deployments
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.

1 participant