refactor

Author: Rocky Lin

package/astParser.js

@@ -15,13 +15,13 @@ module.exports = elementType => {
     ast = ast.body;
     const statements = [];
 
-    function stMent(st) {
+    function saveAstHooks(st) {
       st.forEach((el, i) => {
         if (el.match(/_use/)) hookState[el] = statements[i + 2];
       });
     }
 
-    function hookDeclare(astVal) {
+    function findHookDeclarations(astVal) {
       astVal.forEach(elem => {
         if (elem.type === 'VariableDeclaration') {
           elem.declarations.forEach(decClar => {
@@ -35,18 +35,19 @@ module.exports = elementType => {
     if (ast[0].expression.body.body) {
       ast = ast[0].expression.body.body;
       // Hook Declarations will only be under 'VariableDeclaration' type
-      hookDeclare(ast);
+      findHookDeclarations(ast);
       // Iterate array and determine getter/setters based on pattern
-      stMent(statements); // add key-value to hookState
+      saveAstHooks(statements); // add key-value to hookState
     } else {
+      // TODO test if this is needed, backward compatibility?
       // Iterate through AST of every function declaration
       // Check within each function declaration if there are hook declarations
       ast.forEach(functionDec => {
         const { body } = functionDec.body;
         // Traverse through the function's funcDecs and Expression Statements
-        hookDeclare(body);
+        findHookDeclarations(body);
         // Iterate array and determine getter/setters based on pattern
-        stMent(statements); // add key-value to hookState
+        saveAstHooks(statements); // add key-value to hookState
       });
     }
   }

package/index.js

@@ -9,10 +9,17 @@ const mode = {
 const linkFiber = require('./linkFiber')(snapShot, mode);
 const timeJump = require('./timeJump')(snapShot, mode);
 
-window.addEventListener('message', ({ data: { action, payload } }) => { //runs automatically twice per second with inspectedElement
+window.addEventListener('message', ({ data: { action, payload } }) => {
+  //runs automatically twice per second with inspectedElement
   switch (action) {
     case 'jumpToSnap':
       timeJump(payload);
+      // Get the pathname from payload and add new entry to browser history
+      // MORE: https://developer.mozilla.org/en-US/docs/Web/API/History/pushState
+      if (payload.children[0].state && payload.children[0].state.location) {
+        const route = payload.children[0].state.location.pathname;
+        window.history.pushState('', '', route);
+      }
       break;
     case 'setLock':
       mode.locked = payload;

package/linkFiber.js

@@ -71,16 +71,12 @@ module.exports = (snap, mode) => {
     astHooks = Object.values(astHooks);
     // while memoizedState is truthy, save the value to the object
     while (memoizedState && memoizedState.queue) {
-      // prevents useEffect from crashing on load
-      // if (memoizedState.next.queue === null) { // prevents double pushing snapshot updates
       changeUseState(memoizedState);
-      // }
-      // memoized[astHooks[index]] = memoizedState.memoizedState;
+
       memoized[astHooks[index]] = memoizedState.memoizedState;
       // Reassign memoizedState to its next value
       memoizedState = memoizedState.next;
-      // Increment the index by 2
-      index += 2;
+      index += 2; // Increment the index by 2
     }
     return memoized;
   }