add ability to enable raw packet logging from dev tools console

src/js/Connection.js

@@ -6,6 +6,9 @@ import NotificationUtils from "./NotificationUtils.js";
 
 class Connection {
 
+    // enable to log raw tx/rx bytes to console
+    static log = false;
+
     static async connectViaBluetooth() {
         try {
             await this.connect(await BleConnection.open());
@@ -90,6 +93,20 @@ class Connection {
         // clear previous connection state
         GlobalState.contacts = [];
 
+        // log raw tx bytes if enabled
+        GlobalState.connection.on("tx", async (data) => {
+            if(this.log){
+                console.log("tx", data);
+            }
+        });
+
+        // log raw rx bytes if enabled
+        GlobalState.connection.on("rx", async (data) => {
+            if(this.log){
+                console.log("rx", data);
+            }
+        });
+
         // listen for self info, and then init database
         GlobalState.connection.once(Constants.ResponseCodes.SelfInfo, async (selfInfo) => {
             await Database.initDatabase(Utils.bytesToHex(selfInfo.publicKey));

src/main.js

@@ -5,6 +5,7 @@ import "./style.css";
 
 import App from './components/App.vue';
 import GlobalState from "./js/GlobalState.js";
+import Connection from "./js/Connection.js";
 
 // helper function that force redirects to the main page if there is no database connection
 function handleRouteThatRequiresDatabase() {
@@ -76,6 +77,10 @@ navigator.serviceWorker.addEventListener("message", async (event) => {
     }
 });
 
+// access Connection class from window
+// this allows typing "Connection.log = true" in Chrome dev tools
+window.Connection = Connection;
+
 createApp(App)
     .use(router)
     .use(vClickOutside)