UI components cleaned up, package.json keywords updated, basic test case format added tbc

Author: yujinkay

package.json

@@ -12,8 +12,10 @@
   },
   "keywords": [
     "react",
-    "time",
-    "time travel",
+    "useState",
+    "state",
+    "debug",
+    "react dev tool",
     "reactime"
   ],
   "repository": {

src/app/__tests__/Chart.test.jsx

@@ -1,26 +1,50 @@
-const TestRunner = require("jest-runner")
-
-// Unit Test Cases for Charts
-  // description: lifecycle methods
-    // Component should call make3dTree upon mounting
-    // object 'root' should be a deep clone of the snapshot
-      // i.e.: this.props.snapshot !== root
-
-  // description: maked3Tree
-    // Should call function 'removed3tree' only once
-    // Should call appropriate function upon triggering a certain event on the tooltip div
-      // i.e.:
-      // 'mouseover' event -> 'tipMouseover' function
-      // 'mouseout' event -> 'tipMouseout' function
-    // Should call appropriate function upon triggering a certain event on a node (nested under the 'update' function)
-      // i.e.:
-      // 'mouseover' event -> 'mouseover' function
-      // 'mouseout' event -> 'mouseout' function
-      // 'click' event -> 'click' function
-    // Should call function 'update' at least once
-
-    describe('placeholder', () => {
-      xit('placeholder for tests', () => {
-        expect(1+1).toEqual(2);
-      })
-    })
+import React from 'react'; 
+import Chart from '../components/Chart'; 
+import testRunner from 'jest-runner'; 
+
+// Unit test cases for d3 functionality 
+// Test the life cycle methods in Chart
+describe('Life cycle methods in Chart', () => {
+  it('should call maked3Tree upon mounting', () => {
+    // Component should call maked3Tree upon mounting
+    // Use the mock function + .toBeCalled()
+   // Test the method in the component 
+  }); 
+}); 
+
+// Test the root object and hierarchy 
+describe('Root object', () => {
+  it('should be a deep clone of the hierarchy', () => {
+    // object 'root' should be a deep clone of the hierarchy
+    // create an empty object to mimic root 
+      // i.e.: this.props.hierarchy !== root
+      // expect to !== this.props.hierarchy 
+      // expect to be a deep clone 
+  }); 
+}); 
+
+// Test the maked3Tree method 
+describe('maked3Tree method', () => {
+  it('should call removed3tree once', () => {
+ // Should call function 'removed3tree' only once
+    // expect toBeCalled()
+    // expect toHaveBeenCalled()
+  }); 
+}); 
+// Test the tooltip functionality in maked3Tree method 
+describe('tooltip functionality in maked3Tree', () => {
+// Should call appropriate function upon triggering 
+// a certain event on the tooltip div
+  // Should call appropriate function upon triggering mouseOver
+  it('should invoke tip.show on mouseOver', () => {
+
+  }); 
+  // Should call appropriate function upon triggering mouseOut
+  it ('should invoke tip.hide on mouseOut', () => {
+
+  }); 
+}); 
+
+
+
+    

src/app/__tests__/switchState.test.jsx

@@ -3,9 +3,9 @@
 /* eslint-disable no-use-before-define */
 /* eslint-disable react/no-string-refs */
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
+//import PropTypes from 'prop-types';
 import * as d3 from 'd3';
-import d3Tip from "d3-tip";
+import d3Tip from 'd3-tip';
 
 let root = {};
 class Chart extends Component {

src/app/components/Chart.jsx

@@ -1,6 +1,5 @@
 /* eslint-disable react/no-array-index-key */
 import React from 'react';
-//import SwitchStateDropdown from '../components/SwitchState'; 
 import Action from '../components/Action';
 
 import { emptySnapshots } from '../actions/actions';