@wxt-dev/analytics 0.4.1 → 0.5.1

package/README.md

@@ -10,15 +10,19 @@ Report analytics events from your web extension extension.
 ## Install With WXT
 
 1. Install the NPM package:
+
    ```bash
    pnpm i @wxt-dev/analytics
    ```
+
 2. In your `wxt.config.ts`, add the WXT module:
+
    ```ts
    export default defineConfig({
      modules: ['@wxt-dev/analytics/module'],
    });
    ```
+
 3. In your `<srcDir>/app.config.ts`, add a provider:
 
    ```ts
@@ -49,9 +53,11 @@ Report analytics events from your web extension extension.
 ## Install Without WXT
 
 1. Install the NPM package:
+
    ```bash
    pnpm i @wxt-dev/analytics
    ```
+
 2. Create an `analytics` instance:
 
    ```ts
@@ -66,10 +72,12 @@ Report analytics events from your web extension extension.
    ```
 
 3. Import your analytics module in the background to initialize the message listener:
+
    ```ts
    // background.ts
    import './utils/analytics';
    ```
+
 4. Then use your `analytics` instance to report events:
 
    ```ts

package/dist/index.mjs

@@ -1,8 +1,9 @@
 import { UAParser } from 'ua-parser-js';
+import { browser } from '@wxt-dev/browser';
 
 const ANALYTICS_PORT = "@wxt-dev/analytics";
 function createAnalytics(config) {
-  if (typeof chrome === "undefined" || !chrome?.runtime?.id)
+  if (!browser?.runtime?.id)
     throw Error(
       "Cannot use WXT analytics in contexts without access to the browser.runtime APIs"
     );
@@ -22,13 +23,13 @@ function createBackgroundAnalytics(config) {
     {}
   );
   const enabled = config?.enabled ?? defineStorageItem("local:wxt-analytics:enabled", false);
-  const platformInfo = chrome.runtime.getPlatformInfo();
+  const platformInfo = browser.runtime.getPlatformInfo();
   const userAgent = UAParser();
   let userId = Promise.resolve(userIdStorage.getValue()).then(
     (id) => id ?? globalThis.crypto.randomUUID()
   );
   let userProperties = userPropertiesStorage.getValue();
-  const manifest = chrome.runtime.getManifest();
+  const manifest = browser.runtime.getManifest();
   const getBackgroundMeta = () => ({
     timestamp: Date.now(),
     // Don't track sessions for the background, it can be running
@@ -68,8 +69,7 @@ function createBackgroundAnalytics(config) {
         userPropertiesStorage.setValue?.(newUserProperties)
       ]);
       const event = await getBaseEvent(meta);
-      if (config?.debug)
-        console.debug("[@wxt-dev/analytics] identify", event);
+      if (config?.debug) console.debug("[@wxt-dev/analytics] identify", event);
       if (await enabled.getValue()) {
         await Promise.allSettled(
           providers.map((provider) => provider.identify(event))
@@ -90,8 +90,7 @@ function createBackgroundAnalytics(config) {
           title: meta?.title ?? globalThis.document?.title
         }
       };
-      if (config?.debug)
-        console.debug("[@wxt-dev/analytics] page", event);
+      if (config?.debug) console.debug("[@wxt-dev/analytics] page", event);
       if (await enabled.getValue()) {
         await Promise.allSettled(
           providers.map((provider) => provider.page(event))
@@ -108,8 +107,7 @@ function createBackgroundAnalytics(config) {
         ...baseEvent,
         event: { name: eventName, properties: eventProperties }
       };
-      if (config?.debug)
-        console.debug("[@wxt-dev/analytics] track", event);
+      if (config?.debug) console.debug("[@wxt-dev/analytics] track", event);
       if (await enabled.getValue()) {
         await Promise.allSettled(
           providers.map((provider) => provider.track(event))
@@ -129,7 +127,7 @@ function createBackgroundAnalytics(config) {
     }
   };
   const providers = config?.providers?.map((provider) => provider(analytics, config)) ?? [];
-  chrome.runtime.onConnect.addListener((port) => {
+  browser.runtime.onConnect.addListener((port) => {
     if (port.name === ANALYTICS_PORT) {
       port.onMessage.addListener(({ fn, args }) => {
         void analytics[fn]?.(...args);
@@ -139,7 +137,7 @@ function createBackgroundAnalytics(config) {
   return analytics;
 }
 function createFrontendAnalytics() {
-  const port = chrome.runtime.connect({ name: ANALYTICS_PORT });
+  const port = browser.runtime.connect({ name: ANALYTICS_PORT });
   const sessionId = Date.now();
   const getFrontendMetadata = () => ({
     sessionId,
@@ -182,8 +180,8 @@ function createFrontendAnalytics() {
 }
 function defineStorageItem(key, defaultValue) {
   return {
-    getValue: async () => (await chrome.storage.local.get(key))[key] ?? defaultValue,
-    setValue: (newValue) => chrome.storage.local.set({ [key]: newValue })
+    getValue: async () => (await browser.storage.local.get(key))[key] ?? defaultValue,
+    setValue: (newValue) => browser.storage.local.set({ [key]: newValue })
   };
 }
 const INTERACTIVE_TAGS = /* @__PURE__ */ new Set([

package/dist/module.d.mts

@@ -1,7 +1,7 @@
 import * as wxt from 'wxt';
 import { AnalyticsConfig } from './types.mjs';
 
-declare module 'wxt/sandbox' {
+declare module 'wxt/utils/define-app-config' {
     interface WxtAppConfig {
         analytics: AnalyticsConfig;
     }

package/dist/module.d.ts

@@ -1,7 +1,7 @@
 import * as wxt from 'wxt';
 import { AnalyticsConfig } from './types.js';
 
-declare module 'wxt/sandbox' {
+declare module 'wxt/utils/define-app-config' {
     interface WxtAppConfig {
         analytics: AnalyticsConfig;
     }

package/dist/module.mjs

@@ -1,5 +1,5 @@
 import 'wxt';
-import 'wxt/sandbox';
+import 'wxt/utils/define-app-config';
 import { defineWxtModule, addAlias, addWxtPlugin, addViteConfig } from 'wxt/modules';
 import { resolve } from 'node:path';
 
@@ -12,14 +12,14 @@ const index = defineWxtModule({
     const clientModuleId = "@wxt-dev/analytics" ;
     const pluginModuleId = "@wxt-dev/analytics/background-plugin" ;
     wxt.hook("build:manifestGenerated", (_, manifest) => {
-      manifest.permissions ?? (manifest.permissions = []);
+      manifest.permissions ??= [];
       if (!manifest.permissions.includes("storage")) {
         manifest.permissions.push("storage");
       }
     });
     const wxtAnalyticsCode = [
       `import { createAnalytics } from '${clientModuleId }';`,
-      `import { useAppConfig } from 'wxt/client';`,
+      `import { useAppConfig } from '#imports';`,
       ``,
       `export const analytics = createAnalytics(useAppConfig().analytics);`,
       ``

package/dist/providers/google-analytics-4.d.mts

@@ -6,4 +6,5 @@ interface GoogleAnalytics4ProviderOptions {
 }
 declare const googleAnalytics4: (options: GoogleAnalytics4ProviderOptions) => AnalyticsProvider;
 
-export { type GoogleAnalytics4ProviderOptions, googleAnalytics4 };
+export { googleAnalytics4 };
+export type { GoogleAnalytics4ProviderOptions };

package/dist/providers/google-analytics-4.d.ts

@@ -6,4 +6,5 @@ interface GoogleAnalytics4ProviderOptions {
 }
 declare const googleAnalytics4: (options: GoogleAnalytics4ProviderOptions) => AnalyticsProvider;
 
-export { type GoogleAnalytics4ProviderOptions, googleAnalytics4 };
+export { googleAnalytics4 };
+export type { GoogleAnalytics4ProviderOptions };

package/dist/providers/google-analytics-4.mjs

@@ -1,5 +1,6 @@
 import { defineAnalyticsProvider } from '../index.mjs';
 import 'ua-parser-js';
+import '@wxt-dev/browser';
 
 const DEFAULT_ENGAGEMENT_TIME_IN_MSEC = 100;
 const googleAnalytics4 = defineAnalyticsProvider(
@@ -33,6 +34,7 @@ const googleAnalytics4 = defineAnalyticsProvider(
             ad_personalization: "DENIED"
           },
           user_properties: mappedUserProperties,
+          user_agent: navigator.userAgent,
           events: [
             {
               name: eventName,

package/dist/providers/umami.d.mts

@@ -7,4 +7,5 @@ interface UmamiProviderOptions {
 }
 declare const umami: (options: UmamiProviderOptions) => AnalyticsProvider;
 
-export { type UmamiProviderOptions, umami };
+export { umami };
+export type { UmamiProviderOptions };

package/dist/providers/umami.d.ts

@@ -7,4 +7,5 @@ interface UmamiProviderOptions {
 }
 declare const umami: (options: UmamiProviderOptions) => AnalyticsProvider;
 
-export { type UmamiProviderOptions, umami };
+export { umami };
+export type { UmamiProviderOptions };

package/dist/providers/umami.mjs

@@ -1,5 +1,6 @@
 import { defineAnalyticsProvider } from '../index.mjs';
 import 'ua-parser-js';
+import '@wxt-dev/browser';
 
 const umami = defineAnalyticsProvider(
   (_, config, options) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wxt-dev/analytics",
-  "version": "0.4.1",
+  "version": "0.5.1",
   "description": "Add analytics to your web extension",
   "repository": {
     "type": "git",
@@ -40,19 +40,19 @@
     "dist"
   ],
   "peerDependencies": {
-    "wxt": ">=0.19.23"
+    "wxt": ">=0.20.0"
   },
   "devDependencies": {
-    "@aklinker1/check": "^1.4.5",
-    "@types/chrome": "^0.0.268",
+    "@aklinker1/check": "^2.1.0",
     "@types/ua-parser-js": "^0.7.39",
-    "publint": "^0.2.12",
-    "typescript": "^5.6.3",
-    "unbuild": "^2.0.0",
-    "wxt": "0.19.23"
+    "publint": "^0.3.12",
+    "typescript": "^5.9.2",
+    "unbuild": "^3.6.1",
+    "wxt": "0.20.8"
   },
   "dependencies": {
-    "ua-parser-js": "^1.0.38"
+    "ua-parser-js": "^1.0.40",
+    "@wxt-dev/browser": "^0.1.4"
   },
   "scripts": {
     "dev": "buildc --deps-only -- wxt",