add tests for navbar and sidebar

frontend/src/components/Menu/Navbar.spec.js

@@ -49,7 +49,7 @@ describe('Navbar', () => {
       })
 
       it('has ten b-nav-item in the navbar', () => {
-        expect(wrapper.findAll('.nav-item')).toHaveLength(11)
+        expect(wrapper.findAll('.nav-item')).toHaveLength(12)
       })
 
       it('has first nav-item "amount GDD" in navbar', () => {
@@ -68,29 +68,33 @@ describe('Navbar', () => {
         expect(wrapper.findAll('.nav-item').at(5).text()).toEqual('navigation.transactions')
       })
 
-      it('has first nav-item "navigation.transactions" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(6).text()).toEqual('navigation.community')
+      it('has first nav-item "gdt.gdt" in navbar', () => {
+        expect(wrapper.findAll('.nav-item').at(6).text()).toEqual('gdt.gdt')
+      })
+
+      it('has first nav-item "navigation.community" in navbar', () => {
+        expect(wrapper.findAll('.nav-item').at(7).text()).toEqual('navigation.community')
       })
 
       it('has first nav-item "navigation.profile" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(7).text()).toEqual('navigation.profile')
+        expect(wrapper.findAll('.nav-item').at(8).text()).toEqual('navigation.profile')
       })
     })
 
     describe('navigation Navbar (user has an elopage account)', () => {
       it('has a link to the members area', () => {
-        expect(wrapper.findAll('.nav-item').at(8).text()).toContain('navigation.members_area')
-        expect(wrapper.findAll('.nav-item').at(8).find('a').attributes('href')).toBe(
+        expect(wrapper.findAll('.nav-item').at(9).text()).toContain('navigation.members_area')
+        expect(wrapper.findAll('.nav-item').at(9).find('a').attributes('href')).toBe(
           'https://elopage.com',
         )
       })
 
       it('has first nav-item "navigation.admin_area" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(9).text()).toEqual('navigation.admin_area')
+        expect(wrapper.findAll('.nav-item').at(10).text()).toEqual('navigation.admin_area')
       })
 
       it('has first nav-item "navigation.logout" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(10).text()).toEqual('navigation.logout')
+        expect(wrapper.findAll('.nav-item').at(11).text()).toEqual('navigation.logout')
       })
     })
 
@@ -101,11 +105,11 @@ describe('Navbar', () => {
       })
 
       it('has first nav-item "navigation.admin_area" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(8).text()).toEqual('navigation.admin_area')
+        expect(wrapper.findAll('.nav-item').at(9).text()).toEqual('navigation.admin_area')
       })
 
       it('has first nav-item "navigation.logout" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(9).text()).toEqual('navigation.logout')
+        expect(wrapper.findAll('.nav-item').at(10).text()).toEqual('navigation.logout')
       })
     })
   })

frontend/src/components/Menu/Navbar.vue

@@ -52,6 +52,10 @@
           <b-icon icon="layout-text-sidebar-reverse" aria-hidden="true"></b-icon>
           {{ $t('navigation.transactions') }}
         </b-nav-item>
+        <b-nav-item to="/gdt" class="mb-3">
+          <b-icon icon="layout-text-sidebar-reverse" aria-hidden="true"></b-icon>
+          {{ $t('gdt.gdt') }}
+        </b-nav-item>
         <b-nav-item to="/community" class="mb-3">
           <b-icon icon="people" aria-hidden="true"></b-icon>
           {{ $t('navigation.community') }}

frontend/src/components/Menu/Sidebar.spec.js

@@ -45,31 +45,35 @@ describe('Sidebar', () => {
         expect(wrapper.findAll('.nav-item').at(2).text()).toEqual('navigation.transactions')
       })
 
