Complete testing for tree

Author: ngoczwolinski

src/backend/__tests__/masterTree.test.tsx

@@ -4,7 +4,7 @@ import componentActionsRecord from '../models/masterState';
 import createTree from '../controllers/createTree/createTree';
 import Tree from '../models/tree';
 import React, { useState } from 'react';
-import { serializeState, scrubUnserializableMembers } from '../models/tree';
+import { serializeState } from '../models/tree';
 import {
   allowedComponentTypes,
   nextJSDefaultComponent,

src/backend/__tests__/tree.test.ts

@@ -1,125 +1,102 @@
 import Tree from '../models/tree';
-import { serializeState, scrubUnserializableMembers } from '../models/tree';
-
-xdescribe('Serialize state unit test', () => {
-  const dummyState = {
-    counter: 1,
-    playerOne: 'X',
-    board: [
-      ['', 'O', 'X'],
-      ['', 'O', 'X'],
-      ['O', 'X', ''],
-    ],
-  };
-
-  const circularState: { [key: string]: any } = {};
-  circularState.circ = circularState;
-
-  const serializedState = serializeState(dummyState);
-  const serializedCircularState = serializeState(circularState);
+import { serializeState } from '../models/tree';
 
+describe('Serialize state unit test', () => {
   it('should create a deep copy of state', () => {
+    const dummyState = {
+      counter: 1,
+      playerOne: 'X',
+      board: [
+        ['', 'O', 'X'],
+        ['', 'O', 'X'],
+        ['O', 'X', ''],
+      ],
+    };
+    const serializedState = serializeState(dummyState);
     expect(dummyState).toEqual(serializedState);
     expect(dummyState).not.toBe(serializedState);
   });
 
   it('should detect circular state', () => {
+    const circularState: { [key: string]: any } = {};
+    circularState.circ = circularState;
+    const serializedCircularState = serializeState(circularState);
     expect(serializedCircularState).toEqual('circularState');
   });
 });
 
-xdescribe('Scrub unserialized members unit test', () => {
-  const dummyState = {
-    counter: 1,
-    playerOne: 'X',
-    board: [
-      ['', 'O', 'X'],
-      ['', 'O', 'X'],
-      ['O', 'X', ''],
-    ],
-    increment: function () {
-      this.counter++;
-    },
-  };
-  const newTree = new Tree(dummyState);
-  const scrubbedTree = scrubUnserializableMembers(newTree);
-  // make sure return type is tree
-  it('should be instance of tree', () => {
-    expect(newTree).toBeInstanceOf(Tree);
-  });
-  // make sure function is scrubbed
-});
-
-xdescribe('Tree unit test', () => {
-  const newTree = new Tree({});
-  describe('Constructor', () => {
+describe('Tree unit test', () => {
+  
+  describe('Constructing a default tree', () => {
+    const newTree: Tree = new Tree({});
     it('should be able to create a newTree', () => {
+      expect(newTree).toBeInstanceOf(Tree);
       expect(newTree.state).toEqual({});
     });
 
-    it('should have 7 properties', () => {
+    it('should have 6 properties', () => {
       expect(newTree).toHaveProperty('state');
       expect(newTree).toHaveProperty('name');
       expect(newTree).toHaveProperty('componentData');
       expect(newTree).toHaveProperty('children');
-      expect(newTree).toHaveProperty('parent');
       expect(newTree).toHaveProperty('isExpanded');
       expect(newTree).toHaveProperty('rtid');
     });
 
-    it('has name default value as stateless', () => {
+    it('should have default name, componentData, isExpanded and rtid', () => {
       expect(newTree.name).toBe('nameless');
-    });
-  });
-
-  xdescribe('Adding children', () => {
-    const returnChild: Tree = newTree.addChild('stateful', 'child', {}, null);
-
-    it("should have the child be in the children's array property", () => {
-      // check if returnChild is in the children array property of tree that invoked addChild
-      expect(newTree.children).toContain(returnChild);
+      expect(newTree.componentData).toEqual({});
+      expect(newTree.isExpanded).toBe(true);
+      expect(newTree.rtid).toBe(null);
     });
 
-    it("should have the object that invoked it be it's parent", () => {
-      // checking parent to be the tree that invoked addChild
-      expect(returnChild.parent).toEqual(newTree);
+    it('should have no children', () => {
+      expect(newTree.children).toHaveLength(0);
     });
+  });
 
-    it('parent now contains an array of children and each children is a valid tree', () => {
-      expect(newTree.children[0]).toHaveProperty('state');
-      expect(newTree.children[0]).toHaveProperty('name');
-      expect(newTree.children[0]).toHaveProperty('componentData');
+  describe('Constructing a tree root', () => {
+    const root: Tree = new Tree('root', 'root');
+    it("should have name as 'root' and state as 'root'", () => {
+      expect(root).toBeInstanceOf(Tree);
+      expect(root.state).toBe('root');
+      expect(root.name).toBe('root');
+      expect(root.componentData).toEqual({});
+      expect(root.isExpanded).toBe(true);
+      expect(root.rtid).toBe(null);
+      expect(root.children).toHaveLength(0);
     });
   });
 
-  xdescribe('Adding sibling', () => {
-    const newTreeCopy = new Tree({});
-    const returnChild = newTreeCopy.addChild('stateful', 'child', {}, null);
-    const returnSibling = returnChild.addSibling('stateful', 'child', {}, null);
-
-    it('the tree now has 2 children', () => {
-      expect(newTreeCopy.children.length).toBe(2);
+  describe('Adding children', () => {
+    const newTree: Tree = new Tree('root', 'root');
+    const child: Tree = newTree.addChild('stateful', 'child', {}, null);
+
+    it('should return a new tree child', () => {
+      expect(child).toBeInstanceOf(Tree);
+      expect(child).toBeInstanceOf(Tree);
+      expect(child.state).toBe('stateful');
+      expect(child.name).toBe('child');
+      expect(child.componentData).toEqual({});
+      expect(child.isExpanded).toBe(true);
+      expect(child.rtid).toBe(null);
+      expect(child.children).toHaveLength(0);
     });
 
-    it('both of the children has the parent as this tree', () => {
-      expect(returnChild.parent).toEqual(newTreeCopy);
-      expect(returnSibling.parent).toEqual(newTreeCopy);
+    it("should have the child be in the children's array property", () => {
+      expect(newTree.children).toHaveLength(1);
+      expect(newTree.children).toContain(child);
+      expect(newTree.children[0]).toBe(child);
     });
-  });
-
-  // TO DO- add serializing state tests
-  xdescribe('Serializing state unit test', () => {});
-  // review this test
-  // returnSibling not used?
-  // Check Test
 
-  xdescribe('Copy & clean tree', () => {
-    const newTreeLastCopy = new Tree({});
-    const returnChild = newTreeLastCopy.addChild('stateful', 'child', {}, null);
-    returnChild.addSibling('stateful', 'child', {}, null);
-    const copy = newTreeLastCopy.cleanTreeCopy();
-    it('its copy has 2 children', () => {
-      expect(copy.children.length).toEqual(2);
+    it('should have unique name', () => {
+      const nextChild1: Tree = child.addChild('stateful', 'child', {}, null);
+      const nextChild2: Tree = child.addChild('stateful', 'child', {}, null);
+      expect(child.children).toHaveLength(2);
+      expect(child.children[0]).toBe(nextChild1);
+      expect(child.children[1]).toBe(nextChild2);
+      expect(nextChild1.name).toBe('child1');
+      expect(nextChild2.name).toBe('child2');
     });
   });
 });

src/backend/models/tree.ts

@@ -1,29 +1,14 @@
-/* eslint-disable no-plusplus */
-/* eslint-disable max-len */
-/* eslint-disable @typescript-eslint/ban-types */
-/* eslint-disable no-multiple-empty-lines */
-/* eslint-disable max-classes-per-file */
-/* eslint-disable no-console */
-/* eslint-disable no-param-reassign */
 import { Route } from './routes';
 import { ComponentData } from '../types/backendTypes';
 
 // ComponentNames is used to store a mapping between a component's unique identifier and its name. This mapping is used to reconstruct the component instances during deserialization.
 let componentNames = {};
 
-// Functions dont serialize properly so we need to scrub for that
-export function scrubUnserializableMembers(tree: Tree): Tree {
-  Object.entries(tree.state).forEach((keyValuePair) => {
-    if (typeof keyValuePair[1] === 'function') tree.state[keyValuePair[0]] = 'function';
-  });
-  return tree;
-}
-
 // Making a deep clone of state becuase we want to make a copy
 /**
  * @function serializeState - In the context of React, state is often used to store data that determines the behavior and appearance of a component. By serializing the state, we can preserve the component's data across page refreshes, server-side rendering, and other transitions. Additionally, by serializing the state and passing it to a child component, we can create a deep clone of the state, which allows the child component to manipulate the state without affecting the original component. This is useful in situations where we want to keep the state of the parent component immutable, but still allow child components to modify a copy of the state.
  * @param state - Object that contains the current state of the application or system that needs to be serialized.
- * @returns
+ * @returns - Depclone of the passed in state. If there is any circulate state, return 'circularState'
  */
 export function serializeState(state) {
   try {
@@ -53,7 +38,7 @@ class Tree {
 
   name: string;
 
-  componentData: ComponentData;
+  componentData: ComponentData | {};
 
   children: Tree[];
 
@@ -74,11 +59,11 @@ class Tree {
   constructor(
     state: string | {},
     name = 'nameless',
-    componentData: {} = {},
+    componentData: ComponentData | {} = {},
     rtid: string | null = null,
   ) {
     this.children = [];
-    this.componentData = JSON.parse(JSON.stringify(componentData));
+    this.componentData = componentData;
     this.state = state === 'root' ? 'root' : serializeState(state);
     this.name = name;
     this.rtid = rtid;
@@ -118,7 +103,12 @@ class Tree {
    * @param rtid - ??
    * @returns - return new tree instance that is child
    */
-  addChild(state: string | {}, name: string, componentData: {}, rtid: any): Tree {
+  addChild(
+    state: Tree['state'],
+    name: Tree['name'],
+    componentData: Tree['componentData'],
+    rtid: Tree['rtid'],
+  ): Tree {
     // Get unique name by invoking checkForDuplicates method
     const uniqueName = this.checkForDuplicates(name);
     // Instantiates new child Tree with state, uniqueName, componentData and rtid