@alliance-droid/status-feedback-system 4.1.3 → 4.1.5

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## 4.1.5
+
+### Fixed
+
+- `<DevFeedback>` console-error capture: arguments are now serialized properly before being attached to a bug report. Previously `console.error(obj)` / `console.error('msg', { detail })` were captured via `String()`, which produced `[object Object]` — so the resulting ADO work item listed each console error as `[object Object]`. Errors now serialize to their stack, plain objects/arrays to JSON (with circular-reference safety), and primitives via `String()`. Extracted to `formatConsoleArg` / `formatConsoleArgs` with unit coverage.
+
+## 4.1.4
+
+### Changed
+
+- `<DevFeedback>` modal: removed the "Submitting as <email>" line at the top of the form, and increased the modal padding (`p-5`/`px-5` → `p-6`/`px-6` on the header, body, and footer) for more breathing room.
+
 ## 4.1.3
 
 ### Fixed

package/dist/components/DevFeedback.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { createStatusClient, type StatusClient } from '../api.js';
 	import { FEEDBACK_CATEGORIES } from '../types.js';
+	import { formatConsoleArgs } from '../console-format.js';
 	import PasteImageInput from './shared/PasteImageInput.svelte';
 	import {
 		Card,
@@ -209,7 +210,7 @@
 		// Capture recent console errors to attach to bug reports.
 		const originalConsoleError = console.error;
 		console.error = (...args: unknown[]) => {
-			consoleErrors.push(args.map(String).join(' '));
+			consoleErrors.push(formatConsoleArgs(args));
 			if (consoleErrors.length > maxConsoleErrors) consoleErrors.shift();
 			originalConsoleError.apply(console, args);
 		};
@@ -419,7 +420,7 @@
 				<!-- Header (draggable) -->
 				<div
 					role="presentation"
-					class="flex items-center justify-between px-5 py-4 border-b border-border shrink-0 select-none"
+					class="flex items-center justify-between px-6 py-4 border-b border-border shrink-0 select-none"
 					style="cursor: {isDragging ? 'grabbing' : 'grab'};"
 					onmousedown={handleDragStart}
 				>
@@ -443,7 +444,7 @@
 				</div>
 
 				<!-- Body (scrollable) -->
-				<div class="p-5 space-y-4 overflow-y-auto">
+				<div class="p-6 space-y-4 overflow-y-auto">
 					{#if submitResult === 'success'}
 						<div class="text-center py-6">
 							<i class="fa-solid fa-check-circle text-3xl text-green-400"></i>
@@ -453,11 +454,6 @@
 							</p>
 						</div>
 					{:else}
-						<div class="flex items-center gap-1.5 text-xs text-foreground-tertiary">
-							<i class="fa-solid fa-user" aria-hidden="true"></i>
-							<span>Submitting as <span class="font-medium text-foreground-secondary">{userEmail}</span></span>
-						</div>
-
 						<Input
 							bind:value={formTitle}
 							placeholder={formType === 'bug' ? 'Brief summary of the bug' : 'Feature title'}
@@ -545,7 +541,7 @@
 
 				<!-- Footer -->
 				{#if submitResult !== 'success' && hasUserEmail}
-					<div class="flex justify-end gap-2 px-5 py-4 border-t border-border shrink-0">
+					<div class="flex justify-end gap-2 px-6 py-4 border-t border-border shrink-0">
 						<Button variant="neutral" style="outline" onclick={() => (formOpen = false)}>
 							Cancel
 						</Button>

package/dist/console-format.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Serialize console.error arguments into useful strings for bug-report capture.
+ *
+ * The naive `args.map(String).join(' ')` turns any object argument into the
+ * useless `"[object Object]"` and drops an Error's stack — so a captured
+ * `console.error(err)` or `console.error('msg', { detail })` reaches the ADO
+ * work item as `[object Object]`. These helpers serialize each argument by shape.
+ */
+/** Serialize a single console.error argument to a useful string. */
+export declare function formatConsoleArg(arg: unknown): string;
+/** Serialize a console.error argument list into a single line. */
+export declare function formatConsoleArgs(args: unknown[]): string;

package/dist/console-format.js

@@ -0,0 +1,46 @@
+/**
+ * Serialize console.error arguments into useful strings for bug-report capture.
+ *
+ * The naive `args.map(String).join(' ')` turns any object argument into the
+ * useless `"[object Object]"` and drops an Error's stack — so a captured
+ * `console.error(err)` or `console.error('msg', { detail })` reaches the ADO
+ * work item as `[object Object]`. These helpers serialize each argument by shape.
+ */
+/** Serialize a single console.error argument to a useful string. */
+export function formatConsoleArg(arg) {
+    if (typeof arg === 'string')
+        return arg;
+    if (arg instanceof Error)
+        return arg.stack || `${arg.name}: ${arg.message}`;
+    if (arg === null)
+        return 'null';
+    if (arg === undefined)
+        return 'undefined';
+    if (typeof arg === 'object') {
+        const seen = new WeakSet();
+        try {
+            const json = JSON.stringify(arg, (_key, value) => {
+                if (value instanceof Error)
+                    return value.stack || `${value.name}: ${value.message}`;
+                if (typeof value === 'object' && value !== null) {
+                    if (seen.has(value))
+                        return '[Circular]';
+                    seen.add(value);
+                }
+                return value;
+            });
+            // JSON.stringify returns undefined for unserializable roots and "{}"
+            // for objects with no enumerable props — fall back to String() then.
+            if (json && json !== '{}')
+                return json;
+        }
+        catch {
+            /* fall through to String() */
+        }
+    }
+    return String(arg);
+}
+/** Serialize a console.error argument list into a single line. */
+export function formatConsoleArgs(args) {
+    return args.map(formatConsoleArg).join(' ');
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@alliance-droid/status-feedback-system",
-	"version": "4.1.3",
+	"version": "4.1.5",
 	"type": "module",
 	"description": "Drop-in system status pages and user feedback forms for SvelteKit apps",
 	"svelte": "./dist/index.js",