More Mhr unit tests updates

bcgov · Nov 27, 2023 · 18d86df · 18d86df
1 parent 7a7bf6b
commit 18d86df
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 172 deletions.
diff --git a/ppr-ui/src/components/common/Remarks.vue b/ppr-ui/src/components/common/Remarks.vue
@@ -20,7 +20,7 @@
           <v-col cols="3">
             <label
               for="remarks-textarea"
-              class="generic-label"
+              class="generic-label side-label"
               :class="{ 'error-text': showBorderError }"
             >
               {{ content.sideLabel }}
@@ -75,11 +75,13 @@ export default defineComponent({
     },
     additionalRemarks: {
       type: String,
-      required: false
+      required: false,
+      default: ''
     },
     sectionNumber: {
       type: Number,
-      required: false
+      required: false,
+      default: null
     },
     content: {
       type: Object as () => ContentIF,

diff --git a/ppr-ui/src/components/unitNotes/UnitNoteReview.vue b/ppr-ui/src/components/unitNotes/UnitNoteReview.vue
@@ -301,7 +301,7 @@ export default defineComponent({
     onMounted(() => {
       // scroll to top
       setTimeout(() => {
-        document.getElementById('unit-note-review-confirm').scrollIntoView({ behavior: 'smooth' })
+        document.getElementById('unit-note-review-confirm')?.scrollIntoView({ behavior: 'smooth' })
       }, 500)
     })
 

diff --git a/ppr-ui/tests/unit/MhrRegistration.spec.ts b/ppr-ui/tests/unit/MhrRegistration.spec.ts
@@ -1,73 +1,26 @@
 // Libraries
-import Vue from 'vue'
-import Vuetify from 'vuetify'
-import { createPinia, setActivePinia } from 'pinia'
 import { useStore } from '../../src/store/store'
-import VueRouter from 'vue-router'
-import { createLocalVue, mount, Wrapper } from '@vue/test-utils'
 
 // local components
 import { MhrRegistration } from '@/views'
-import ButtonFooter from '@/components/common/ButtonFooter.vue'
+import { ButtonFooter } from '@/components/common'
 import { Stepper, StickyContainer } from '@/components/common'
 import { MhrRegistrationType } from '@/resources'
 import { defaultFlagSet } from '@/utils'
-import mockRouter from './MockRouter'
 import { RouteNames } from '@/enums'
 import { mockedManufacturerAuthRoles } from './test-data'
+import { createComponent } from './utils'
 
-Vue.use(Vuetify)
-
-const vuetify = new Vuetify({})
-setActivePinia(createPinia())
 const store = useStore()
 
-/**
- * Creates and mounts a component, so that it can be tested.
- *
- * @returns a Wrapper<any> object with the given parameters.
- */
-function createComponent (): Wrapper<any> {
-  const localVue = createLocalVue()
-  localVue.use(Vuetify)
-  localVue.use(VueRouter)
-  const router = mockRouter.mock()
-  router.push({
-    name: RouteNames.YOUR_HOME
-  })
-
-  document.body.setAttribute('data-app', 'true')
-  return mount((MhrRegistration as any), {
-    localVue,
-    store,
-    propsData: {
-      appReady: true
-    },
-    vuetify,
-    stubs: { Affix: true },
-    router
-  })
-}
-
 describe('Mhr Registration', () => {
-  let wrapper: Wrapper<any>
-  const currentAccount = {
-    id: 'test_id'
-  }
-  sessionStorage.setItem('KEYCLOAK_TOKEN', 'token')
-  sessionStorage.setItem('CURRENT_ACCOUNT', JSON.stringify(currentAccount))
-  sessionStorage.setItem('AUTH_API_URL', 'https://bcregistry-bcregistry-mock.apigee.net/mockTarget/auth/api/v1/')
+  let wrapper: any
 
   beforeEach(async () => {
     // Staff with MHR enabled
     defaultFlagSet['mhr-registration-enabled'] = true
     await store.setRegistrationType(MhrRegistrationType)
-
-    wrapper = createComponent()
-  })
-
-  afterEach(() => {
-    wrapper.destroy()
+    wrapper = await createComponent(MhrRegistration, { appReady: true }, RouteNames.YOUR_HOME)
   })
 
   it('renders and displays the Mhr Registration View', async () => {
@@ -86,24 +39,14 @@ describe('Mhr Registration', () => {
 })
 
 describe('Mhr Manufacturer Registration', () => {
-  let wrapper: Wrapper<any>
-  const currentAccount = {
-    id: 'test_id'
-  }
-  sessionStorage.setItem('KEYCLOAK_TOKEN', 'token')
-  sessionStorage.setItem('CURRENT_ACCOUNT', JSON.stringify(currentAccount))
-  sessionStorage.setItem('AUTH_API_URL', 'https://bcregistry-bcregistry-mock.apigee.net/mockTarget/auth/api/v1/')
+  let wrapper: any
 
   beforeEach(async () => {
     defaultFlagSet['mhr-registration-enabled'] = true
     await store.setAuthRoles(mockedManufacturerAuthRoles)
     await store.setRegistrationType(MhrRegistrationType)
 
-    wrapper = createComponent()
-  })
-
-  afterEach(() => {
-    wrapper.destroy()
+    wrapper = await createComponent(MhrRegistration, { appReady: true }, RouteNames.YOUR_HOME)
   })
 
   it('renders and displays the Mhr Registration View', async () => {

diff --git a/ppr-ui/tests/unit/MhrReviewConfirm.spec.ts b/ppr-ui/tests/unit/MhrReviewConfirm.spec.ts
@@ -1,10 +1,6 @@
 // Libraries
-import Vue, { nextTick } from 'vue'
-import Vuetify from 'vuetify'
-import VueRouter from 'vue-router'
-import { createPinia, setActivePinia } from 'pinia'
+import { nextTick } from 'vue'
 import { useStore } from '../../src/store/store'
-import { createLocalVue, mount, Wrapper } from '@vue/test-utils'
 
 // Local Components
 import { MhrReviewConfirm } from '@/views'
@@ -13,50 +9,20 @@ import { HomeLocationReview, HomeOwnersReview,
 import { AccountInfo, Attention, CautionBox, CertifyInformation,
   ContactUsToggle, FolioOrReferenceNumber, FormField } from '@/components/common'
 import { HomeTenancyTypes, ProductCode, RouteNames, HomeCertificationOptions } from '@/enums'
-import mockRouter from './MockRouter'
 import { mockedFractionalOwnership, mockedPerson } from './test-data/mock-mhr-registration'
 import { MhrRegistrationHomeOwnerGroupIF, MhrRegistrationHomeOwnerIF } from '@/interfaces/mhr-registration-interfaces'
-import { getTestId } from './utils'
+import { createComponent, getTestId } from './utils'
 import { HomeOwnersTable } from '@/components/mhrRegistration/HomeOwners'
 import { MhrRegistrationType } from '@/resources'
 import { mockedAccountInfo, mockedManufacturerAuthRoles } from './test-data'
 import { defaultFlagSet } from '@/utils'
-import { StaffPayment } from '@bcrs-shared-components/staff-payment'
+import { StaffPayment } from '@/components/common'
 import { HomeSections } from '@/components/mhrRegistration'
 
-Vue.use(Vuetify)
-
-const vuetify = new Vuetify({})
-setActivePinia(createPinia())
 const store = useStore()
 
-/**
- * Creates and mounts a component, so that it can be tested.
- *
- * @returns a Wrapper<any> object with the given parameters.
- */
-function createComponent (): Wrapper<any> {
-  const localVue = createLocalVue()
-  localVue.use(Vuetify)
-  document.body.setAttribute('data-app', 'true')
-  localVue.use(VueRouter)
-  const router = mockRouter.mock()
-  router.push({ name: RouteNames.MHR_REVIEW_CONFIRM })
-
-  return mount(MhrReviewConfirm, {
-    localVue,
-    propsData: {
-      appReady: true,
-      isJestRunning: true
-    },
-    router,
-    store,
-    vuetify
-  })
-}
-
 describe('Mhr Review Confirm registration', () => {
-  let wrapper: Wrapper<any>
+  let wrapper
   sessionStorage.setItem('KEYCLOAK_TOKEN', 'token')
   const currentAccount = {
     id: 'test_id'
@@ -65,12 +31,11 @@ describe('Mhr Review Confirm registration', () => {
   sessionStorage.setItem('AUTH_API_URL', 'https://bcregistry-bcregistry-mock.apigee.net/mockTarget/auth/api/v1/')
   const reviewConfirmState = store.getMhrRegistrationValidationModel.reviewConfirmValid
 
-  afterEach(() => {
-    wrapper.destroy()
+  beforeEach(async () => {
+    wrapper = await createComponent(MhrReviewConfirm, { appReady: true }, RouteNames.MHR_REVIEW_CONFIRM)
   })
 
-  it('mounts with the correct components', () => {
-    wrapper = createComponent()
+  it('mounts with the correct components', async () => {
     expect(wrapper.findComponent(MhrReviewConfirm).exists()).toBe(true)
     expect(wrapper.findComponent(YourHomeReview).exists()).toBe(true)
     expect(wrapper.findComponent(SubmittingPartyReview).exists()).toBe(true)
@@ -86,14 +51,11 @@ describe('Mhr Review Confirm registration', () => {
   })
 
   it('verifies Authorization default values', async () => {
-    wrapper = createComponent()
     expect(wrapper.vm.authorizationValid).toBe(false)
     expect(wrapper.vm.isValidatingApp).toBe(false)
   })
 
   it('prompts Authorization validation', async () => {
-    wrapper = createComponent()
-
     // Verify defaults
     expect(wrapper.vm.authorizationValid).toBe(false)
     expect(wrapper.vm.isValidatingApp).toBe(false)
@@ -108,8 +70,6 @@ describe('Mhr Review Confirm registration', () => {
   })
 
   it('should show correct Home Ownership section (without a Group)', async () => {
-    wrapper = createComponent()
-
     const owners = [mockedPerson] as MhrRegistrationHomeOwnerIF[]
     const homeOwnerGroup = [{ groupId: 1, owners: owners }] as MhrRegistrationHomeOwnerGroupIF[]
 
@@ -140,7 +100,6 @@ describe('Mhr Review Confirm registration', () => {
   })
 
   it('should show correct Home Ownership section (with a Group)', async () => {
-    wrapper = createComponent()
     wrapper.vm.setShowGroups(true)
 
     const owners = [mockedPerson] as MhrRegistrationHomeOwnerIF[]
@@ -177,7 +136,6 @@ describe('Mhr Review Confirm registration', () => {
   })
 
   it('does not show portions of yourHomeReview and SubmittingPartyReview if no data was entered', async () => {
-    wrapper = createComponent()
     const yourHomeReview = wrapper.findComponent(YourHomeReview)
     expect(yourHomeReview.exists()).toBeTruthy()
     expect(yourHomeReview.findComponent(HomeSections).exists()).toBe(false)
@@ -193,7 +151,7 @@ describe('Mhr Review Confirm registration', () => {
 })
 
 describe('Mhr Manufacturer Registration Review and Confirm', () => {
-  let wrapper: Wrapper<any>
+  let wrapper
   const currentAccount = {
     id: 'test_id'
   }
@@ -209,11 +167,7 @@ describe('Mhr Manufacturer Registration Review and Confirm', () => {
   })
 
   beforeEach(async () => {
-    wrapper = createComponent()
-  })
-
-  afterEach(() => {
-    wrapper.destroy()
+    wrapper = await createComponent(MhrReviewConfirm, { appReady: true }, RouteNames.MHR_REVIEW_CONFIRM)
   })
 
   afterAll(async () => {
@@ -243,12 +197,12 @@ describe('Mhr Manufacturer Registration Review and Confirm', () => {
   it('correctly set attention and folio', async () => {
     store.setMhrAttentionReference('TEST 123')
     store.setFolioOrReferenceNumber('TEST 245')
-    wrapper = createComponent()
+    wrapper = await createComponent(MhrReviewConfirm, { appReady: true }, RouteNames.MHR_REVIEW_CONFIRM)
     await nextTick()
     const attention = wrapper.findComponent(Attention)
     const folio = wrapper.findComponent(FolioOrReferenceNumber)
-    expect((attention.findComponent(FormField) as Wrapper<any>).vm.inputModel).toBe('TEST 123')
-    expect((folio.findComponent(FormField) as Wrapper<any>).vm.inputModel).toBe('TEST 245')
+    expect(attention.findComponent(FormField).vm.inputModel).toBe('TEST 123')
+    expect(folio.findComponent(FormField).vm.inputModel).toBe('TEST 245')
   })
 
   it('incorrect behavior if no certification checkbox is checked', async () => {
@@ -292,7 +246,7 @@ describe('Mhr Manufacturer Registration Review and Confirm', () => {
   it('incorrect behavior in home certification - Engineer Inspection', async () => {
     const yourHomeReview = wrapper.findComponent(YourHomeReview)
     expect(yourHomeReview.exists()).toBeTruthy()
-    await store.setMhrHomeDescription({key: 'certificationOption', 
+    await store.setMhrHomeDescription({key: 'certificationOption',
                                        value: HomeCertificationOptions.ENGINEER_INSPECTION})
     await nextTick()
     expect(yourHomeReview.find(getTestId('home-certification-header-1-eng')).text()).toBe('Engineer\'s Name')