Vintage nautical HarborClient badge with lighthouse and browser window labeled Live Pages

API work rarely stops at the request editor. OAuth consents, product docs, admin consoles, and SPA checks still live in a separate browser—copying tokens by hand, losing the environment context you already set up in HarborClient.

HarborClient Live pages fix that. Open an embedded browser tab next to your collections, configure it like a request (variables, headers, auth, scripts), save it in the sidebar, and drive the same tab from pre/post scripts or plugins with hc.webpage.

HarborClient Live Page tab open to headzoo.io with browser chrome beside the collections sidebar
Live Pages embed a real browser tab next to your collections for docs, OAuth, and SPA checks.

What is a live page?

A live page is a saved embedded browser session: a real webpage in HarborClient plus a settings sheet for how that page loads and behaves.

The tab itself has familiar browser chrome—back, forward, reload, home, an address bar, screenshot, and save—plus a gear that opens Live Page Settings.

HarborClient Live Page Settings sheet with General Variables Headers Authorization PreRequest PostRequest and Injection tabs
Configure Live Page Settings—variables, headers, auth, scripts, and injection—like a request.

There you configure:

  • General — display name for the sidebar
  • Variables — live-page-scoped {{variable}} values
  • Headers — request headers and User-Agent for chrome-driven navigations
  • Authorization — Basic, Bearer, and related auth for those navigations
  • PreRequest / PostRequest — hc.* sandbox scripts before navigate and after load
  • Injection — plain JavaScript at document start, DOM ready, or load complete

Create one with File → New Live Page, or from the Collections sidebar under Live pages → New live page.

Why use live pages?

  • Stay in context — keep docs, dashboards, and OAuth UIs beside the requests that depend on them
  • Reuse environments — point the address bar at https://{{host}}/… with the same variables you already use for APIs
  • Shape the load — attach headers, auth, and scripts so chrome-driven navigations behave like a prepared client
  • Automate the page — open, query, evaluate, inject, and screenshot from request scripts or plugins

Where they are saved

Live pages live in HarborClient’s local registry—not inside a collection folder and not as workspace-owned content. They appear under the sidebar Live pages section.

From an open tab, use Save live page (or Update live page when it’s already linked). The sidebar row menu supports Edit, Export, and Delete. Export writes a portable file with harborclientExport: "website"; bring one back with File → Import.

Drive pages with hc.webpage

hc.webpage opens or reuses an embedded browser tab and returns a handle. You can focus or close the tab, query the DOM, evaluate JavaScript, inject script or CSS, and capture a viewport or full-page screenshot.

From request scripts, enable Settings → General → Allow script webpage access first (off by default). Page load waits count against the script timeout. From plugins, declare the browser permission in the manifest—that gate is independent of the General setting. Screenshots also need script file access / filesystem:write as appropriate.

const page = await hc.webpage('https://example.com');
// const page = await hc.webpage('https://example.com', { reuse: false });
// const page = await hc.webpage(); // bind the active browser tab

await page.focus();
const heading = await page.dom.query('h1');
const title = await page.dom.evaluate('document.title');
await page.dom.injectScript(`document.body.dataset.harborProbe = '1';`);
const { path } = await page.screenshot('screenshot.png', {});
const closed = await page.close();

hc.webpage needs the desktop app open—it is not available in headless CLI script contexts without the webpage bridge.

Get started

Grab the latest HarborClient from harborclient.com or GitHub Releases, open File → New Live Page, save your first live page, and try a short hc.webpage script against it. Same harbor. Browser included.

Leave a Reply

Trending