From dc18e84bc2cbfabcbde6594f6c1ba6d5b2971cc6 Mon Sep 17 00:00:00 2001
From: gianantoniopini <63844628+gianantoniopini@users.noreply.github.com>
Date: Fri, 22 Jan 2021 16:42:21 +0100
Subject: [PATCH] Dashboard: updated unit tests for Delete resume

---
 .../database/reference.js                     | 11 ++-
 src/pages/app/__tests__/builder.test.js       | 11 ++-
 src/pages/app/__tests__/dashboard.test.js     | 71 +++++++++++++------
 3 files changed, 63 insertions(+), 30 deletions(-)

diff --git a/__mocks__/gatsby-plugin-firebase/database/reference.js b/__mocks__/gatsby-plugin-firebase/database/reference.js
index ea04ee40..305c82b7 100644
--- a/__mocks__/gatsby-plugin-firebase/database/reference.js
+++ b/__mocks__/gatsby-plugin-firebase/database/reference.js
@@ -1,6 +1,5 @@
 /* eslint-disable no-underscore-dangle */
 import { v4 as uuidv4 } from 'uuid';
-import { debounce } from 'lodash';
 
 import DatabaseConstants from '../constants/database';
 import DataSnapshot from './dataSnapshot';
@@ -148,11 +147,7 @@ class Reference {
         ? this._dataSnapshot
         : new DataSnapshot(() => this._getData(), snapshotValue);
 
-    const debouncedEventCallback = debounce(
-      this.eventCallbacks[eventType],
-      DatabaseConstants.defaultDelayInMilliseconds,
-    );
-    debouncedEventCallback(snapshot);
+    this.eventCallbacks[eventType](snapshot);
   }
 
   equalTo(value) {
@@ -173,7 +168,9 @@ class Reference {
     this.eventCallbacks[eventType] = callback;
 
     if (eventType === DatabaseConstants.valueEventType) {
-      this.triggerEventCallback(eventType);
+      setTimeout(() => {
+        this.triggerEventCallback(eventType);
+      }, DatabaseConstants.defaultDelayInMilliseconds);
     }
 
     return callback;
diff --git a/src/pages/app/__tests__/builder.test.js b/src/pages/app/__tests__/builder.test.js
index c6f0ebd5..55860935 100644
--- a/src/pages/app/__tests__/builder.test.js
+++ b/src/pages/app/__tests__/builder.test.js
@@ -23,6 +23,7 @@ import {
 } from '../../../contexts/DatabaseContext';
 import { ResumeProvider } from '../../../contexts/ResumeContext';
 import { StorageProvider } from '../../../contexts/StorageContext';
+import Wrapper from '../../../components/shared/Wrapper';
 import Builder from '../builder';
 
 describe('Builder', () => {
@@ -60,7 +61,9 @@ describe('Builder', () => {
             <DatabaseProvider>
               <ResumeProvider>
                 <StorageProvider>
-                  <Builder id={resumeId} />
+                  <Wrapper>
+                    <Builder id={resumeId} />
+                  </Wrapper>
                 </StorageProvider>
               </ResumeProvider>
             </DatabaseProvider>
@@ -212,6 +215,12 @@ describe('Builder', () => {
       await setup(DatabaseConstants.demoStateResume1Id, false, false);
     });
 
+    afterEach(async () => {
+      await waitForElementToBeRemoved(() =>
+        screen.getByTestId(loadingScreenTestId),
+      );
+    });
+
     it('renders loading screen', () => {
       expect(screen.getByTestId(loadingScreenTestId)).toBeInTheDocument();
     });
diff --git a/src/pages/app/__tests__/dashboard.test.js b/src/pages/app/__tests__/dashboard.test.js
index f65cfbb5..385493b9 100644
--- a/src/pages/app/__tests__/dashboard.test.js
+++ b/src/pages/app/__tests__/dashboard.test.js
@@ -20,6 +20,7 @@ import { UserProvider } from '../../../contexts/UserContext';
 import { DatabaseProvider } from '../../../contexts/DatabaseContext';
 import { ResumeProvider } from '../../../contexts/ResumeContext';
 import { StorageProvider } from '../../../contexts/StorageContext';
+import Wrapper from '../../../components/shared/Wrapper';
 import Dashboard from '../dashboard';
 
 describe('Dashboard', () => {
@@ -46,7 +47,9 @@ describe('Dashboard', () => {
             <DatabaseProvider>
               <ResumeProvider>
                 <StorageProvider>
-                  <Dashboard user={user} />
+                  <Wrapper>
+                    <Dashboard user={user} />
+                  </Wrapper>
                 </StorageProvider>
               </ResumeProvider>
             </DatabaseProvider>
@@ -67,25 +70,33 @@ describe('Dashboard', () => {
       await setup();
     });
 
-    it('document title', () => {
-      expect(document.title).toEqual('Dashboard | Reactive Resume');
+    it('document title', async () => {
+      await waitFor(() => {
+        expect(document.title).toEqual('Dashboard | Reactive Resume');
+      });
     });
 
-    it('create resume', () => {
-      expect(screen.getByText(/create resume/i)).toBeInTheDocument();
+    it('create resume', async () => {
+      await waitFor(() => {
+        expect(screen.getByText(/create resume/i)).toBeInTheDocument();
+      });
     });
 
-    it('preview of user resumes', () => {
+    it('preview of user resumes', async () => {
       expect(Object.keys(resumes)).toHaveLength(2);
 
       expect(Object.values(resumes)[0].user).toEqual(user.uid);
-      expect(
-        screen.getByText(Object.values(resumes)[0].name),
-      ).toBeInTheDocument();
+      await waitFor(() => {
+        expect(
+          screen.getByText(Object.values(resumes)[0].name),
+        ).toBeInTheDocument();
+      });
       expect(Object.values(resumes)[1].user).toEqual(user.uid);
-      expect(
-        screen.getByText(Object.values(resumes)[1].name),
-      ).toBeInTheDocument();
+      await waitFor(() => {
+        expect(
+          screen.getByText(Object.values(resumes)[1].name),
+        ).toBeInTheDocument();
+      });
     });
   });
 
@@ -95,6 +106,10 @@ describe('Dashboard', () => {
     let undeletedResume = null;
     let resumeToDeleteId = null;
 
+    const waitForDatabaseRemoveFunctionToHaveCompleted = async () => {
+      await waitFor(() => mockDatabaseRemoveFunction.mock.results[0].value);
+    };
+
     beforeEach(async () => {
       await setup();
 
@@ -108,9 +123,13 @@ describe('Dashboard', () => {
         'remove',
       );
 
-      const resumeToDeleteMenuToggle = screen.getByTestId(
-        `${resumePreviewMenuToggleDataTestIdPrefix}${resumeToDeleteId}`,
-      );
+      let resumeToDeleteMenuToggle = null;
+      await waitFor(() => {
+        resumeToDeleteMenuToggle = screen.queryByTestId(
+          `${resumePreviewMenuToggleDataTestIdPrefix}${resumeToDeleteId}`,
+        );
+        return resumeToDeleteMenuToggle ? Promise.resolve() : Promise.reject();
+      });
       fireEvent.click(resumeToDeleteMenuToggle);
 
       const menuItems = screen.getAllByRole('menuitem');
@@ -124,26 +143,28 @@ describe('Dashboard', () => {
       fireEvent.click(deleteMenuItem);
     });
 
+    afterEach(async () => {
+      await waitForDatabaseRemoveFunctionToHaveCompleted();
+    });
+
     it('removes it from database and preview', async () => {
       await waitFor(() =>
         expect(mockDatabaseRemoveFunction).toHaveBeenCalledTimes(1),
       );
 
+      await waitForDatabaseRemoveFunctionToHaveCompleted();
+
       await waitFor(() =>
         expect(screen.queryByText(resumeToDelete.name)).toBeNull(),
       );
       expect(screen.getByText(undeletedResume.name)).toBeInTheDocument();
     });
 
-    /*
     it('displays notification', async () => {
-      await waitFor(() =>
-        expect(
-          screen.getByText(`${resumeToDelete.name} was deleted successfully`),
-        ).toBeInTheDocument(),
-      );
+      await waitFor(() => {
+        expect(screen.getByRole('alert')).toBeInTheDocument();
+      });
     });
-    */
 
     it('closes menu', () => {
       const menuItems = screen.queryAllByRole('menuitem');
@@ -156,6 +177,12 @@ describe('Dashboard', () => {
       await setup(false);
     });
 
+    afterEach(async () => {
+      await waitForElementToBeRemoved(() =>
+        screen.getByTestId(loadingScreenTestId),
+      );
+    });
+
     it('renders loading screen', () => {
       expect(screen.getByTestId(loadingScreenTestId)).toBeInTheDocument();
     });