adding handleBackgroundMessage() to panel

APrioriInvestments · Jul 8, 2023 · c5b18e2 · c5b18e2
1 parent bf7ba18
commit c5b18e2
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 4 deletions.
diff --git a/object_database/web/devtools/cells_panel.html b/object_database/web/devtools/cells_panel.html
@@ -10,7 +10,7 @@
  </head>
  <body>
  <div id="main"></div>
- <div id="cell-info"> some cells data here</div>
+ <div id="cell-info">Click on a tree node to get more info</div>
  </body>
  <script type="module" src="js/cell_panel.js"></script>
 </html>
diff --git a/object_database/web/devtools/js/cell_panel.js b/object_database/web/devtools/js/cell_panel.js
@@ -32,8 +32,8 @@ function handleMessageFromBackground(msg){
  }
  break;
  case "info":
- console.log("info message from cell handler", msg)
- breakl
+ handleInfoFromBackground(msg);
+ break;
  }
 }
 
@@ -107,6 +107,9 @@ const cellsTreeDisplay = (cells) => {
 // info panel display
 const updateInfoPanel = (node) => {
  const infoPanel = document.getElementById("cell-info");
+ // clear it out first
+ infoPanel.textContent = null;
+ const infoSpan = document.createElement("span");
  const id = node.getAttribute("data-original-id");
  // we need to retrieve the source code for the node
  window.sendMessageToBackground({
@@ -122,6 +125,24 @@ const updateInfoPanel = (node) => {
  info = `${info}\nsubscribed to cell-id: ${parentSubtree.id}`;
  }
 
- infoPanel.innerText = info;
+ infoSpan.innerText = info;
+ infoPanel.append(infoSpan);
 }
 
+
+// I handle incoming background 'info' messages
+// ie generally these are coming from a devtools request
+// to the target application and response from the target app
+// returning via content script -> background
+const handleInfoFromBackground = (msg) => {
+ console.log("message from backgound", msg)
+ const infoPanel = document.getElementById("cell-info");
+ const propsDiv = document.createElement("div");
+ let data = msg.data;
+ if (data) {
+ data = JSON.stringify(data);
+ }
+ propsDiv.innerText = `props: ${data}`;
+ infoPanel.append(propsDiv);
+
+}