Other Information
Include any other relevant information about the home.
@@ -74,8 +91,11 @@ import {
RebuiltStatus,
OtherInformation
} from '@/components/mhrRegistration/YourHome'
+import { SimpleHelpToggle } from '@/components/common'
+import { DialogContent } from '@/components/dialogs/common'
import { useMhrValidations } from '@/composables/mhrRegistration/useMhrValidations'
import { storeToRefs } from 'pinia'
+import { ManufacturerMakeModelPrompt, HomeCertificationPrompt } from '@/resources/mhr-registration'
export default defineComponent({
name: 'YourHome',
@@ -84,12 +104,16 @@ export default defineComponent({
HomeSections,
ManufacturerMakeModel,
RebuiltStatus,
- OtherInformation
+ OtherInformation,
+ SimpleHelpToggle,
+ DialogContent
},
props: {},
setup () {
const {
- getMhrRegistrationValidationModel
+ getMhrRegistrationValidationModel,
+ isMhrManufacturerRegistration,
+ isRoleManufacturer
} = storeToRefs(useStore())
const {
@@ -114,6 +138,19 @@ export default defineComponent({
}),
validateOther: computed(() => {
return getSectionValidation(MhrSectVal.YOUR_HOME_VALID, MhrCompVal.OTHER_VALID)
+ }),
+ showHelp: computed(() => isMhrManufacturerRegistration.value),
+ showRebuiltStatus: computed(() => !isMhrManufacturerRegistration.value),
+ showOtherInformation: computed(() => !isMhrManufacturerRegistration.value),
+ manufacturerMakeModelPrompt: computed(() : string => {
+ return isRoleManufacturer.value
+ ? ManufacturerMakeModelPrompt.manufacturer
+ : ManufacturerMakeModelPrompt.staff
+ }),
+ homeCertificationPrompt: computed(() : string => {
+ return isRoleManufacturer.value
+ ? HomeCertificationPrompt.manufacturer
+ : HomeCertificationPrompt.staff
})
})
diff --git a/ppr-ui/tests/unit/HomeCertification.spec.ts b/ppr-ui/tests/unit/HomeCertification.spec.ts
index 68eb2853c..71a137ff0 100644
--- a/ppr-ui/tests/unit/HomeCertification.spec.ts
+++ b/ppr-ui/tests/unit/HomeCertification.spec.ts
@@ -9,6 +9,9 @@ import { mount, createLocalVue, Wrapper } from '@vue/test-utils'
import { HomeCertification } from '@/components/mhrRegistration'
import { SharedDatePicker } from '@/components/common'
import flushPromises from 'flush-promises'
+import { MhrRegistrationType } from '@/resources'
+import { mockedManufacturerAuthRoles } from './test-data'
+import { HomeCertificationOptions } from '@/enums'
Vue.use(Vuetify)
@@ -34,7 +37,7 @@ function createComponent (): Wrapper {
})
}
-describe('Home Certification', () => {
+describe('Home Certification - staff', () => {
let wrapper: Wrapper
beforeEach(async () => {
@@ -140,3 +143,40 @@ describe('Home Certification', () => {
expect(wrapper.findComponent(SharedDatePicker).exists()).toBe(true)
})
})
+
+describe('Home Certification - manufacturer', () => {
+ let wrapper: Wrapper
+
+ beforeAll(async () => {
+ await store.setAuthRoles(mockedManufacturerAuthRoles)
+ await store.setRegistrationType(MhrRegistrationType)
+ // When a manufacturer registration is inited it sets the certificatonOption to CSA
+ await store.setMhrHomeDescription({ key: 'certificationOption', value: HomeCertificationOptions.CSA })
+ })
+
+ beforeEach(async () => {
+ wrapper = createComponent()
+ await nextTick()
+ await flushPromises()
+ })
+ afterEach(() => {
+ wrapper.destroy()
+ })
+
+ afterAll(async () => {
+ await store.setAuthRoles(null)
+ await store.setRegistrationType(null)
+ })
+
+ it('renders base component with correct sub components', async () => {
+ expect(wrapper.findComponent(HomeCertification).exists()).toBe(true)
+ expect(wrapper.findComponent(SharedDatePicker).exists()).toBe(false)
+
+ /// Verify Radio group does not exist
+ expect(wrapper.find('#certification-option-btns').exists()).toBe(false)
+
+ // Verify only csa-form is shown
+ expect(wrapper.find('#csa-form').isVisible()).toBe(true)
+ expect(wrapper.find('#engineer-form').exists()).toBe(false)
+ })
+})
diff --git a/ppr-ui/tests/unit/ManufacturerMakeModel.spec.ts b/ppr-ui/tests/unit/ManufacturerMakeModel.spec.ts
index 053ed3fb6..c12c96b92 100644
--- a/ppr-ui/tests/unit/ManufacturerMakeModel.spec.ts
+++ b/ppr-ui/tests/unit/ManufacturerMakeModel.spec.ts
@@ -5,7 +5,9 @@ import { useStore } from '../../src/store/store'
import { mount, createLocalVue, Wrapper } from '@vue/test-utils'
import { getTestId } from './utils'
-import { ManufacturerMakeModel } from '@/components/mhrRegistration'
+import { ManufacturerMakeModel, ManufacturedYearInput, ManufacturedYearSelect } from '@/components/mhrRegistration'
+import { MhrRegistrationType } from '@/resources'
+import { mockedManufacturerAuthRoles } from './test-data'
Vue.use(Vuetify)
const vuetify = new Vuetify({})
@@ -31,7 +33,7 @@ function createComponent (): Wrapper {
// Error message class selector
const ERROR_MSG = '.error--text .v-messages__message'
-describe('ManufacturerMakeModel component', () => {
+describe('ManufacturerMakeModel component - staff', () => {
let wrapper: Wrapper
beforeEach(async () => {
@@ -43,6 +45,8 @@ describe('ManufacturerMakeModel component', () => {
it('renders the component', async () => {
expect(wrapper.findComponent(ManufacturerMakeModel).exists()).toBe(true)
+ expect(wrapper.findComponent(ManufacturedYearInput).exists()).toBe(true)
+ expect(wrapper.findComponent(ManufacturedYearSelect).exists()).toBe(false)
wrapper.find(getTestId('manufacturer-name')).exists()
wrapper.find(getTestId('manufacture-year')).exists()
@@ -52,6 +56,10 @@ describe('ManufacturerMakeModel component', () => {
wrapper.find(getTestId('manufacturer-model')).exists()
})
+ it('verifes Name of Manufactuer field is not disabled', async () => {
+ expect(wrapper.find(getTestId('manufacturer-name')).attributes('disabled')).toBe(undefined)
+ })
+
it('show error messages for Name of Manufacturer field', async () => {
wrapper.find(getTestId('manufacturer-name')).setValue('x')
await nextTick()
@@ -130,3 +138,58 @@ describe('ManufacturerMakeModel component', () => {
expect(wrapper.findAll(ERROR_MSG).at(1).text()).toContain('cannot exceed 65')
})
})
+
+describe('ManufacturerMakeModel component - manufacturer', () => {
+ let wrapper: Wrapper
+
+ beforeAll(async () => {
+ await store.setAuthRoles(mockedManufacturerAuthRoles)
+ await store.setRegistrationType(MhrRegistrationType)
+ })
+
+ beforeEach(async () => {
+ wrapper = createComponent()
+ })
+ afterEach(() => {
+ wrapper.destroy()
+ })
+
+ afterAll(async () => {
+ await store.setAuthRoles(null)
+ await store.setRegistrationType(null)
+ })
+
+ it('renders the component', async () => {
+ expect(wrapper.findComponent(ManufacturerMakeModel).exists()).toBe(true)
+ expect(wrapper.findComponent(ManufacturedYearInput).exists()).toBe(false)
+ expect(wrapper.findComponent(ManufacturedYearSelect).exists()).toBe(true)
+
+ wrapper.find(getTestId('manufacturer-name')).exists()
+ expect(wrapper.find(getTestId('manufacture-year')).exists()).toBe(false)
+ expect(wrapper.find(getTestId('manufacture-year-select')).exists()).toBe(true)
+ expect(wrapper.find(getTestId('circa-year-checkbox')).exists()).toBe(false)
+ expect(wrapper.find(getTestId('circa-year-tooltip')).exists()).toBe(false)
+ wrapper.find(getTestId('manufacturer-make')).exists()
+ wrapper.find(getTestId('manufacturer-model')).exists()
+ })
+
+ it('verifes Name of Manufacturer field is disabled', async () => {
+ expect(wrapper.find(getTestId('manufacturer-name')).attributes('disabled')).toBe('disabled')
+ })
+
+ it('show error messages for Manufacturer Make Model inputs', async () => {
+ wrapper.find(getTestId('manufacturer-make')).setValue('x'.repeat(70))
+ wrapper.find(getTestId('manufacturer-model')).setValue('x'.repeat(70))
+ await nextTick()
+ const messages = wrapper.findAll(ERROR_MSG)
+ expect(messages.length).toBe(2)
+ })
+
+ it('checks year of manufacturer select works as expected', async () => {
+ const yearSelect = wrapper.findComponent(ManufacturedYearSelect)
+ const select = yearSelect.find('.v-select')
+ const items = select.props('items')
+ const currentYear = new Date().getFullYear()
+ expect(items).toStrictEqual([currentYear + 1, currentYear, currentYear - 1])
+ })
+})
diff --git a/ppr-ui/tests/unit/SimpleHelpToggle.spec.ts b/ppr-ui/tests/unit/SimpleHelpToggle.spec.ts
new file mode 100644
index 000000000..14d7d0d18
--- /dev/null
+++ b/ppr-ui/tests/unit/SimpleHelpToggle.spec.ts
@@ -0,0 +1,55 @@
+// Libraries
+import Vue from 'vue'
+import Vuetify from 'vuetify'
+import { createLocalVue, mount, Wrapper } from '@vue/test-utils'
+
+// Components
+import { SimpleHelpToggle } from '@/components/common'
+
+// Utilities
+import { getTestId } from './utils'
+
+Vue.use(Vuetify)
+const vuetify = new Vuetify({})
+
+/**
+ * Creates and mounts a component, so that it can be tested.
+ *
+ * @returns a Wrapper object with the given parameters.
+ */
+function createComponent (propsData: any): Wrapper {
+ const localVue = createLocalVue()
+ localVue.use(Vuetify)
+
+ return mount((SimpleHelpToggle as any), {
+ localVue,
+ propsData,
+ vuetify
+ })
+}
+
+describe('SimpleHelpToggle', () => {
+ it('renders the component properly', () => {
+ const wrapper: Wrapper = createComponent({ toggleButtonTitle: 'test' })
+ expect(wrapper.findComponent(SimpleHelpToggle).exists()).toBe(true)
+ const toggleButton = wrapper.find(getTestId('help-toggle-btn'))
+ expect(toggleButton.text()).toBe('test')
+ expect(toggleButton.text().includes('Hide')).toBe(false)
+ })
+
+ it('has the proper hide text - default hide text', async () => {
+ const wrapper: Wrapper = createComponent({ toggleButtonTitle: 'test' })
+ const toggleButton = wrapper.find(getTestId('help-toggle-btn'))
+ await toggleButton.trigger('click')
+ expect(toggleButton.text()).not.toBe('test')
+ expect(toggleButton.text()).toBe('Hide Help')
+ })
+
+ it('has the proper hide text - none default hide text', async () => {
+ const wrapper: Wrapper = createComponent({ toggleButtonTitle: 'test', defaultHideText: false })
+ const toggleButton = wrapper.find(getTestId('help-toggle-btn'))
+ await toggleButton.trigger('click')
+ expect(toggleButton.text()).not.toBe('test')
+ expect(toggleButton.text()).toBe('Hide test')
+ })
+})
diff --git a/ppr-ui/tests/unit/YourHome.spec.ts b/ppr-ui/tests/unit/YourHome.spec.ts
index 307d730d5..4ed9a90cf 100644
--- a/ppr-ui/tests/unit/YourHome.spec.ts
+++ b/ppr-ui/tests/unit/YourHome.spec.ts
@@ -19,6 +19,10 @@ import { MhrRegistrationType } from '@/resources'
import { defaultFlagSet } from '@/utils'
import mockRouter from './MockRouter'
import { RouteNames } from '@/enums'
+import { getTestId } from './utils'
+import { mockedManufacturerAuthRoles } from './test-data'
+import { HomeCertificationPrompt, ManufacturerMakeModelPrompt } from '@/resources/mhr-registration'
+import { SimpleHelpToggle } from '@/components/common'
Vue.use(Vuetify)
@@ -52,7 +56,7 @@ function createComponent (): Wrapper {
})
}
-describe('Your Home', () => {
+describe('Your Home - Staff', () => {
let wrapper: Wrapper
beforeEach(async () => {
@@ -73,10 +77,13 @@ describe('Your Home', () => {
it('renders and displays the correct headers and sub components', async () => {
expect(wrapper.find('#mhr-make-model h2').text()).toBe('Manufacturer, Make, and Model')
+ expect(wrapper.find(getTestId('make-model-prompt')).text()).toBe(ManufacturerMakeModelPrompt.staff)
expect(wrapper.findComponent(ManufacturerMakeModel).exists()).toBe(true)
+ expect(wrapper.findComponent(SimpleHelpToggle).exists()).toBe(false)
expect(wrapper.find('#mhr-home-sections h2').text()).toBe('Home Sections')
expect(wrapper.findComponent(HomeSections).exists()).toBe(true)
expect(wrapper.find('#mhr-home-certification h2').text()).toBe('Home Certification')
+ expect(wrapper.find(getTestId('home-certification-prompt')).text()).toBe(HomeCertificationPrompt.staff)
expect(wrapper.findComponent(HomeCertification).exists()).toBe(true)
expect(wrapper.find('#mhr-rebuilt-status h2').text()).toBe('Rebuilt Status')
expect(wrapper.findComponent(RebuiltStatus).exists()).toBe(true)
@@ -84,3 +91,45 @@ describe('Your Home', () => {
expect(wrapper.findComponent(OtherInformation).exists()).toBe(true)
})
})
+
+describe('Your Home - Manufacturer', () => {
+ let wrapper: Wrapper
+
+ beforeAll(async () => {
+ defaultFlagSet['mhr-registration-enabled'] = true
+ await store.setAuthRoles(mockedManufacturerAuthRoles)
+ await store.setRegistrationType(MhrRegistrationType)
+ })
+
+ beforeEach(async () => {
+ wrapper = createComponent()
+ })
+
+ afterEach(() => {
+ wrapper.destroy()
+ })
+
+ afterAll(async () => {
+ defaultFlagSet['mhr-registration-enabled'] = false
+ await store.setAuthRoles(null)
+ await store.setRegistrationType(null)
+ })
+
+ it('renders and displays Your Home View', async () => {
+ expect(wrapper.findComponent(YourHome).exists()).toBe(true)
+ })
+
+ it('renders and displays the correct headers and sub components', async () => {
+ expect(wrapper.find('#mhr-make-model h2').text()).toBe('Manufacturer, Make, and Model')
+ expect(wrapper.find(getTestId('make-model-prompt')).text()).toBe(ManufacturerMakeModelPrompt.manufacturer)
+ expect(wrapper.findComponent(ManufacturerMakeModel).exists()).toBe(true)
+ expect(wrapper.findComponent(SimpleHelpToggle).exists()).toBe(true)
+ expect(wrapper.find('#mhr-home-sections h2').text()).toBe('Home Sections')
+ expect(wrapper.findComponent(HomeSections).exists()).toBe(true)
+ expect(wrapper.find('#mhr-home-certification h2').text()).toBe('Home Certification')
+ expect(wrapper.find(getTestId('home-certification-prompt')).text()).toBe(HomeCertificationPrompt.manufacturer)
+ expect(wrapper.findComponent(HomeCertification).exists()).toBe(true)
+ expect(wrapper.findComponent(RebuiltStatus).exists()).toBe(false)
+ expect(wrapper.findComponent(OtherInformation).exists()).toBe(false)
+ })
+})