Fix DevTools panel disconnecting in Chrome after 30 seconds of inactivity

WE2-967

Includes minor cleanup for DevTools related files

Signed-off-by: Tanel Metsar <[email protected]>

Author: taneltm

static/views/devtools/panels/devtools-webeid.html

@@ -22,11 +22,13 @@
 
     <div class="version" title="Extension version"></div>
   </header>
+
   <main>
     <section data-page="events">
       <div id="event-list"></div>
       <pre id="event-details"></pre>
     </section>
+
     <section data-page="log">
       <div class="toolbar">
         <div class="group">
@@ -44,12 +46,12 @@
       </div>
       <div id="log-messages"></div>
     </section>
+
     <section data-page="settings">
       <div class="warning">The settings you change here apply to all pages and persist even after closing DevTools.</div>
       <table>
         <tbody id="settings-list"></tbody>
       </table>
-      
     </section>
   </main>
 

static/views/devtools/panels/devtools-webeid.js

@@ -24,11 +24,27 @@ import events from "./webeid-events.js";
 import log from "./webeid-log.js";
 import settings from "./webeid-settings.js";
 
-
 const backgroundConnection = chrome.runtime.connect({
   name: "webeid-devtools",
 });
 
+const keepAliveInterval = setInterval(() => {
+  backgroundConnection.postMessage({ devtools: "keep-alive" });
+}, 20000);
+
+backgroundConnection.onDisconnect.addListener(() => {
+  clearInterval(keepAliveInterval);
+
+  log.append({
+    source: "devtools-webeid.js",
+    type: "error",
+    time: new Date().toISOString().match(/T((.)*)Z/)[1],
+    message: [
+      "Web eID DevTools panel disconnected from the extension. Please reopen the browser DevTools to continue."
+    ],
+  });
+});
+
 backgroundConnection.onMessage.addListener((message) => {
   if (!message.tabId || message.tabId === chrome.devtools.inspectedWindow.tabId) {
     if (message.devtools === "log") {
@@ -58,4 +74,4 @@ backgroundConnection.onMessage.addListener((message) => {
       document.querySelector('header .version').textContent = defaultConfig.VERSION;
     }
   }
-});
+});

static/views/devtools/panels/webeid-log.js

@@ -47,12 +47,8 @@ function createLogEntryElement(type, time, message, source) {
 
 function stringifyError(error) {
   const {
-    fileName,
-    lineNumber,
-    columnNumber,
     message,
     name,
-    code,
     stack,
   } = error;