diff --git a/deltachat-jsonrpc/typescript/index.html b/deltachat-jsonrpc/typescript/example.html
similarity index 92%
rename from deltachat-jsonrpc/typescript/index.html
rename to deltachat-jsonrpc/typescript/example.html
index 0ec6b6b24..54edfc4b0 100644
--- a/deltachat-jsonrpc/typescript/index.html
+++ b/deltachat-jsonrpc/typescript/example.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
+    <title>Deltachat JSON-RPC example</title>
     <style>
       body {
         font-family: monospace;
@@ -41,6 +42,7 @@
     <script type="module" src="dist/example.bundle.js"></script>
   </head>
   <body>
+    <h1>Deltachat JSON-RPC example</h1>
     <div class="grid">
       <div id="header"></div>
       <div id="main"></div>
diff --git a/deltachat-jsonrpc/typescript/example.ts b/deltachat-jsonrpc/typescript/example/example.ts
similarity index 86%
rename from deltachat-jsonrpc/typescript/example.ts
rename to deltachat-jsonrpc/typescript/example/example.ts
index 2622a1b63..f13d3a717 100644
--- a/deltachat-jsonrpc/typescript/example.ts
+++ b/deltachat-jsonrpc/typescript/example/example.ts
@@ -1,11 +1,12 @@
-import { RawClient, RPC } from "./src/lib";
+import { RawClient } from "../src/lib";
 import { WebsocketTransport, Request } from "yerpc";
 
 type DeltaEvent = { id: string; contextId: number; field1: any; field2: any };
-var selectedAccount = 0;
+var SELECTED_ACCOUNT = 0;
+
 window.addEventListener("DOMContentLoaded", (_event) => {
   (window as any).selectDeltaAccount = (id: string) => {
-    selectedAccount = Number(id);
+    SELECTED_ACCOUNT = Number(id);
     window.dispatchEvent(new Event("account-changed"));
   };
   run().catch((err) => console.error("run failed", err));
@@ -18,8 +19,11 @@ async function run() {
 
   const transport = new WebsocketTransport("ws://localhost:20808/ws");
   const client = new RawClient(transport);
+  transport.on("error", (err) => {
+    console.error("WebSocket transport error", err)
+  });
 
-  (window as any).client = client;
+  ;(window as any).client = client;
 
   transport.on("request", (request: Request) => {
     const method = request.method;
@@ -30,7 +34,7 @@ async function run() {
   });
 
   window.addEventListener("account-changed", async (_event: Event) => {
-    await client.selectAccount(selectedAccount);
+    await client.selectAccount(SELECTED_ACCOUNT);
     listChatsForSelectedAccount();
   });
 
@@ -43,9 +47,16 @@ async function run() {
         write(
           $head,
           `<a href="#" onclick="selectDeltaAccount(${account.id})">
-          ${account.addr!}
+          ${account.id}: ${account.addr!}
           </a>&nbsp;`
         );
+      } else {
+        write(
+          $head,
+          `<a href="#">
+          ${account.id}: (unconfigured)
+          </a>&nbsp;`
+        )
       }
     }
   }
diff --git a/deltachat-jsonrpc/typescript/node-demo.js b/deltachat-jsonrpc/typescript/example/node-demo.js
similarity index 64%
rename from deltachat-jsonrpc/typescript/node-demo.js
rename to deltachat-jsonrpc/typescript/example/node-demo.js
index 3d5afdc1b..937accb15 100644
--- a/deltachat-jsonrpc/typescript/node-demo.js
+++ b/deltachat-jsonrpc/typescript/example/node-demo.js
@@ -1,13 +1,14 @@
-import { Deltachat } from "./dist/deltachat.js";
+import { Deltachat } from "../dist/deltachat.js";
 
 run().catch(console.error);
 
 async function run() {
   const delta = new Deltachat();
-  delta.addEventListener("event", (event) => {
+  delta.on("event", (event) => {
     console.log("event", event.data);
   });
 
   const accounts = await delta.rpc.getAllAccounts();
   console.log("accounts", accounts);
+  console.log("waiting for events...")
 }
diff --git a/deltachat-jsonrpc/typescript/package.json b/deltachat-jsonrpc/typescript/package.json
index f1547e9b8..370fcde65 100644
--- a/deltachat-jsonrpc/typescript/package.json
+++ b/deltachat-jsonrpc/typescript/package.json
@@ -12,15 +12,16 @@
     "build": "npm run generate-bindings && tsc",
     "bundle": "npm run build && esbuild --bundle dist/deltachat.js --outfile=dist/deltachat.bundle.js",
     "generate-bindings": "cargo test",
-    "example:build": "tsc && esbuild --bundle dist/example.js --outfile=dist/example.bundle.js",
-    "example:dev": "esbuild example.ts --bundle --outdir=dist --servedir=.",
+    "example:build": "tsc && esbuild --bundle dist/example.js --outfile=dist/example.bundle.js && cp example/index.html dist",
+    "example:start": "http-server dist/",
+    "example:dev": "esbuild example/example.ts --bundle --outfile=dist/example.bundle.js --servedir=.",
     "coverage": "tsc -b test && COVERAGE=1 NODE_OPTIONS=--enable-source-maps c8 --include \"dist/*\" -r text -r html -r json mocha test_dist && node report_api_coverage.mjs",
     "test": "rm -rf dist && npm run build && npm run coverage && npm run prettier:check"
   },
   "dependencies": {
     "isomorphic-ws": "^4.0.1",
     "tiny-emitter": "git+https://github.com/Simon-Laux/tiny-emitter.git",
-    "yerpc": "^0.3"
+    "yerpc": "^0.3.3"
   },
   "devDependencies": {
     "prettier": "^2.6.2",
diff --git a/deltachat-jsonrpc/typescript/src/client.ts b/deltachat-jsonrpc/typescript/src/client.ts
index d228249ae..ac8525b42 100644
--- a/deltachat-jsonrpc/typescript/src/client.ts
+++ b/deltachat-jsonrpc/typescript/src/client.ts
@@ -17,11 +17,12 @@ export type Events = Record<
 >;
 
 export class BaseDeltachat<
-  Transport extends BaseTransport
+  Transport extends BaseTransport<any>
 > extends TinyEmitter<Events> {
   rpc: RawClient;
   account?: T.Account;
-  constructor(protected transport: Transport) {
+  private contextEmitters: TinyEmitter<Events>[] = [];
+  constructor(public transport: Transport) {
     super();
     this.rpc = new RawClient(this.transport);
     this.transport.on("request", (request: Request) => {
@@ -43,8 +44,6 @@ export class BaseDeltachat<
     return await this.rpc.getAllAccounts();
   }
 
-  private contextEmitters: TinyEmitter<Events>[] = [];
-
   getContextEvents(account_id: number) {
     if (this.contextEmitters[account_id]) {
       return this.contextEmitters[account_id];
@@ -65,13 +64,14 @@ export const DEFAULT_OPTS: Opts = {
 export class Deltachat extends BaseDeltachat<WebsocketTransport> {
   opts: Opts;
   close() {
-    this.transport._socket.close();
+    this.transport.close();
   }
-  constructor(opts: Opts | string | undefined) {
+  constructor(opts?: Opts | string) {
     if (typeof opts === "string") opts = { url: opts };
     if (opts) opts = { ...DEFAULT_OPTS, ...opts };
     else opts = { ...DEFAULT_OPTS };
-    super(new WebsocketTransport(opts.url));
+    const transport = new WebsocketTransport(opts.url)
+    super(transport);
     this.opts = opts;
   }
 }
diff --git a/deltachat-jsonrpc/typescript/tsconfig.json b/deltachat-jsonrpc/typescript/tsconfig.json
index 2c3812a38..0493dbf9e 100644
--- a/deltachat-jsonrpc/typescript/tsconfig.json
+++ b/deltachat-jsonrpc/typescript/tsconfig.json
@@ -15,6 +15,6 @@
     "noImplicitAny": true,
     "isolatedModules": true
   },
-  "include": ["*.ts"],
+  "include": ["*.ts", "example/*.ts"],
   "compileOnSave": false
 }
