---
title: "Chrome Browser Extension Setup"
description: "Stream privacy-aware browser interaction context into Fraime.it to power Smart Zoom and other context-aware edits."
canonical_url: "/docs/browser-extension-setup"
markdown_url: "/docs/browser-extension-setup.md"
---

# Chrome Browser Extension Setup

Stream privacy-aware browser interaction context into Fraime.it to power Smart Zoom and other context-aware edits.

Canonical URL: /docs/browser-extension-setup
Markdown URL: /docs/browser-extension-setup.md

The Fraime.it Chrome extension streams privacy-aware browser interaction telemetry from Chrome into the local macOS app. When you record a browser-based demo, this context helps Fraime.it understand what you clicked, focused, selected, and scrolled to, not just the pixels on screen.

You can record without the extension. Install it when the video is about a web app and you want Fraime.it to place Smart Zoom moves, highlights, and markers based on what you were actually doing in the browser.

## What the extension sends

The extension is a Manifest V3 extension that observes browser interactions and forwards structured `browserEvent` payloads to the app. Each event can include:

- An `eventType` such as `click`, `focus`, `input`, `selection`, `routeChange`, `scrollStop`, `modalOpen`, or `pageReady`.
- The `page` origin, path, and a safe title.
- The `viewport` size, scroll offsets, and device pixel ratio.
- The interacting `element` tag, role, normalized and visible bounds, a safe label hint, coarse state, and privacy flags.
- A normalized `selection` bounds and line-count estimate when applicable.
- An `interactionWeight` used to rank importance for downstream features.

It sends structured metadata with per-event privacy flags. It intentionally does not send full page contents.

## Why it helps

Browser telemetry feeds Smart Zoom first: clicks, selections, input focus, and route changes give Fraime.it the focus region and an appropriate zoom scale, while generic scrolling stays gently framed. The same stream can also feed highlights, smart cuts, redaction hints, markers, cursor behavior, and caption context.

## Connection model

The extension connects to the Fraime.it app over a local bridge on `127.0.0.1:49153` and posts events to `http://127.0.0.1:49153/browser-events`. Keep the app running while recording if you want browser context in the project.

The connection is local to your Mac. If the app is not running, the extension cannot stream context into the recording. The toolbar icon appears grey while the bridge is unavailable and switches to the colored Fraime.it icon once browser telemetry is connected.

## Install flow

[Install Fraime.it Browser Telemetry from the Chrome Web Store](https://chromewebstore.google.com/detail/fraimeit-browser-telemetr/ncnlpknpacieglbacpbjmolefaieohec). The Fraime.it recording window can open the store listing and use bridge events to show installed and connected status.

For development or manual installs, load the extension unpacked:

1. Open `chrome://extensions`.
2. Enable Developer Mode.
3. Choose "Load unpacked".
4. Select the `browser-extension/chrome` folder.
5. Start Fraime.it so the local browser telemetry bridge listens on `127.0.0.1:49153`.

> Screenshot placeholder: Browser extension connection
> Show the Chrome extension toolbar icon switching to connected, and sample browser interaction context appearing in the Fraime.it timeline.

## Confirm it is working

Record a short test while clicking and selecting in a web app. Open the project in Fraime.it and check whether browser context appears in the timeline, and whether Smart Zoom suggests zooms around the moments you interacted with.

## Privacy notes

Because the extension sends structured interaction metadata with privacy flags rather than full page contents, Fraime.it learns where and how you interacted, not the complete text of every page. The screen recording itself can still contain visible content, terminals, secrets, or private data, so review redactions before export.

## Troubleshooting

If browser context does not appear, make sure the app is open, the extension is enabled, Chrome can reach `127.0.0.1:49153`, and no other process is blocking the configured port. If the toolbar icon stays grey, the bridge is not connected, confirm Fraime.it is running and recording.

## Sitemap

See the agent-readable sitemap at [/sitemap.md](/sitemap.md).