+      it('has first nav-item "gdt.gdt" in navbar', () => {
+        expect(wrapper.findAll('.nav-item').at(3).text()).toEqual('gdt.gdt')
+      })
+
       it('has first nav-item "navigation.community" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(3).text()).toContain('navigation.community')
+        expect(wrapper.findAll('.nav-item').at(4).text()).toContain('navigation.community')
       })
 
       it('has first nav-item "navigation.profile" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(4).text()).toEqual('navigation.profile')
+        expect(wrapper.findAll('.nav-item').at(5).text()).toEqual('navigation.profile')
       })
     })
 
     describe('navigation Navbar (user has an elopage account)', () => {
       it('has eight b-nav-item in the navbar', () => {
-        expect(wrapper.findAll('.nav-item')).toHaveLength(8)
+        expect(wrapper.findAll('.nav-item')).toHaveLength(9)
       })
 
       it('has a link to the members area', () => {
-        expect(wrapper.findAll('.nav-item').at(5).text()).toEqual('navigation.members_area')
-        expect(wrapper.findAll('.nav-item').at(5).find('a').attributes('href')).toBe('#')
+        expect(wrapper.findAll('.nav-item').at(6).text()).toEqual('navigation.members_area')
+        expect(wrapper.findAll('.nav-item').at(6).find('a').attributes('href')).toBe('#')
       })
 
       it('has first nav-item "navigation.admin_area" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(6).text()).toEqual('navigation.admin_area')
+        expect(wrapper.findAll('.nav-item').at(7).text()).toEqual('navigation.admin_area')
       })
 
       it('has first nav-item "navigation.logout" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(7).text()).toEqual('navigation.logout')
+        expect(wrapper.findAll('.nav-item').at(8).text()).toEqual('navigation.logout')
       })
     })
 
@@ -80,15 +84,15 @@ describe('Sidebar', () => {
       })
 
       it('has seven b-nav-item in the navbar', () => {
-        expect(wrapper.findAll('.nav-item')).toHaveLength(7)
+        expect(wrapper.findAll('.nav-item')).toHaveLength(8)
       })
 
       it('has first nav-item "navigation.admin_area" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(5).text()).toEqual('navigation.admin_area')
+        expect(wrapper.findAll('.nav-item').at(6).text()).toEqual('navigation.admin_area')
       })
 
       it('has first nav-item "navigation.logout" in navbar', () => {
-        expect(wrapper.findAll('.nav-item').at(6).text()).toEqual('navigation.logout')
+        expect(wrapper.findAll('.nav-item').at(7).text()).toEqual('navigation.logout')
       })
     })
   })

frontend/src/pages/Transactions.spec.js

@@ -1,11 +1,13 @@
 import { mount } from '@vue/test-utils'
 import Transactions from './Transactions'
 import { GdtEntryType } from '@/graphql/enums'
+import flushPromises from 'flush-promises'
 
 import { toastErrorSpy } from '@test/testSetup'
 
 const localVue = global.localVue
 
+const mockRouterReplace = jest.fn()
 const windowScrollToMock = jest.fn()
 window.scrollTo = windowScrollToMock
 
@@ -39,6 +41,9 @@ describe('Transactions', () => {
     $apollo: {
       query: apolloMock,
     },
+    $router: {
+      push: mockRouterReplace,
+    },
   }
 
   const Wrapper = () => {
@@ -158,6 +163,7 @@ describe('Transactions', () => {
 
           describe('click on GDD tab', () => {
             beforeEach(() => {
+              flushPromises()
               wrapper.findAll('li[ role="presentation"]').at(0).find('a').trigger('click')
             })
 

frontend/src/routes/router.test.js

@@ -50,7 +50,7 @@ describe('router', () => {
       })
 
       it('has sixteen routes defined', () => {
-        expect(routes).toHaveLength(17)
+        expect(routes).toHaveLength(18)
       })
 
       describe('overview', () => {
@@ -108,6 +108,17 @@ describe('router', () => {
         })
       })
 
+      describe('gdt', () => {
+        it('requires authorization', () => {
+          expect(routes.find((r) => r.path === '/gdt').meta.requiresAuth).toBeTruthy()
+        })
+
+        it('loads the "GDT" page', async () => {
+          const component = await routes.find((r) => r.path === '/gdt').component()
+          expect(component.default.name).toBe('Transactions')
+        })
+      })
+
       describe('login', () => {
         it('loads the "Login" page', async () => {
           const component = await routes.find((r) => r.path === '/login/:code?').component()