Merge pull request #3 from oslabs-beta/new_ax_tree

New ax tree

Author: Oliver-Cho

src/backend/routers/linkFiber.ts

@@ -133,7 +133,17 @@ export default function linkFiber(mode: Status): () => Promise<void> {
         // Obtain the updated FiberRootNode, after the target React application re-renders
         const fiberRoot = args[1];
         // If the target React application is visible, send a request to update the snapShot tree displayed on Chrome Extension
-        if (isVisible) throttledUpdateSnapshot(fiberRoot, mode);
+        if (isVisible) {
+          throttledUpdateSnapshot(fiberRoot, mode);
+          // SEND COMMAND TO FRONT END TO GET NEW AX TREE
+          window.postMessage(
+            {
+              action: 'recordAXSnap',
+              payload: 'recordAXSnap',
+            },
+            '*',
+          );
+        }
         // After our added work is completed we invoke the original onComitFiberRoot function
         return onCommitFiberRoot(...args);
       };

src/extension/background.js

@@ -248,21 +248,6 @@ chrome.runtime.onConnect.addListener((port) => {
         return true;
 
       case 'jumpToSnap':
-        // chrome.debugger.detach({ tabId: tabId });
-        // console.log('background.js: jumpToSnap:', getAccessibilityTree(tabId));
-        chrome.debugger.attach({ tabId: tabId }, '1.3', () => {
-          chrome.debugger.sendCommand({ tabId: tabId }, 'Accessibility.enable', () => {
-            chrome.debugger.sendCommand(
-              { tabId: tabId },
-              'Accessibility.getFullAXTree',
-              {},
-              (response) => {
-                console.log(response);
-                chrome.debugger.detach({ tabId: tabId });
-              },
-            );
-          });
-        });
         chrome.tabs.sendMessage(tabId, msg);
         return true; // attempt to fix message port closing error, consider return Promise
 
@@ -303,7 +288,8 @@ chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
     action === 'jumpToSnap' ||
     action === 'injectScript' ||
     action === 'devToolsInstalled' ||
-    action === 'aReactApp'
+    action === 'aReactApp' ||
+    action === 'recordAXSnap'
   ) {
     isReactTimeTravel = true;
   } else {
@@ -313,8 +299,22 @@ chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
   if (isReactTimeTravel && !(tabId in tabsObj)) {
     tabsObj[tabId] = createTabObj(tabTitle);
   }
-
   switch (action) {
+    case 'recordAXSnap': {
+      chrome.debugger.attach({ tabId: tabId }, '1.3', () => {
+        chrome.debugger.sendCommand({ tabId: tabId }, 'Accessibility.enable', () => {
+          chrome.debugger.sendCommand(
+            { tabId: tabId },
+            'Accessibility.getFullAXTree',
+            {},
+            (response) => {
+              console.log(response);
+              chrome.debugger.detach({ tabId: tabId });
+            },
+          );
+        });
+      });
+    }
     case 'attemptReconnect': {
       const success = 'portSuccessfullyConnected';
       sendResponse({ success });

src/extension/contentScript.ts

@@ -36,6 +36,11 @@ window.addEventListener('message', (msg) => {
   if (action === 'aReactApp') {
     chrome.runtime.sendMessage(msg.data);
   }
+  if (action === 'recordAXSnap') {
+    console.log('contentScript.ts: window received recordAXSnap');
+    // chrome.runtime.sendMessage({ action: 'recordAXSnap' });
+    chrome.runtime.sendMessage(msg.data);
+  }
 });
 
 // FROM BACKGROUND TO CONTENT SCRIPT