support error logging

webdriverio · Feb 3, 2024 · 9a2c6bd · 9a2c6bd
1 parent 26e6617
commit 9a2c6bd
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 6 deletions.
diff --git a/examples/consoleLog.js b/examples/consoleLog.js
@@ -1,2 +1,4 @@
-console.log('Hello, World!')
-console.log(window.navigator.userAgent);
+console.log('Hello, World!!')
+console.log(window.navigator.userAgent)
+
+throw new Error('ups!')
diff --git a/src/browser/index.ts b/src/browser/index.ts
@@ -17,6 +17,13 @@ for (const method of CONSOLE_METHODS) {
     }
 }
 
+addEventListener('error', (ev) => import.meta.hot?.send('bx:event', {
+    name: 'errorEvent',
+    filename: ev.filename,
+    message: ev.message,
+    error: ev.error.stack
+}))
+
 function sanitizeConsoleArgs (args: unknown[]) {
     return args.map((arg: any) => {
         if (

diff --git a/src/server.ts b/src/server.ts
@@ -2,7 +2,7 @@ import fs from 'node:fs/promises'
 import path from 'node:path'
 import { createServer, type InlineConfig, type ViteDevServer, type Plugin } from 'vite'
 
-import type { ExecutionEnvironment, ConsoleEvent } from './types.js'
+import type { ExecutionEnvironment, ConsoleEvent, ErrorEvent } from './types.js'
 
 const __dirname = path.dirname(new URL(import.meta.url).pathname)
 
@@ -46,7 +46,7 @@ export class ViteServer {
 }
 
 function instrument (filename: string, onConnect: (value: unknown) => void): Plugin {
-    const instrumenter = path.resolve(__dirname, 'browser', 'index.js')
+    const instrumentation = path.resolve(__dirname, 'browser', 'index.js')
 
     return {
         name: 'instrument',
@@ -65,22 +65,31 @@ function instrument (filename: string, onConnect: (value: unknown) => void): Plu
                 const template = `
                     <!DOCTYPE html>
                     <html>
-                    <script type="module" src="/@fs${instrumenter}"></script>
+                    <script type="module" src="/@fs${instrumentation}"></script>
                     ${code}
                 `
                 res.end(await server.transformIndexHtml(`${req.originalUrl}`, template))
             })
 
             server.ws.on('connection', onConnect)
-            server.ws.on('bx:event', (message: ConsoleEvent) => {
+            server.ws.on('bx:event', (message: ConsoleEvent | ErrorEvent) => {
                 if (message.name === 'consoleEvent') {
                     return handleConsole(message)
                 }
+                if (message.name === 'errorEvent') {
+                    return handleError(server, message)
+                }
             })
         }
     }
 }
 
 function handleConsole (message: ConsoleEvent) {
     console[message.type](...message.args)
+}
+
+function handleError (server: ViteDevServer, message: ErrorEvent) {
+    const stack = message.error
+        .replace(`http://localhost:${server.config.server.port}/@fs`, '')
+    console.error(message.message, stack)
 }
diff --git a/src/types.ts b/src/types.ts
@@ -14,4 +14,11 @@ export interface ConsoleEvent {
     name: 'consoleEvent'
     type: 'log' | 'info' | 'warn' | 'debug' | 'error'
     args: unknown[]
+}
+
+export interface ErrorEvent {
+    name: 'errorEvent'
+    filename: string
+    message: string
+    error: string
 }