feat(svelte-integration): svelte error handling playground app with Hawk Catcher implemented

Author: Reversean

packages/svelte/playground/.env.example

@@ -0,0 +1 @@
+VITE_HAWK_TOKEN=your_integration_token_here

packages/svelte/playground/.gitignore

@@ -0,0 +1,23 @@
+# Dependencies
+node_modules
+
+# Build output
+.output
+.vercel
+.netlify
+.wrangler
+.svelte-kit
+build
+dist
+
+# OS
+.DS_Store
+Thumbs.db
+
+# IDE
+.idea/
+
+# Environment
+.env
+.env.example
+!.env.example

packages/svelte/playground/README.md

@@ -0,0 +1,153 @@
+# Hawk Error Tracker - SvelteKit Playground
+
+Test playground for Hawk Error Tracker integration with SvelteKit and Svelte 5.
+
+## Table of Contents
+
+- [Getting Started](#getting-started)
+- [What Hawk Catches](#what-hawk-catches)
+- [Error Test Scenarios](#error-test-scenarios)
+- [Testing Guide](#testing-guide)
+
+## Getting Started
+
+### Prerequisites
+
+- Node.js 18+
+- Yarn 1.x
+
+### Setup
+
+1. Install dependencies:
+
+```shell
+yarn install
+```
+
+2. Configure Hawk token:
+
+```shell
+cp .env.example .env
+```
+
+Then add your token from [hawk.so](https://garage.hawk.so) to `.env`:
+
+```env
+VITE_HAWK_TOKEN=your_integration_token_here
+```
+
+3. Start development server:
+
+```shell
+yarn dev
+```
+
+## What Hawk Catches
+
+### ✅ Automatically Caught
+
+Hawk automatically catches these errors via `window.onerror` and `window.onunhandledrejection`:
+
+- Event handler errors (`onclick`, `onsubmit`, etc.)
+- Lifecycle errors (`onMount`, `onDestroy`)
+- Reactive errors (`$effect`, `$derived`)
+- Async errors (`setTimeout`, `setInterval`)
+- Unhandled promise rejections
+- Component rendering errors
+
+### ❌ Not Caught
+
+- Form validation errors (intentional, use `fail()`)
+- Errors caught by `<svelte:boundary>` (requires manual `hawk.send()`)
+- SvelteKit `handleError` hook errors (requires manual `hawk.send()`)
+
+## Error Test Scenarios
+
+Visit `/errors` to test 14 error scenarios:
+
+### Load Functions
+
+- **Load Expected** - `error()` helper in `+page.ts`
+- **Load Unexpected** - Direct throw in `+page.ts`
+- **Server Load** - Error in `+page.server.ts`
+
+### Component Lifecycle
+
+- **onMount Error** - Error in `onMount()` hook
+- **$effect Error** - Error in Svelte 5 `$effect` rune
+
+### Event Handlers
+
+- **Click Handler** - Error in `onclick`
+- **Submit Handler** - Error in form `onsubmit`
+
+### Async Errors
+
+- **setTimeout Error** - Error inside `setTimeout`
+- **Promise Rejection** - Unhandled promise rejection
+
+### Form Actions
+
+- **Form Validation** - `fail()` helper (not tracked)
+- **Form Unexpected** - Unexpected form action error
+
+### Error Boundaries
+
+- **Boundary Render** - Component rendering error
+- **Boundary Effect** - `$effect` error inside boundary
+
+### Stores
+
+- **Store Subscription** - Error in store callback
+
+## Testing Guide
+
+### Manual Testing
+
+```bash
+yarn dev
+```
+
+1. Open `http://localhost:5173/errors`
+2. Open DevTools Console (F12)
+3. Click each test card
+4. Trigger the error
+5. Check Hawk dashboard for tracked errors
+
+### Console Markers
+
+| Marker | Handler             | Description                  |
+|--------|---------------------|------------------------------|
+| 🔴     | `handleError` hook  | Load/form action errors      |
+| 🟡     | Global handlers     | Event/async/lifecycle errors |
+| 🟢     | `<svelte:boundary>` | Component rendering errors   |
+
+### Expected Behavior
+
+| Error Type       | Caught by Hawk | Notes                      |
+|------------------|----------------|----------------------------|
+| Event handlers   | ✅              | Auto via `window.onerror`  |
+| Lifecycle hooks  | ✅              | Auto via `window.onerror`  |
+| Async errors     | ✅              | Auto via global handlers   |
+| Load functions   | ❌              | Needs manual `hawk.send()` |
+| Form actions     | ❌              | Needs manual `hawk.send()` |
+| Error boundaries | ❌              | Needs manual `hawk.send()` |
+
+## Integration
+
+Current integration in `hooks.client.ts`:
+
+```typescript
+import HawkCatcher from '@hawk.so/javascript';
+
+if (import.meta.env.VITE_HAWK_TOKEN) {
+  new HawkCatcher(import.meta.env.VITE_HAWK_TOKEN);
+}
+```
+
+Hawk automatically registers global error handlers for:
+
+- `window.onerror`
+- `window.onunhandledrejection`
+
+**Note:** HawkCatcher is browser-only and cannot run on the server (uses `localStorage`, `window`, etc.). Server-side errors are not tracked automatically.

packages/svelte/playground/package.json

@@ -0,0 +1,23 @@
+{
+	"name": "hawk-svelte-playground",
+	"private": true,
+	"version": "1.0.0",
+	"description": "SvelteKit playground for testing Hawk.so error handling integration",
+	"type": "module",
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build",
+		"preview": "vite preview"
+	},
+	"dependencies": {
+		"@hawk.so/javascript": "file:../../.."
+	},
+	"devDependencies": {
+		"@sveltejs/adapter-auto": "^7.0.0",
+		"@sveltejs/kit": "^2.48.5",
+		"@sveltejs/vite-plugin-svelte": "^6.2.1",
+		"svelte": "^5.45.10",
+		"typescript": "^5.9.3",
+		"vite": "^7.2.2"
+	}
+}