Skip to main content

Portal Browser

Daintree's two browser surfaces: the Portal sidebar for AI chat, and Browser panels with URL history, host approval, hard reload, console capture, and DevTools

Updated
Reviewed

Overview

Daintree has two browser surfaces. The Portal is a sidebar that slides in from the right, used for chatting with web AI clients like Claude, ChatGPT, and Gemini. Browser panels are standalone panes you can place anywhere in the workspace grid, built for viewing local web servers with developer tooling: console capture, find-in-page, and DevTools.

Portal Sidebar

Opening the Portal

Toggle the Portal with Cmd+\, or click the Portal Toggle button in the toolbar. The panel slides in from the right side of the window.

AI Chat Launchpad

Open the Portal with no active tabs and the launchpad appears, with buttons for three built-in AI services: Claude, ChatGPT, and Gemini. Click a button to open that service in a new tab.

The three defaults are available without any setup. Toggle which ones appear, and edit their URLs, in Settings > Portal > Default Links. Any custom links you add show up in the launchpad too.

Tip
Pair the Portal with CopyTree for a fast feedback loop. Copy your codebase context to the clipboard, then paste it into an AI chat in the Portal. Web AI gets the full project context, and you never leave Daintree.

Tab Management

Open multiple AI chat sessions in tabs. Each tab keeps its own conversation and navigation history. The Portal detects AI services by URL, so the tab title and icon update to match whichever service you're chatting with.

The + button opens a new tab. If you've set a Default New Tab Agent, it navigates there directly. Otherwise the launchpad appears so you can pick a service. Three tabs stay live at once. Open a fourth and the least recently used tab is evicted. It reloads from scratch when you return to it, so any unsaved in-page state (typed input, scroll position) is lost.

Resizing the Portal

Drag the left edge of the Portal to resize it. The panel ranges from 320px to 1200px wide, and defaults to 480px.

To restore the 480px default, right-click the Portal and choose Reset Width. You can also resize from the keyboard: focus the resize handle and press ArrowLeft to widen the panel or ArrowRight to narrow it, in 10px steps.

Find in Page

Press Cmd+F (Ctrl+F on Windows and Linux) to search for text within the current page. A floating find bar appears in the top-right corner with a text input, a match count, and navigation buttons. Press Enter or Cmd+G (Ctrl+G on Windows/Linux) for the next match, Shift+Enter or Cmd+Shift+G (Ctrl+Shift+G on Windows/Linux) for the previous match, and Escape to close. This behaves the same as find-in-page in Dev Preview.

External Links

Links with target="_blank", and window.open() calls from pages inside the Portal, open in your system's default browser. Only http: and https: URLs are opened externally.

Configuration

Portal behavior is configured in Settings > Portal:

  • Default New Tab Agent: which service opens when you press +. Set it to "None" to show the launchpad instead, or enter a custom URL.
  • Default Links: toggle which built-in links (Claude, ChatGPT, Gemini) appear in the launchpad and tab bar. You can also edit their target URLs.
  • Custom Links: add your own links to AI services or documentation. Each link has a name and a URL, and you can toggle its visibility.

Browser Panels

Browser panels are standalone panes that live in your main workspace grid. Open one from the panel palette (Cmd+N, then select Browser) and place it in any grid slot. They're built for local development servers, with console capture, find-in-page, screenshots, and DevTools built in. The same browser engine powers the Dev Preview panel, which shares the hard-reload mechanism described below. Dev Preview is loopback-only, so the host approval prompt covered here applies to Browser panels only.

Toolbar Controls

The browser toolbar runs across the top of each panel:

  • Back / Forward / Reload: standard navigation buttons. Shift+click Reload for a hard reload that bypasses the HTTP cache; see Hard Reload below.
  • Zoom In / Zoom Out: adjust the page zoom level.
  • Address bar: type a URL to navigate. A history dropdown surfaces past visits with favicons, per-row deletion, and keyboard navigation; see Address Bar and History below.
  • Copy URL: copies the current page URL to the clipboard.
  • Screenshot (camera icon): captures the visible viewport as a PNG and copies it to the clipboard.
  • Console (terminal icon): toggles the console capture panel below the webview.
  • DevTools (code icon): opens Electron DevTools for the webview in a separate window.
  • Open in Browser: opens the current URL in your system's default browser.
Note
The address bar takes localhost and local-network URLs only. You can't type an external URL directly into it. Cross-origin navigation still works when in-page links or redirects lead to external domains, for example an OAuth flow through an external auth provider.

Address Bar and History

Focus the address bar, by clicking it or tabbing to it, and a dropdown opens with up to five suggestions. They're ranked by frecency: how often and how recently you visited each page. Each row shows the page favicon on the left, then the title and URL.

Move through suggestions with ArrowDown / ArrowUp, press Enter to navigate to the highlighted entry, and Escape to dismiss the dropdown. As you type, suggestions filter by substring match against the URL or title.

Hover any row and a small × button fades in at the right edge to remove that entry. From the keyboard, press Shift+Delete or Shift+Backspace to remove the highlighted row. A live region announces "Removed {url} from history" after deletion, so screen-reader users get confirmation.

Favicons come from each page's page-favicon-updated events as you navigate. They're debounced and persisted alongside the history entry. Inline data: URI favicons larger than 8 KiB are dropped to keep the history store small, and those rows fall back to a Globe icon. The unfocused URL bar shows only a scheme indicator, a Lock for https or a Globe for http, not a live page favicon. Favicons appear in the dropdown only.

