@mechris3/glassbox 0.1.31 → 0.1.33

package/README.md

@@ -139,6 +139,16 @@ Extend `BasePage` — no constructor needed. The following methods are available
 | `clearSession(origin?)` | Clear cookies and storage |
 | `readClipboard()` | Read text from clipboard |
 
+**Important:** Glassbox runs your files as native ESM (via `--import tsx`). Imports from `@mechris3/glassbox` work as-is, but **relative imports between your own files must use `.js` extensions** — even though the source files are `.ts`. This is how Node's ESM loader resolves TypeScript:
+
+```typescript
+// ✅ Correct — .js extension on relative import
+import { LoginPage } from '../page-objects/login.page.js';
+
+// ❌ Wrong — will fail at runtime with extensionless path
+import { LoginPage } from '../page-objects/login.page';
+```
+
 Example:
 
 ```typescript
@@ -172,7 +182,7 @@ Extend `Journey` — use `this.page()` to create page objects:
 ```typescript
 // journeys/login.journey.ts
 import { Journey } from '@mechris3/glassbox';
-import { LoginPage } from '../page-objects/login.page';
+import { LoginPage } from '../page-objects/login.page.js';
 
 export class LoginJourney extends Journey {
   loginPage = this.page(LoginPage);
@@ -403,6 +413,10 @@ Requires `glassbox serve` to be running. The AI gets these tools:
 
 The AI can identify journeys by name (`"login"`), ID (`"login-and-add-todos"`), or full path. After a failure, the browser stays open so `getDomSnapshot` and `getScreenshot` can inspect the failed state.
 
+## Gotchas
+
+- **Missing `.js` extensions on relative imports:** Glassbox spawns journeys in a child process using native ESM (`--import tsx` with `import()`). Node's ESM loader requires file extensions on relative paths. If you see `"Journey export must be a class with execute() method or a function"` at runtime, the most likely cause is a relative import without a `.js` extension. Package imports (`from '@mechris3/glassbox'`) don't need extensions — only your own file-to-file imports do.
+
 ## License
 
 Proprietary. All rights reserved.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mechris3/glassbox",
-  "version": "0.1.31",
+  "version": "0.1.33",
   "description": "Debugger-style browser automation test runner with live execution control via CDP",
   "main": "dist/src/index.js",
   "types": "dist/src/index.d.ts",

package/ui/dist/browser/index.html

@@ -9,5 +9,5 @@
 <style>:root{--bg-deep:#0d1117;--bg-panel:#161b22;--bg-surface:#1c2128;--bg-elevated:#21262d;--accent-primary:#e5a00d;--accent-hover:#f0b429;--accent-muted:#9e7a0c;--text-primary:#e6edf3;--text-secondary:#b1bac4;--text-muted:#7d8590;--color-success:#2ea043;--color-danger:#da3633;--color-warning:#d29922;--color-breakpoint:#f85149;--border-color:#30363d;--border-subtle:#21262d;--shadow-sm:0 1px 2px rgba(0, 0, 0, .3);--shadow-md:0 4px 12px rgba(0, 0, 0, .4);--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;--font-mono:"SF Mono", "Fira Code", "Cascadia Code", Consolas, monospace;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font-family:var(--font-sans);font-size:14px;line-height:1.5;color:var(--text-primary);background-color:var(--bg-deep);-webkit-font-smoothing:antialiased}</style><link rel="stylesheet" href="styles-HMZYQRBV.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles-HMZYQRBV.css"></noscript></head>
 <body>
   <gb-root></gb-root>
-<script src="polyfills-5CFQRCPP.js" type="module"></script><script src="main-CB3765ZI.js" type="module"></script></body>
+<script src="polyfills-5CFQRCPP.js" type="module"></script><script src="main-ZC3XC2JO.js" type="module"></script></body>
 </html>