fix(matomo): broken event tracking

Fixes #322

Author: harlan-zw

playground/pages/third-parties/matomo-analytics/nuxt-scripts.vue

@@ -7,22 +7,55 @@ useHead({
 
 // composables return the underlying api as a proxy object and the script state
 const { status, proxy } = useScriptMatomoAnalytics({
-  cloudId: 'nuxt.matomo.cloud',
+  matomoUrl: 'https://nuxt.matomo.cloud/',
   siteId: '1',
   scriptOptions: {
     trigger: 'onNuxtReady',
   },
 })
 
-// Use proxy to track page view
+// Test the issue: Use proxy to track events and goals
+// Note: setTrackerUrl and setSiteId are automatically set by the registry based on matomoUrl and siteId options
 proxy._paq.push(['trackPageView'])
+
+// Test custom events and goals that were not working in the original issue
+function trackCustomEvent() {
+  proxy._paq.push(['trackEvent', 'Test', 'Button Click', 'Proxy Test'])
+}
+
+function trackGoal() {
+  proxy._paq.push(['trackGoal', 1])
+}
+
+function testDirectPaq() {
+  // Test direct window._paq usage for comparison
+  if (window._paq) {
+    window._paq.push(['trackEvent', 'Test', 'Button Click', 'Direct Test'])
+  }
+}
 </script>
 
 <template>
   <div>
+    <h1>Matomo Analytics Test</h1>
     <ClientOnly>
       <div>
-        status: {{ status }}
+        <p>Script status: {{ status }}</p>
+
+        <div style="margin: 20px 0;">
+          <UButton @click="trackCustomEvent" style="margin-right: 10px; padding: 10px;">
+            Track Custom Event (proxy._paq)
+          </UButton>
+          <UButton @click="trackGoal" style="padding: 10px;">
+            Track Goal (proxy._paq)
+          </UButton>
+        </div>
+
+        <div style="margin: 20px 0;">
+          <UButton @click="testDirectPaq" style="margin-right: 10px; padding: 10px;">
+            Track Event (direct window._paq)
+          </UButton>
+        </div>
       </div>
     </ClientOnly>
   </div>

src/runtime/registry/matomo-analytics.ts

@@ -36,7 +36,19 @@ export function useScriptMatomoAnalytics<T extends MatomoAnalyticsApi>(_options?
       schema: import.meta.dev ? MatomoAnalyticsOptions : undefined,
       scriptOptions: {
         use() {
-          return { _paq: window._paq }
+          // Ensure _paq is always available as a queue, even before script loads
+          const _paqProxy = {
+            push: (...args: any[]) => {
+              // If _paq exists and has push method, use it directly
+              if (window._paq && typeof window._paq.push === 'function') {
+                return window._paq.push(...args)
+              }
+              // Otherwise, ensure _paq is initialized as an array and push to it
+              window._paq = window._paq || []
+              return window._paq.push(...args)
+            },
+          }
+          return { _paq: _paqProxy }
         },
       },
       clientInit: import.meta.server