The Portal sidebar has neither this dropdown nor live favicons. Portal tabs use static service icons (Claude, ChatGPT, Gemini) keyed off the URL instead. Dev Preview has its own frecency-based URL suggestions, but the favicons and per-row deletion are Browser-panel-only.

Tip
URLs that look sensitive are never saved to history. OAuth callbacks carrying code and state, signed S3/GCS/Azure URLs, URLs with embedded basic-auth credentials, and URLs with token fragments are sanitized out before the entry is persisted, so they don't reappear in the dropdown.

Hard Reload

Shift+click the Reload button for a hard reload. Chromium reloads the page and bypasses the HTTP cache entirely, which is what you want when an asset is stale or a service worker is misbehaving. The Reload button's tooltip spells this out: "Reload (Shift+click for hard reload)".

There's no dedicated keyboard shortcut for hard reload. If you'd rather invoke it from the keyboard, the same action lives in the action palette as Hard Reload Browser (action id browser.hardReload).

Dev Preview uses the same underlying IPC, but the Shift+click affordance lives on the Browser panel toolbar in this release.

Host Approval

Browser panels prompt before loading a hostname that isn't local. When you navigate somewhere new, an amber banner slides in across the top of the panel: "Allow browser panel to load {hostname}?" with an Allow button and a × dismiss button. Click Allow and the navigation proceeds. The hostname is saved to the project's allowed hosts, so you won't be prompted again within that project.

Some hosts are implicitly allowed and never trigger the prompt:

  • localhost, 127.0.0.1, ::1
  • Any subdomain of .localhost, .test, .local, or .internal
  • All IPs in the loopback, RFC 1918 private, link-local, or IPv6 unique-local ranges (so 10.x, 172.16172.31.x, 192.168.x, 169.254.x, fc00::/7)
  • 0.0.0.0 is silently rewritten to localhost before any check runs

The prompt fires for explicit public hostnames and IPs, bare hostnames without a dot, and host.docker.internal. That last one is a hostname-string match, not an IP resolution, so even though it usually maps to your loopback interface it still goes through approval the first time.

Note
Restored URLs from session state skip the prompt. If a Browser panel was pointing at a host before you quit, reopening Daintree puts you straight back on that page. The host is either implicitly allowed (loopback, RFC 1918, and the rest) or was already approved for this project and recorded in browserAllowedHosts, so there's nothing left to ask about.

Approved hostnames are stored in your project's local-scoped settings under browserAllowedHosts. They're never written to .daintree/settings.json, so they don't get committed to git or shared with the team. The file lives outside the project directory, in Daintree's per-user data folder:

~/Library/Application Support/Daintree/projects/{sha256-hash}/settings.json

Find in Page

Press Cmd+F (macOS) or Ctrl+F (Windows/Linux) to open the find bar. It appears at the top-right of the webview with a search input and a match counter showing something like "3 / 12". The search is live and matches as you type.

Move between matches with Enter or Cmd+G (Ctrl+G on Windows/Linux) for the next match, and Shift+Enter or Cmd+Shift+G (Ctrl+Shift+G on Windows/Linux) for the previous match. Press Escape to close the find bar and clear the highlights. The shortcut works even when the webview itself has keyboard focus.

Console Capture

Click the terminal icon in the toolbar to open the console capture panel below the webview. It intercepts console.log, console.warn, console.error, and console.info calls from the page through the Chrome DevTools Protocol, so you get structured output: objects, stack traces, and group nesting.

Filter messages by level with the All, Errors, Warn, and Log buttons. The Errors and Warn buttons show badge counts, so you can spot issues at a glance. A text filter narrows results further by matching against the message content.

Each message shows a timestamp in HH:MM:SS.mmm format. The panel auto-scrolls to the bottom as new messages arrive. Scroll up to review earlier output and auto-scroll pauses, with a button to jump back to the bottom. When you navigate to a new page, messages from the previous page are dimmed but not removed. Click the clear button to wipe all messages.

Note
Console messages are held in a 500-message buffer per panel and are not persisted across app restarts. For persistent logging, use your application's own log files.

Cross-Origin Navigation

Browser panels can follow http: and https: links that navigate to external domains. This matters for OAuth and OIDC flows, where a localhost app redirects through an external identity provider and back again.

If a navigation is blocked, for example a non-HTTP scheme, a banner appears at the top of the panel with the blocked URL and an Open in External Browser button. The banner auto-dismisses after 10 seconds, or clears on the next successful navigation.

JavaScript Dialogs

When a page calls alert(), confirm(), or prompt(), Daintree renders the dialog as a styled in-app modal rather than an OS-level dialog. This keeps focus inside the panel and avoids blocking the main process.

  • Alert: shows the message with an OK button. Escape also dismisses it.
  • Confirm: shows Cancel and OK buttons. Enter confirms, Escape cancels.
  • Prompt: adds a pre-filled text input alongside Cancel and OK. Enter confirms, Escape cancels.

If several dialogs arrive at once, they're queued and shown one at a time.

External Links

Links with target="_blank", and window.open() calls from browser panels, open in your system's default browser, the same as in the Portal sidebar. Only http: and https: URLs are opened externally.