feat(hub): add configurable iframe navigation controls - #318
Conversation
|
@dvcolomban is attempting to deploy a commit to the NuxtLabs Team on Vercel. A member of the Team first needs to authorize it. |
There was a problem hiding this comment.
Pull request overview
Adds per-iframe dock-entry configuration for always showing the iframe address bar and for exposing basic navigation recovery controls (Back, Reload, Open externally) without changing existing defaults unless explicitly opted in. This aligns with @devframes/hub’s dock-entry model and updates @devframes/hub-ui’s iframe view + docs accordingly.
Changes:
- Extend
DevframeViewIframewithshowAddressBarandcontrolsoptions and update the API snapshot. - Update
hub-ui’s iframe view to conditionally render Back/Reload/Open externally controls and adjust light-theme toolbar/loading placeholder styling. - Document the new iframe entry options in the Hub API reference.
Reviewed changes
Copilot reviewed 4 out of 5 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| tests/snapshots/tsnapi/@devframes/hub/index.snapshot.d.ts | Updates public type snapshot to include the new iframe options. |
| packages/hub/src/types/docks.ts | Adds showAddressBar and controls to DevframeViewIframe typings and docs. |
| packages/hub-ui/src/client/components/views/ViewIframeLoading.vue | Adjusts loading placeholder background behavior to inherit the viewer background. |
| packages/hub-ui/src/client/components/views/ViewIframe.vue | Implements configurable address bar visibility and optional navigation controls, plus toolbar styling. |
| docs/content/8.references/6.hub-api.md | Documents the new iframe dock-entry options for hub consumers. |
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 4 out of 5 changed files in this pull request and generated no new comments.
Suppressed comments (1)
Previously missed (1) — in code that hasn't changed since the last review.
packages/hub/src/types/docks.ts:215
- The
openExternalJSDoc says it “overrides the built-in action”, but this option actually controls the visibility of the “Open externally” control (the action itself is not overridden). Adjust the wording to match the behavior to avoid confusion for API consumers.
reload?: boolean
/** Override the built-in action that opens the displayed HTTP(S) URL in a new tab. */
openExternal?: boolean
Background (Why)
Iframe dock entries currently rely on global address-bar visibility and same-origin navigation detection. Consumers embedding cross-origin tools need a small, generic way to expose recovery controls when an iframe cannot complete a flow in place, while existing dock behavior must remain unchanged by default.
Changes (What)
Iframe entries can now force the existing address bar with
showAddressBarand opt into Back, Reload, and Open externally throughcontrols. Omitted Back and Reload values preserve the same-origin defaults, while Open externally remains disabled unless explicitly enabled. Reload restores the configured iframe URL; Open externally accepts HTTP(S) URLs, removes the remote-auth descriptor, and opens withnoopener,noreferrer.The existing iframe reference and mounted event remain the integration points. This change adds no navigation-reporting state, events, RPC, authentication handling, or custom action framework. The toolbar now uses the semantic foreground color in light theme, and the loading view inherits the viewer background instead of layering another translucent fill.
Note for maintainers
The cross-origin playground fixture exposed an existing cleanup issue in
frame-location. The location watcher subscribes to a same-origin iframe window, but after that iframe navigates cross-origin, its load or teardown path invokes the captured disposer and attempts to callremoveEventListeneron the now-cross-origin window. The browser blocks that access and reports a non-fatalSecurityError.This behavior predates the configurable controls and fixing it requires a separate change to the frame-location listener lifecycle, so it is deliberately outside this PR's configuration and styling scope. I can follow up with that fix separately if useful.
Verification (Testing)
The complete repository test run passed with 121 files, 1,327 passing tests, and 9 skipped tests. Type checking, lint, unused-code checks, and the full build also passed. I manually exercised Back, Reload, and Open externally in the
@devframes/hub-uiplayground with a temporary generichttps://example.com/iframe fixture; the fixture is not included in this PR.Light theme
Dark theme