add docs

webdriverio · Feb 3, 2024 · 45ed53f · 45ed53f
1 parent 4bc00e4
commit 45ed53f
Show file tree

Hide file tree

Showing 5 changed files with 53 additions and 14 deletions.
diff --git a/.npmignore b/.npmignore
@@ -0,0 +1,3 @@
+src
+*.json
+examples
diff --git a/README.md b/README.md
@@ -1,2 +1,39 @@
-# bx
-Command line tool to run JavaScript, TypeScript or HTML files in the browser.
+# 🌐 exweb - a browser runner
+
+With Node.js, Deno or Bun there are so many JavaScript environments to choose from. However, nothing is as good as the browser environment. `exweb` gives you an execution runtime for the browser.
+
+For example, let's say you have a script like this:
+
+```js
+console.log(navigator.userAgent)
+```
+
+With `exweb` you can easily run this script within different browser environments:
+
+```sh
+> npx exweb ./script.js
+Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36
+```
+
+You can easily switch browser via the `--browserName` parameter:
+
+```sh
+> npx exweb ./script.js --browserName firefox
+Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:121.0) Gecko/20100101 Firefox/121.0
+```
+
+It even allows you to run `.html` files, e.g. given this file:
+
+```html
+<script type="module">
+  console.log(document.querySelector('b').textContent);
+</script>
+<b>Hello World!</b>
+```
+
+Running this with `exweb` results in:
+
+```sh
+> npx exweb ./html.html
+Hello World!
+```
diff --git a/examples/consoleLog.html b/examples/consoleLog.html
@@ -1,4 +1,4 @@
 <script type="module">
   console.log(document.querySelector('b').textContent);
 </script>
-<b>!Hello World!</b>
+<b>Hello World!</b>
diff --git a/src/runner.ts b/src/runner.ts
@@ -1,7 +1,7 @@
 import { remote } from 'webdriverio'
 
 import { getHeadlessArgs } from './utils.js'
-import type { ErrorEvent, ExecutionEnvironment, RunnerArgs } from './types.js'
+import type { ExecutionEnvironment, RunnerArgs } from './types.js'
 
 export async function run (env: ExecutionEnvironment, args: RunnerArgs) {
     const browser = await remote({
@@ -13,18 +13,16 @@ export async function run (env: ExecutionEnvironment, args: RunnerArgs) {
     })
 
     let error: Error | undefined
-    env.server.ws.on('bx:event', (message: ErrorEvent) => {
-        if (message.name === 'errorEvent') {
-            error = new Error(message.message)
-            error.stack = message.error.replace(`http://localhost:${env.server.config.server.port}/@fs`, 'file://')
-        }
-    })
-
     browser.url(env.url)
     await new Promise<void>((resolve) => {
         env.server.ws.on('bx:event', (message) => {
+            if (message.name === 'errorEvent') {
+                error = new Error(message.message)
+                error.stack = message.error.replace(`http://localhost:${env.server.config.server.port}/@fs`, 'file://')
+                return resolve()
+            }
             if (message.name === 'doneEvent') {
-                resolve()
+                return resolve()
             }
         })
     })

diff --git a/src/server.ts b/src/server.ts
@@ -48,14 +48,14 @@ export class ViteServer {
 
 function instrument (filename: string, onConnect: (value: ViteDevServer) => void): Plugin {
     const instrumentation = path.resolve(__dirname, 'browser', 'index.js')
-
+    const sendFinishEvent = `import.meta.hot?.send('bx:event', { name: 'doneEvent' })`
     return {
         name: 'instrument',
         enforce: 'post',
         transform: (code, id) => {
             if (id === filename) {
                 return {
-                    code: `${code}\nimport.meta.hot?.send('bx:event', { name: 'doneEvent' })`
+                    code: `${code}\n${sendFinishEvent}`
                 }
             }
             return null
@@ -77,6 +77,7 @@ function instrument (filename: string, onConnect: (value: ViteDevServer) => void
                     <html>
                     <script type="module" src="/@fs${instrumentation}"></script>
                     ${code}
+                    ${path.extname(filename) === '.html' ? `<script type="module">${sendFinishEvent}</script>` : ''}
                 `
                 res.end(await server.transformIndexHtml(`${req.originalUrl}`, template))
             })