fixed eslint issues

Co-authored-by: Ruth <ruthbaanam@GMAIL.com>
Co-authored-by: Andy Wong <andywong.ny@gmail.com>

Author: nusanam

package/__tests__/astParser.test.js

@@ -1,7 +1,7 @@
-import { exportAllDeclaration } from "@babel/types"
-import { configure, shallow } from 'enzyme';
+// import { configure, shallow } from 'enzyme';
 
-// Test 1: Should take in a function definition with 1 hook and return an object with the getter/setter
+// Test 1: Should take in a function definition with 1 hook
+// and return an object with the getter / setter
 // EXAMPLE INPUT FOR TEST
 /**
  * function UseStateHookTest() {
@@ -25,13 +25,14 @@ import { configure, shallow } from 'enzyme';
  * }
  */
 
- // TEST 2: Should take in multiple function definitions with hooks and return an object with all 4 properties
- // TEST 3: Should ignore any non-hook definitions
- // Test 4: Should return an empty object if no hooks found
- // Test 5: Should throw an error if input is invalid javascript
+// TEST 2: Should take in multiple function definitions
+// with hooks and return an object with all 4 properties
+// TEST 3: Should ignore any non-hook definitions
+// Test 4: Should return an empty object if no hooks found
+// Test 5: Should throw an error if input is invalid javascript
 
 describe('placeholder', () => {
-  xit('placeholder for tests', () => {
+  it.skip('placeholder for tests', () => {
     expect(1 + 1).toEqual(2);
-  })
-})
+  });
+});

package/__tests__/linkFiber.test.js

@@ -1,5 +1,5 @@
 /* eslint-disable react/jsx-filename-extension */
-import React, { Component, useState } from 'react';
+import React, { Component } from 'react';
 import { render } from 'react-dom';
 
 const linkFiberRequire = require('../linkFiber');
@@ -20,12 +20,12 @@ class App extends Component {
   }
 }
 
-// Need to create a functioanl component instance to test 
+// Need to create a functioanl component instance to test
 // Would need to be revised but here's the gist
 // const funcComponent = () => {
-//     const [ number, setNumber ] = useState(0); 
-//     const newNumber = setNumber(1); 
-    
+//     const [ number, setNumber ] = useState(0);
+//     const newNumber = setNumber(1);
+
 //     return (
 //       <div>{newNumber}</div>
 //     )

package/__tests__/timeJump.test.js

@@ -1,3 +1,4 @@
+/* eslint-disable max-classes-per-file */
 const timeJumpRequire = require('../timeJump');
 
 class Component {
@@ -19,8 +20,8 @@ class FiberNode {
   }
 }
 
-// MVP FEATURE: Additional Testing 
-// Testing for useState and useContext 
+// MVP FEATURE: Additional Testing
+// Testing for useState and useContext
 
 
 describe('unit testing for timeJump.js', () => {

package/astParser.js

@@ -1,11 +1,12 @@
 const acorn = require('acorn');
 const jsx = require('acorn-jsx');
+
 const JSXParser = acorn.Parser.extend(jsx());
 
 // Helper function to grab the getters/setters from `elementType`
 module.exports = elementType => {
   // Initialize empty object to store the setters and getter
-  let ast = JSXParser.parse(elementType); 
+  let ast = JSXParser.parse(elementType);
   const hookState = {};
   // All module exports will always start off as a single 'FunctionDeclaration' type
   while (Object.hasOwnProperty.call(ast, 'body')) {
@@ -34,4 +35,4 @@ module.exports = elementType => {
     });
   }
   return hookState;
-}
+};

package/linkFiber.js

