completed testing for routes

Author: Zachary Freeman

src/backend/__tests__/masterState.test.ts

@@ -116,6 +116,7 @@ describe('Master State unit tests', () => {
           component2,
           component3,
         ]);
+        expect(window.location.href).toBeTruthy();
       });
 
       it('should return undefined when passed an empty array', () => {

src/backend/__tests__/routes.test.ts

@@ -1,56 +1,90 @@
 import { Routes, Route } from '../models/routes';
 
-describe('Route class', () => {
-  it('should create a new instance of Route class', () => {
-    const route = new Route('/home', 1);
-    expect(route.url).toBe('/home');
-    expect(route.id).toBe(1);
-  });
-});
-
-describe('Routes class', () => {
+describe('Route class testing', () => {
   let routes: Routes;
 
   beforeEach(() => {
     routes = new Routes();
+    window.history.replaceState = jest.fn();
+    window.history.pushState = jest.fn();
   });
 
-  it('should add a new route to the route history array', () => {
-    const route = routes.addRoute('/home');
-    expect(route.url).toBe('/home');
-    expect(routes.routeHistory).toHaveLength(2);
+  describe('Route initialization', () => {
+    it('should create a new instance of Route class', () => {
+      const route = new Route('/home', 1);
+      expect(route.url).toBe('/home');
+      expect(route.id).toBe(1);
+    });
   });
 
-  it('should return the current route if the user has not navigated away from it', () => {
-    const route = routes.addRoute('/home');
-    const currentRoute = routes.addRoute('/home');
-    expect(currentRoute).toEqual(route);
-    expect(routes.routeHistory).toHaveLength(2);
-  });
+  describe('Routes class addRoute and navigate methods', () => {
+    it('should add a new route to the route history array', () => {
+      const route = routes.addRoute('/home');
+      expect(route.url).toBe('/home');
+      expect(route.id).toBe(1);
+      expect(routes.routeHistory).toHaveLength(2);
+    });
 
-  it('should rebuild the browser history when adding a new route', () => {
-    window.history.pushState = jest.fn();
-    window.history.replaceState = jest.fn();
-    routes.addRoute('/home');
-    expect(window.history.replaceState).toHaveBeenCalled();
-    expect(window.history.pushState).toHaveBeenCalled();
-  });
+    it('should add multiple routes to the route history array', () => {
+      const route = routes.addRoute('/home');
+      const route2 = routes.addRoute('/about');
+      expect(route.url).toBe('/home');
+      expect(route.id).toBe(1);
+      expect(route2.url).toBe('/about');
+      expect(route2.id).toBe(2);
+      expect(routes.routeHistory).toHaveLength(3);
+    });
+
+    it('should return the current route if the user has not navigated away from it', () => {
+      const route = routes.addRoute('/home');
+      const currentRoute = routes.addRoute('/home');
+      expect(currentRoute).toEqual(route);
+      expect(routes.routeHistory).toHaveLength(2);
+    });
+
+    it('should navigate to the target route in the route history stack', () => {
+      const homeRoute = routes.addRoute('/home');
+      const aboutRoute = routes.addRoute('/about');
+      const result = routes.navigate(homeRoute);
+      expect(result).toBe(true);
+      expect(routes.current).toBe(1);
+      const result2 = routes.navigate(aboutRoute);
+      expect(result2).toBe(true);
+      expect(routes.current).toBe(2);
+    });
+
+    it('should not navigate to the target route if it is the current route', () => {
+      const homeRoute = routes.addRoute('/home');
+      const result = routes.navigate(homeRoute);
+      expect(result).toBe(false);
+      expect(routes.current).toBe(1);
+    });
 
-  it('should navigate to the target route in the route history stack', () => {
-    const homeRoute = routes.addRoute('/home');
-    const aboutRoute = routes.addRoute('/about');
-    const result = routes.navigate(homeRoute);
-    expect(result).toBe(true);
-    expect(routes.current).toBe(1);
-    const result2 = routes.navigate(aboutRoute);
-    expect(result2).toBe(true);
-    expect(routes.current).toBe(2);
+    it('should throw an error if target route is not found', () => {
+      const dummyRoute: Route = new Route('/dummy', 0);
+      expect(routes.navigate(dummyRoute)).toThrowError();
+    });
   });
 
-  it('should not navigate to the target route if it is the current route', () => {
-    const homeRoute = routes.addRoute('/home');
-    const result = routes.navigate(homeRoute);
-    expect(result).toBe(false);
-    expect(routes.current).toBe(1);
+  describe('Routes rebuildHistory method', () => {
+    describe('rebuildHistory', () => {
+      it('should replace the current URL in the history stack with the given URL', () => {
+        // Mock the `routeHistory` array with three routes
+        const route1 = new Route('/home', 0);
+        const route2 = new Route('/about', 1);
+        const route3 = new Route('/contact', 2);
+        const route4 = new Route('/portfolio', 3);
+        routes.routeHistory = [route1, route2, route3, route4];
+        // Set current route to 2nd page and try to add the home page
+        routes.current = 1;
+        // Add home page
+        routes.addRoute(route1.url);
+        // Expect the `replaceState` method to have been called with the URL of the third route
+        expect(window.history.replaceState).toHaveBeenCalledWith('', '', route3.url);
+        // Expect the `pushState` method to have been called with the URL of the third route
+        expect(window.history.pushState).toHaveBeenCalledWith('', '', route4.url);
+        expect(window.history.pushState).toHaveBeenCalledWith('', '', route1.url);
+      });
+    });
   });
 });

src/backend/models/masterState.ts

@@ -1,8 +1,3 @@
-/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
-
-/* eslint-disable no-plusplus */
-/* eslint-disable guard-for-in */
-/* eslint-disable no-restricted-syntax */
 /**
  * @type ComponentAction - an array of actions that can be performed on a component
  */

src/backend/models/routes.ts

@@ -47,7 +47,7 @@ export class Routes {
     const currentRoute: Route = this.routeHistory[this.current];
     // Check if the new url is different from the current url
     const isNavigating = currentRoute.url !== url;
-
+    console.log('IsNavigating ', isNavigating);
     if (isNavigating) {
       // Check if current is not equal to routeHistory.length - 1 becuase if it doesnt, we need to rebuild history
       if (this.current !== this.routeHistory.length - 1) {
@@ -65,28 +65,6 @@ export class Routes {
     }
     // If the new url is the same as the current url, return the current route
     return currentRoute;
-
-    // Create a new Route
-
-    // // Obtain the last visited route within routeHistory stack
-    // let route: Route = this.routeHistory[this.current];
-
-    // // If the passed in window url does not match with the last visited route
-    // // => user has navigated to another route
-    // if (route.url !== url) {
-    //   // If the last visited index is not the last position in routeHistory stack. This happens when user uses the timeJump functionality.
-    //   // => Rebuild the browserHistory
-    //   if (this.current !== this.routeHistory.length - 1) {
-    //     this.rebuildHistory(url);
-    //   }
-    //   // Create a new route instance from the passed in url.
-    //   route = new Route(url, (this.id += 1));
-    //   // Push the new route to routeHistory stack.
-    //   this.routeHistory.push(route);
-    //   // Update the last visited index.
-    //   this.current = this.routeHistory.length - 1;
-    // }
-    // return route;
   }
 
   /**
@@ -96,6 +74,7 @@ export class Routes {
    * Rebuilds the browser history stack using the copy of the stack maintained in the `routeHistory` stack. https://developer.mozilla.org/en-US/docs/Web/API/History/replaceState, https://developer.mozilla.org/en-US/docs/Web/API/History/pushState
    */
   private rebuildHistory(url: string): void {
+    console.log('RebuildHistory Called');
     // Replace window history with the next route
     window.history.replaceState('', '', this.routeHistory[this.current + 1].url);
     // For each route in routeHistory after the next route, add to window history
@@ -137,35 +116,6 @@ export class Routes {
     }
     // If the difference is 0, return false to indicate that no navigation occurred
     return false;
-
-    // let targetIndex: number | undefined;
-    // // Loop through the routeHistory stack
-    // for (let i = 0; i < this.routeHistory.length; i += 1) {
-    //   // If within the route history, found a match of url & id from the passed in route, update `targetIndex`
-    //   if (this.routeHistory[i].url === route.url && this.routeHistory[i].id === route.id) {
-    //     targetIndex = i;
-    //   }
-    // }
-
-    // if (typeof targetIndex === 'undefined') {
-    //   throw Error('Error at Routes.navigage: targetIndex is undefined');
-    // }
-    // /**
-    //  * The position in the window history to which you want to move, relative to the current page. A negative value moves backwards, a positive value moves forwards.
-    //  */
-    // console.log({ targetIndex, current: this.current, history: this.routeHistory });
-    // const delta: number = targetIndex - this.current;
-
-    // // Update the position within routeHistory stack
-    // this.current += delta;
-
-    // // if delta != 0 => need to navigate to another page
-    // if (delta !== 0) {
-    //   // Navigate to that page based on delta steps
-    //   window.history.go(delta);
-    //   return true;
-    // }
-    // return false;
   }
 }