Chrome Extension

The Viberglass Chrome extension lets you capture bugs directly from any webpage. When you install the extension and click its icon, Viberglass automatically collects console errors, network failures, and browser environment details. You can then open a ticket from the extensions with everything needed for a clanker to reproduce and fix the issue.

Signing in

Click the Viberglass icon in your toolbar. If you are not signed in, click Sign in to authenticate with your Viberglass workspace. Authentication is stored in Chrome's extension storage and persists across sessions.

Capturing a bug

Click the Viberglass icon to open the capture popup. Viberglass automatically collects context from your active tab:

• Console errors — captured from console.error and console.warn calls, plus unhandled JavaScript exceptions and rejected promises.
• Network failures — failed resource loads detected via the Performance API (HTTP 400+ responses).
• Page metadata — URL, page title, browser name and version, OS, screen resolution, viewport dimensions, pixel ratio, user agent, language, and network status.

Screenshot

The extension allows capturing screenshots of the full tab, an area of the viewport or individual elements that can be added as context to the created ticket. The screenshot appears in the preview panel and can be annotated with text, arrows, and shapes.

Area selection

Click Select Area to enter area selection mode. A crosshair overlay appears on the page. Click and drag to draw a rectangle around the region you want to capture. Release the mouse to confirm — the selected region is saved as your screenshot.

Element selection

Click Select Element to enter element selection mode. Hover over the page to highlight elements; click any element to capture it as your screenshot.

Capturing full Tab

Click Tab button on the extension to capture the full tab as a screenshot. The content automatically scrolls the full length of the tab to capture the entire page.

Annotating screenshots

After capturing a screenshot, the preview panel shows annotation tools:

• Arrow — click and drag to draw an arrow pointing at something specific.
• Rectangle — click and drag to draw a rectangular highlight around an area.
• Text — click anywhere on the screenshot to place a text label.

Annotations are burned into the screenshot before the ticket is submitted.

Creating a ticket

Once you have captured a screenshot and reviewed the auto-collected context:

1. Verify the Title reflects the issue.
2. Add a Description with any additional context not captured automatically.
3. Choose the Project and Clanker that should handle the ticket.
4. Set the Starting Phase (Research, Planning, or Execution).
5. Click Create Ticket.

The ticket lands in the project's queue with the screenshot, console errors, network failures, and full browser metadata attached. You can assign ticket for automatic processing by enabling the Auto-run ... pipeline checkbox.

Installation

Installing the extension from Chrome web store

1. Open Chrome and navigate to the Viberglass Chrome extension page.
2. Click Add to Chrome to install the extension.

Installing the extension manually

1. Open Chrome and navigate to chrome://extensions.
2. Enable Developer mode (toggle in the top right corner).
3. Click Load unpacked and select the apps/chrome-extension directory from the Viberglass repository.
4. The Viberglass icon appears in your browser's toolbar.