Merge pull request #75 from oslabs-beta/staging

Staging

Author: crperezt

src/backend/linkFiber.ts

@@ -37,12 +37,14 @@ import 'core-js';
 // const Tree = require('./tree').default;
 // const componentActionsRecord = require('./masterState');
 
-import { Snapshot, Mode, SnapshotNode, MsgData, ComponentData, HookStates, Fiber, WorkTag, State } from './types/backendTypes'
+import {
+ Snapshot, Mode, SnapshotNode, MsgData, ComponentData, HookStates, Fiber, WorkTag, State
+} from './types/backendTypes';
 import Tree from './tree';
 import componentActionsRecord from './masterState';
 import { throttle, getHooksNames } from './helpers';
 
-let doWork: boolean = true;
+let doWork = true;
 const circularComponentTable = new Set();
 
 // module.exports = (snap, mode) => {
@@ -57,7 +59,7 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
       snap.tree = new Tree('root', 'root');
     }
     const payload = snap.tree.cleanTreeCopy();// snap.tree.getCopy();
-  
+
     window.postMessage({
       action: 'recordSnap',
       payload,
@@ -86,7 +88,7 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
   }
 
   // This runs after every Fiber commit. It creates a new snapshot
-  function createTree(currentFiber: Fiber, tree: Tree = new Tree('root', 'root'), fromSibling: boolean = false) {
+  function createTree(currentFiber: Fiber, tree: Tree = new Tree('root', 'root'), fromSibling = false) {
     // Base case: child or sibling pointed to null
     if (!currentFiber) return null;
     if (!tree) return tree;
@@ -108,7 +110,7 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
 
     let newState: any;
     let componentData: ComponentData;
-    let componentFound: boolean = false;
+    let componentFound = false;
 
     // Check if node is a stateful setState component
     if (stateNode && stateNode.state && (tag === 0 || tag === 1 || tag === 2)) {
@@ -144,7 +146,7 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
     }
 
     // This grabs stateless components
-    
+
     if (!componentFound && (tag === 0 || tag === 1 || tag === 2)) {
       newState = 'stateless';
     }
@@ -160,7 +162,7 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
 
     let newNode = null;
     // We want to add this fiber node to the snapshot
-    const snapshotState = newState.state || newState.hooksState ;
+    //const snapshotState = newState.state || newState.hooksState;
     if (componentFound || newState === 'stateless') {
       if (fromSibling) {
         newNode = tree.addSibling(newState,
@@ -175,7 +177,7 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
       newNode = tree;
     }
 
-    // Recurse on children    
+    // Recurse on children
     if (child && !circularComponentTable.has(child)) {
       // If this node had state we appended to the children array,
       // so attach children to the newly appended child.
@@ -206,7 +208,7 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
     console.log('doWork is:', doWork);
   }
 
-  return () => {    
+  return () => {
 /*     const container = document.getElementById('root');
     if (container._internalRoot) {
       fiberRoot = container._internalRoot;
@@ -223,7 +225,7 @@ export default (snap: Snapshot, mode: Mode): ()=>void => {
     const reactInstance = devTools ? devTools.renderers.get(1) : null;
     fiberRoot = devTools.getFiberRoots(1).values().next().value;
     const throttledUpdateSnapshot = throttle(updateSnapShotTree, 140);
-    
+
     document.addEventListener('visibilitychange', onVisibilityChange);
     if (reactInstance && reactInstance.version) {
       devTools.onCommitFiberRoot = (function (original) {

src/backend/tree.ts

@@ -5,10 +5,10 @@ import 'core-js';
 /* eslint-disable no-param-reassign */
 
 // import * as reactWorkTags from './reactWorkTags';
-//const Flatted = require('flatted');
+// const Flatted = require('flatted');
 
-let copyInstances: number = 0;
-const circularComponentTable = new Set<Tree> ();
+let copyInstances = 0;
+const circularComponentTable = new Set<Tree>();
 
 // removes unserializable state data such as functions
 function scrubUnserializableMembers(tree: Tree): Tree {
@@ -21,26 +21,31 @@ function scrubUnserializableMembers(tree: Tree): Tree {
 // this is the current snapshot that is being sent to the snapshots array.
 class Tree {
   state: string | {};
+
   name: string;
+
   componentData: {};
+
   children: (Tree | string)[] ;
+
   parent: Tree
-  constructor(state : string | {}, name: string = 'nameless', componentData: {} = {}) {
+
+  constructor(state : string | {}, name = 'nameless', componentData: {} = {}) {
     this.state = state === 'root' ? 'root' : JSON.parse(JSON.stringify(state));
     this.name = name;
     this.componentData = componentData ? JSON.parse(JSON.stringify(componentData)) : {};
     this.children = [];
     this.parent = null; // ref to parent so we can add siblings
   }
 
-  addChild(state: string | {} , name: string, componentData: {}): Tree {
+  addChild(state: string | {}, name: string, componentData: {}): Tree {
     const newChild: Tree = new Tree(state, name, componentData);
     newChild.parent = this;
     this.children.push(newChild);
     return newChild;
   }
 
-  addSibling(state: string | {} , name: string, componentData: {}): Tree {
+  addSibling(state: string | {}, name: string, componentData: {}): Tree {
     const newSibling: Tree = new Tree(state, name, componentData);
     newSibling.parent = this.parent;
     this.parent.children.push(newSibling);
@@ -62,14 +67,14 @@ class Tree {
     // copy.children = this.children;
 
     // creates copy of each child of the present node
-    
+
     copy.children = this.children.map((child: Tree): Tree | string => {
-        if (!circularComponentTable.has(child)) {
-         return child.cleanTreeCopy();
-        }
-        return 'circular';
+      if (!circularComponentTable.has(child)) {
+        return child.cleanTreeCopy();
+      }
+      return 'circular';
     });
-    
+
 
     // returns copy
     copyInstances--;