removed recordAXSnap switch case

Author: Oliver-Cho

jest.config.js

@@ -22,7 +22,7 @@ module.exports = {
   transformIgnorePatterns: ['/node_modules/(?!d3|d3-array|internmap|delaunator|robust-predicates)'],
   testRegex: '(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$',
   moduleFileExtensions: ['ts', 'tsx', 'js'],
-  setupFilesAfterEnv: ['@testing-library/jest-dom/extend-expect'],
+  setupFilesAfterEnv: ['@testing-library/jest-dom'],
   testEnvironment: 'jsdom',
   moduleNameMapper: {
     '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':

package.json

@@ -139,11 +139,13 @@
     "eslint-plugin-testing-library": "^6.2.0",
     "html-webpack-plugin": "^5.5.4",
     "identity-obj-proxy": "^3.0.0",
+    "jest": "^29.7.0",
     "jsdom": "^23.0.1",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.21.1",
     "sass-loader": "^13.3.2",
     "style-loader": "^3.3.3",
+    "ts-jest": "^29.1.2",
     "ts-loader": "^9.5.1",
     "typedoc": "^0.25.4",
     "typescript": "^5.3.3",
@@ -177,6 +179,7 @@
     "html-react-parser": "^5.0.11",
     "intro.js": "^7.2.0",
     "intro.js-react": "^1.0.0",
+    "jest-environment-jsdom": "^29.7.0",
     "jsondiffpatch": "^0.5.0",
     "lodash": "^4.17.21",
     "node": "^18.12.1",

src/backend/routers/linkFiber.ts

@@ -100,6 +100,13 @@ export default function linkFiber(mode: Status): () => Promise<void> {
       },
       '*',
     );
+    window.postMessage(
+      {
+        action: 'recordAXSnap',
+        payload: 'recordAXSnap',
+      },
+      '*',
+    );
     // --------------INITIATE EVENT LISTENER FOR VISIBILITY CHANGE--------------
     /**
      * Initiate an event listener for when there is a change to the visibility of the react target application (the browser tab)

src/extension/background.js

@@ -13,6 +13,39 @@ let activeTab;
 const tabsObj = {};
 // Will store Chrome web vital metrics and their corresponding values.
 const metrics = {};
+
+// function pruning the chrome ax tree and pulling the relevant properties
+const pruneAxTree = (axTree) => {
+  const axArr = [];
+  for (const node of axTree) {
+    const {
+      backendDOMNodeId,
+      childIds,
+      ignored,
+      name,
+      nodeId,
+      ignoredReasons,
+      parentId,
+      properties,
+    } = node;
+
+    const axNode = {
+      backendDOMNodeId: backendDOMNodeId,
+      childIds: childIds,
+      ignored: ignored,
+      name: name,
+      nodeId: nodeId,
+      ignoredReasons: ignoredReasons,
+      parentId: parentId,
+      properties: properties,
+    };
+
+    axArr.push(axNode);
+  }
+
+  return axArr;
+};
+
 // This function will create the first instance of the test app's tabs object
 // which will hold test app's snapshots, link fiber tree info, chrome tab info, etc.
 function createTabObj(title) {
@@ -26,6 +59,9 @@ function createTabObj(title) {
     // snapshots is an array of ALL state snapshots for stateful and stateless
     // components the Reactime tab working on a specific user application
     snapshots: [],
+    // axSnapshots is an array of the chrome ax tree at different points for state and stateless applications
+    // functionality to add snapshots is done later
+    axSnapshots: [],
     // index here is the tab index that shows total amount of state changes
     index: 0,
     //* currLocation points to the current state the user is checking