@glasspane/sdk NPM

@glasspane/sdk

GlassPane is a plug-and-play frontend observability SDK that captures:

✅ JavaScript errors & unhandled promise rejections
✅ Performance metrics (TTFB, DOM load, etc.)
✅ Rage clicks & dead clicks
✅ SPA navigation & DOM interaction tracking
✅ Element visibility & scroll impressions
🔒 (Pro) Long tasks, heatmaps, replay support, and more

🚀 Installation

npm install @glasspane/sdk

🧠 Usage

🆓 Free Tier Example

import { init } from "@glasspane/sdk";

init({
  projectId: "glp_free_abc123",
});

You get automatic tracking of:

JavaScript errors
Performance metrics
SPA route changes
DOM click interactions

💳 Pro Tier Example

import { init } from "@glasspane/sdk";

init({
  projectId: "glp_pro_xyz789",
  licenseKey: "glp_live_12345-67890-ABCDE",
});

This unlocks additional advanced features:

Rage click detection
Dead click detection
Long task reporting
Scroll & element visibility impressions

📦 What It Tracks Automatically

Event Type	Free	Pro
`error`	✅	✅
`promiseRejection`	✅	✅
`performance`	✅	✅
`click`	✅	✅
`navigation`	✅	✅
`console` logs	✅	✅
`rageClick`	❌	✅
`deadClick`	❌	✅
`longTask`	❌	✅
`elementVisible`	❌	✅

🛠️ Custom Event Tracking

You can also manually send events:

import { track } from "@glasspane/sdk";

track({
  eventType: "custom",
  severity: "info",
  message: "User clicked upgrade",
  tags: { source: "pricing-page" },
});