@@ -13,7 +13,8 @@ module.exports = (snap, mode) => {
 
   function sendSnapshot() {
     // don't send messages while jumping or while paused
-    // DEV: So that when we are jumping to an old snapshot it wouldn't think we want to create new snapshots
+    // DEV: So that when we are jumping to an old snapshot it
+    // wouldn't think we want to create new snapshots
     if (mode.jumping || mode.paused) return;
     const payload = snap.tree.getCopy();
     // console.log('payload', payload);
@@ -83,7 +84,7 @@ module.exports = (snap, mode) => {
 
   function createTree(currentFiber, tree = new Tree('root')) {
     if (!currentFiber) return tree;
-   
+
     const {
       sibling,
       stateNode,
@@ -103,9 +104,9 @@ module.exports = (snap, mode) => {
     // Check if the component uses hooks
     if (memoizedState && Object.hasOwnProperty.call(memoizedState, 'baseState')) {
       // Traverse through the currentFiber and extract the getters/setters
-      astHooks = astParser(elementType); 
-      saveState(astHooks); 
-      // Create a traversed property and assign to the evaluated result of 
+      astHooks = astParser(elementType);
+      saveState(astHooks);
+      // Create a traversed property and assign to the evaluated result of
       // invoking traverseHooks with memoizedState
       memoizedState.traversed = traverseHooks(memoizedState);
       nextTree = tree.appendChild(memoizedState);
@@ -131,7 +132,7 @@ module.exports = (snap, mode) => {
     } = container;
     // only assign internal rootp if it actually exists
     fiberRoot = _internalRoot || _reactRootContainer;
-  
+
     updateSnapShotTree();
     // send the initial snapshot once the content script has started up
     window.addEventListener('message', ({ data: { action } }) => {
@@ -145,5 +146,5 @@ module.exports = (snap, mode) => {
     // return getNextImport('./UseStateHook');
     // return 'Testing outside';
     // const OtherComponent = loadable(() => import('./OtherComponent'))
-  }
-};
+  };
+};

src/app/__tests__/Chart.test.jsx

@@ -21,7 +21,7 @@
 // Should call function 'update' at least once
 
 describe('placeholder', () => {
-  xit('placeholder for tests', () => {
+  it.skip('placeholder for tests', () => {
     expect(1 + 1).toEqual(2);
-  })
-})
+  });
+});

src/app/__tests__/switchState.test.jsx

@@ -1,17 +1,17 @@
-import React from 'react'; 
-import { configure, shallow } from 'enzyme';
-import SwitchState from '../components/SwitchState'; 
+// import React from 'react';
+// import { configure, shallow } from 'enzyme';
+// import SwitchState from '../components/SwitchState';
 
-// Should describe unit testing for SwitchState 
-    // Should create a shallow copy of SwitchState 
-    // The component should have an array of objects that have value 
-    // and the label should be the name of the state being captured 
-    
-    // If the label is selected, it should only display relevant components with the same state name
+// Should describe unit testing for SwitchState
+// Should create a shallow copy of SwitchState
+// The component should have an array of objects that have value
+// and the label should be the name of the state being captured
+
+// If the label is selected, it should only display relevant components with the same state name
 
 
 describe('placeholder', () => {
-    xit('placeholder for tests', () => {
-      expect(1+1).toEqual(2);
-    })
-  })
+  it.skip('placeholder for tests', () => {
+    expect(1 + 1).toEqual(2);
+  });
+});

src/app/components/Action.jsx

@@ -4,8 +4,8 @@ import PropTypes from 'prop-types';
 import { changeView, changeSlider } from '../actions/actions';
 
 // Launch Feature: Figure out changeView vs changeSlider
-// Should we make the btn bigger instead and keep the functionality? 
-// div onclick event triggers the changeView method 
+// Should we make the btn bigger instead and keep the functionality?
+// div onclick event triggers the changeView method
 
 const Action = props => {
   const {

src/app/components/Diff.jsx

@@ -6,7 +6,7 @@ import ReactHtmlParser from 'react-html-parser';
 import { useStoreContext } from '../store';
 
 function Diff({ snapshot, show }) {
-  const [ mainState ] = useStoreContext();
+  const [mainState] = useStoreContext();
   const { currentTab, tabs } = mainState;
   const { snapshots, viewIndex, sliderIndex } = tabs[currentTab];
   let previous;
@@ -27,7 +27,7 @@ function Diff({ snapshot, show }) {
   if (previous === undefined || delta === undefined) return <div> No state change detected. </div>;
   return (
     <div>
-      { ReactHtmlParser(html) }
+      {ReactHtmlParser(html)}
     </div>
   );
 }

src/app/components/StateRoute.jsx

@@ -7,6 +7,7 @@ import {
 import Chart from './Chart';
 import Tree from './Tree';
 
+// eslint-disable-next-line react/prop-types
 const StateRoute = ({ snapshot, hierarchy }) => (
   <Router>
     <div className="navbar">