Add Browser Context selection plugin

.gitignore

@@ -1,6 +1,7 @@
 .DS_Store
 node_modules/
 coverage/
+.otto/
 *.tgz
 !tooling/vendor/*.tgz
 

README.md

@@ -1,13 +1,23 @@
 # bb plugins
 
-Five bb plugins I use for product design work, kept together with the few build and repository tools they share. [![CI](https://github.com/brsbl/bb-plugins/actions/workflows/ci.yml/badge.svg)](https://github.com/brsbl/bb-plugins/actions/workflows/ci.yml)
+Six bb plugins I use for product design work, kept together with the few build and repository tools they share. [![CI](https://github.com/brsbl/bb-plugins/actions/workflows/ci.yml/badge.svg)](https://github.com/brsbl/bb-plugins/actions/workflows/ci.yml)
 
 [bb](https://getbb.app) is an agentic IDE for running coding agents across projects, threads, and environments. Its plugins can add UI, commands, skills, and server capabilities; this repository is where I build and maintain mine.
 
 ## Plugins
 
 Each plugin has its own workspace under `plugins/` and a short README with the story behind it.
 
+### Browser Context
+
+Selects and annotates an element or region in BB's Browser, then stages its screenshot and editable Markdown context in the current thread composer.
+
+![Browser Context capture preview in bb](plugins/browser-context/docs/screenshot.png)
+
+[Source](plugins/browser-context) · [README](plugins/browser-context/README.md)
+
+Install: `bb plugin install git:https://github.com/brsbl/bb-plugins.git@plugin/browser-context --yes`
+
 ### Design Doctrine
 
 Keeps the design lessons that come up again and again in reviews as reusable rules.

plugins/browser-context/README.md

@@ -0,0 +1,25 @@
+# Browser Context
+
+Select an element or drag over a region in BB's Browser, annotate the captured preview, then add it to the current thread composer.
+
+![Browser context staged in the current bb composer](docs/screenshot.png)
+
+## Install
+
+```bash
+bb plugin install git:https://github.com/brsbl/bb-plugins.git@plugin/browser-context --yes
+```
+
+## Use
+
+Open a Browser tab and click the Browser Context action to enter selection mode. Click an element or drag over a region, then add an optional comment. Choose **Add to prompt** to preserve the existing draft, attach the screenshot, and append the comment followed by a compact quoted summary of the page, target, DOM, relevant styles, and available framework or accessibility hints. The user request stays primary while supporting context can collapse naturally, and the standard Send or Queue flow remains in control.
+
+## Develop
+
+From the monorepo root:
+
+```bash
+npm ci
+npm run check --workspace=bb-plugin-browser-context
+bb plugin install "path:$PWD/plugins/browser-context" --yes
+```

plugins/browser-context/app-registration.test.ts

@@ -0,0 +1,22 @@
+// @vitest-environment jsdom
+
+import { installTestPluginRuntime } from "@bb/plugin-sdk/testing/app";
+import { describe, expect, it, vi } from "vitest";
+
+describe("Browser Context registration", () => {
+  it("registers on current hosts and remains inert on older hosts", async () => {
+    installTestPluginRuntime();
+    const { registerBrowserContextApp } = await import("./app.js");
+    const register = vi.fn();
+
+    registerBrowserContextApp({ experimental_browserAction: register });
+    expect(register).toHaveBeenCalledWith(
+      expect.objectContaining({
+        id: "capture",
+        title: "Select page context",
+        component: expect.any(Function),
+      }),
+    );
+    expect(() => registerBrowserContextApp({})).not.toThrow();
+  });
+});