updated tests to reflect the ts files

Author: jasnoo

src/app/__tests__/ActionContainer.test.tsx

@@ -106,10 +106,11 @@ const state = {
 };
 
 const dispatch = jest.fn();
-const resetSlider = jest.fn();
 jest.spyOn(React, 'useEffect').mockImplementation(() => jest.fn());
 jest.mock('../store');
-useStoreContext.mockImplementation(() => [state, dispatch]);
+
+const mockeduseStoreContext = jest.mocked(useStoreContext);
+mockeduseStoreContext.mockImplementation(() => [state, dispatch]);
 
 const MockRouteDescription = jest.fn();
 jest.mock('../components/RouteDescription', () => () => {
@@ -125,7 +126,7 @@ jest.mock('../components/SwitchApp', () => () => {
 
 describe('unit testing for ActionContainer', () => {
   beforeEach(() => {
-    useStoreContext.mockClear();
+    mockeduseStoreContext.mockClear();
     dispatch.mockClear();
     render(<ActionContainer actionView={true} />);
   });

src/app/__tests__/ButtonContainer.test.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { render, screen, fireEvent } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
 import '@testing-library/jest-dom/extend-expect'; // needed this to extend the jest-dom assertions  (ex toHaveTextContent)
 import { TextEncoder } from 'util';
 global.TextEncoder = TextEncoder;
@@ -9,18 +8,12 @@ import { useStoreContext } from '../store';
 
 // const { Steps } = require('intro.js-react');
 jest.mock('../store');
+const mockedUsedStoreContext = jest.mocked(useStoreContext);
+// useStoreContext as jest.Mock<useStoreContext>.mockImplementaton(() => [state, dispatch])
 
 global.URL.createObjectURL = jest.fn(() => 'https://pdf.com');
 global.URL.revokeObjectURL = jest.fn();
 
-const fileDownload = {
-  href: jest.fn(),
-};
-
-const URL = { revokeObjectURL: jest.fn() };
-// @ts-ignore
-// jest.spyOn(document, 'createElement').mockImplementation(() => fileDownload);
-
 describe('Unit testing for ButtonContainer', () => {
   beforeEach;
 
@@ -46,11 +39,12 @@ describe('Unit testing for ButtonContainer', () => {
   const importHandler = jest.fn();
   const fileDownload = jest.fn();
 
-  useStoreContext.mockImplementation(() => [state, dispatch]);
+  mockedUsedStoreContext.mockImplementation(() => [state, dispatch]);
+  // useStoreContext.mockImplementation(() => [state, dispatch]);
 
   beforeEach(() => {
     dispatch.mockClear();
-    useStoreContext.mockClear();
+    mockedUsedStoreContext.mockClear();
     currentTab.mode = {
       paused: false,
       persist: false,

src/app/__tests__/ErrorContainer.test.tsx

@@ -17,8 +17,10 @@ jest.mock('../components/ErrorMsg', () => () => {
 });
 
 jest.mock('../store');
+const mockeduseStoreContext = jest.mocked(useStoreContext);
+
 const dispatch = jest.fn();
-useStoreContext.mockImplementation(() => [state, dispatch]);
+mockeduseStoreContext.mockImplementation(() => [state, dispatch]);
 
 describe('unit testing for ErrorContainer.tsx', () => {
   test('logo image renders as expected', () => {

src/app/__tests__/MainContainer.test.tsx

@@ -1,3 +1,4 @@
+//@ts-nocheck
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 import MainContainer from '../containers/MainContainer';
@@ -40,7 +41,8 @@ const state = {
 const dispatch = jest.fn();
 jest.mock('../../../node_modules/intro.js/introjs.css', () => jest.fn());
 jest.mock('../store');
-useStoreContext.mockImplementation(() => [state, dispatch]);
+const mockedUseStoreContext = jest.mocked(useStoreContext);
+mockedUseStoreContext.mockImplementation(() => [state, dispatch]);
 
 global.chrome = chrome;
 const port = {
@@ -86,9 +88,10 @@ describe('With no snapshots, should not render any containers', () => {
 describe('With snapshots, should render all containers', () => {
   beforeEach(() => {
     render(<MainContainer />);
-    useStoreContext.mockClear();
+    mockedUseStoreContext.mockClear();
     dispatch.mockClear();
     mockErrorContainer.mockClear();
+    // @ts-ignore
     state.currentTab = 87;
     state.tabs[87] = {
       snapshots: [{}],

src/app/__tests__/MainSlider.test.tsx

@@ -7,6 +7,7 @@ import MainSlider from '../components/MainSlider';
 import { useStoreContext } from '../store';
 
 jest.mock('../store');
+const mockeduseStoreContext = jest.mocked(useStoreContext);
 
 describe('Unit testing for MainSlider.jsx', () => {
   const props = {
@@ -23,7 +24,7 @@ describe('Unit testing for MainSlider.jsx', () => {
   };
 
   const dispatch = jest.fn();
-  useStoreContext.mockImplementation(() => [state, dispatch]);
+  mockeduseStoreContext.mockImplementation(() => [state, dispatch]);
 
   describe('When user only has one snapshot to view', () => {
     test('Component should have min, max, value with correct values to indicate slider position for correct tab', () => {

src/app/__tests__/TravelContainer.test.tsx

@@ -17,9 +17,10 @@ const state = {
 
 const play = jest.fn();
 const dispatch = jest.fn();
-useStoreContext.mockImplementation(() => [state, dispatch]);
 
 jest.mock('../store');
+const mockedStoreContext = jest.mocked(useStoreContext);
+mockedStoreContext.mockImplementation(() => [state, dispatch]);
 
 const mockSlider = jest.fn();
 jest.mock('../components/MainSlider', () => (props) => {

src/app/__tests__/Tutorial.test.tsx

@@ -9,7 +9,7 @@ import Tutorial from '../components/Tutorial';
 
 const dispatch = jest.fn();
 const props = {
-  currentTabInApp: undefined,
+  currentTabInApp: 'map',
   dispatch,
 };