@cnamts/synapse 1.0.13 → 1.0.15

package/src/components/Amelipro/AmeliproPatientBanner/__tests__/AmeliproPatientBanner.spec.ts

@@ -0,0 +1,208 @@
+import { VueWrapper, mount, shallowMount } from '@vue/test-utils'
+import { afterEach, beforeEach, describe, expect, it } from 'vitest'
+import AmeliproPatientBanner from '../AmeliproPatientBanner.vue'
+import type { ComponentProps } from 'vue-component-type-helpers'
+import { DisplayTestComponent } from '@tests/helpers/utils'
+import type { ExpectedPropOptions } from '@tests/types'
+import type { PropType } from 'vue'
+import type { RouteLocationRaw } from 'vue-router'
+import TestHelper from '@tests/helpers/TestHelper'
+
+const expectedPropOptions: ExpectedPropOptions<typeof AmeliproPatientBanner> = {
+	birthName: {
+		type: String,
+		default: undefined,
+	},
+	birthdate: {
+		type: String,
+		default: undefined,
+	},
+	moreInformationHref: {
+		type: String,
+		default: undefined,
+	},
+	moreInformationTo: {
+		type: [Array, Object, String] as PropType<RouteLocationRaw>,
+		default: undefined,
+	},
+	name: {
+		type: String,
+		default: undefined,
+	},
+	noMoreInformation: {
+		type: Boolean,
+		default: false,
+	},
+	noPatientChange: {
+		type: Boolean,
+		default: false,
+	},
+	patientDoctorInfos: {
+		type: String,
+		default: undefined,
+	},
+	patientNir: {
+		type: String,
+		default: undefined,
+	},
+	patientOrganism: {
+		type: String,
+		default: undefined,
+	},
+	patientStatus: {
+		type: String,
+		default: undefined,
+	},
+	patientSystem: {
+		type: String,
+		default: undefined,
+	},
+	uniqueId: {
+		type: String,
+		default: undefined,
+	},
+}
+
+// Values pour les props "required"
+const requiredPropValues = (): ComponentProps<typeof AmeliproPatientBanner> => ({})
+
+// Valeurs pour les props "modified"
+const modifiedPropValues = (): ComponentProps<typeof AmeliproPatientBanner> => ({
+	birthName: 'Modified birth name',
+	birthdate: 'Modified birthdate',
+	moreInformationHref: 'modified-more-information-href',
+	moreInformationTo: 'modified-more-information-to',
+	name: 'Modified name',
+	noMoreInformation: true,
+	noPatientChange: true,
+	patientDoctorInfos: 'Modified doctor infos',
+	patientNir: 'Modified XXXXXXXXX',
+	patientOrganism: 'Modified organism',
+	patientStatus: 'Modified status',
+	patientSystem: 'Modified system',
+	uniqueId: 'modified-unique-id',
+})
+
+const testHelper = new TestHelper(AmeliproPatientBanner)
+testHelper.setExpectedPropOptions(expectedPropOptions)
+	.setRequiredPropValues(requiredPropValues)
+	.setModifiedPropValues(modifiedPropValues)
+
+describe('AmeliproPatientBanner', () => {
+	describe('Snapshots', () => {
+		testHelper.snapshots()
+	})
+
+	describe('Properties', () => {
+		testHelper.properties()
+	})
+
+	const displayWrapper = mount(DisplayTestComponent)
+
+	describe('Setting props should update inner attribute and tags', () => {
+		let vueWrapper: VueWrapper<InstanceType<typeof AmeliproPatientBanner>>
+
+		beforeEach(() => {
+			vueWrapper = shallowMount(AmeliproPatientBanner, { props: requiredPropValues() })
+		})
+
+		describe('Root tag', () => {
+			it('prop uniqueId sets attribute id', async () => {
+				// root container
+				expect(vueWrapper.attributes('id')).toBeUndefined()
+				await vueWrapper.setProps({ uniqueId: testHelper.modified('uniqueId') })
+				expect(vueWrapper.attributes('id')).toBe(`${testHelper.modified('uniqueId')}-container`)
+			})
+		})
+
+		describe('Content tag', () => {
+			it('prop uniqueId sets attribute id', async () => {
+				// wrapper
+				expect(vueWrapper.find('.amelipro-patient-banner__content').attributes('id')).toBeUndefined()
+				await vueWrapper.setProps({ uniqueId: testHelper.modified('uniqueId') })
+				expect(vueWrapper.find('.amelipro-patient-banner__content').attributes('id')).toBe(`${testHelper.modified('uniqueId')}-wrapper`)
+			})
+		})
+
+		describe('Patien info tag', () => {
+			it('prop name sets patient name', async () => {
+				expect(vueWrapper.find('.amelipro-patient-banner__patient-info__name .text-h3').text()).toBe('')
+				await vueWrapper.setProps({ name: testHelper.modified('name') })
+				expect(vueWrapper.find('.amelipro-patient-banner__patient-info__name .text-h3').text()).toBe(testHelper.modified('name'))
+			})
+
+			it('prop birthName sets birth name span', async () => {
+				expect(vueWrapper.find('.amelipro-patient-banner__patient-info__name').findAll('span').length).toBe(1)
+				await vueWrapper.setProps({ birthName: testHelper.modified('birthName') })
+				expect(vueWrapper.find('.amelipro-patient-banner__patient-info__name').findAll('span').length).toBe(2)
+			})
+
+			it('prop patientDoctorInfos sets doctor infos', async () => {
+				expect(vueWrapper.find('.amelipro-patient-banner__patient-info__doctor').text()).toBe('')
+				await vueWrapper.setProps({ patientDoctorInfos: testHelper.modified('patientDoctorInfos') })
+				expect(vueWrapper.find('.amelipro-patient-banner__patient-info__doctor').text()).toBe(testHelper.modified('patientDoctorInfos'))
+			})
+		})
+	})
+
+	describe('Computed', () => {
+		let vueWrapper: VueWrapper<InstanceType<typeof AmeliproPatientBanner>>
+
+		beforeEach(() => {
+			vueWrapper = shallowMount(AmeliproPatientBanner, { props: requiredPropValues() })
+		})
+
+		afterEach(() => {
+			displayWrapper.vm.resetDefaults()
+		})
+
+		it('Test innerWidth', async () => {
+			expect(vueWrapper.find('.amelipro-patient-banner__content').attributes('style')).toStrictEqual('width: 100%;')
+
+			displayWrapper.vm.setWidth(1172)
+			await vueWrapper.vm.$nextTick()
+			expect(vueWrapper.find('.amelipro-patient-banner__content').attributes('style')).toStrictEqual('width: 980px;')
+		})
+
+		it('Test hasBirthName', async () => {
+			expect(vueWrapper.find('.amelipro-patient-banner__patient-info__name').findAll('span').length).toBe(1)
+
+			const { birthName } = modifiedPropValues()
+			await vueWrapper.setProps({ birthName })
+			expect(vueWrapper.find('.amelipro-patient-banner__patient-info__name').findAll('span').length).toBe(2)
+		})
+
+		it('Test main content classes', async () => {
+			await vueWrapper.setProps({ noMoreInformation: false })
+			expect(vueWrapper.find('.patient-banner-main').classes().includes('justify-space-between')).toBeTruthy()
+			expect(vueWrapper.find('.patient-banner-main').classes().includes('align-center')).toBeTruthy()
+
+			await vueWrapper.setProps({ noMoreInformation: true })
+			expect(vueWrapper.find('.patient-banner-main').classes().includes('justify-space-between')).toBeFalsy()
+			expect(vueWrapper.find('.patient-banner-main').classes().includes('align-center')).toBeTruthy()
+
+			displayWrapper.vm.setMdAndUp(false)
+			displayWrapper.vm.setSmAndDown(true)
+			await vueWrapper.vm.$nextTick()
+			expect(vueWrapper.find('.patient-banner-main').classes().includes('align-center')).toBeFalsy()
+			expect(vueWrapper.find('.patient-banner-main').classes().includes('flex-column')).toBeTruthy()
+			expect(vueWrapper.find('.patient-banner-main').classes().includes('align-start')).toBeTruthy()
+		})
+	})
+
+	describe('Events', () => {
+		let vueWrapper: VueWrapper<InstanceType<typeof AmeliproPatientBanner>>
+
+		beforeEach(() => {
+			vueWrapper = shallowMount(AmeliproPatientBanner, { props: requiredPropValues() })
+		})
+
+		it('Test emitPatientChangeEvent', async () => {
+			expect(vueWrapper.emitted('click:patient-change')).toStrictEqual(undefined)
+
+			await vueWrapper.setProps({ noPatientChange: false })
+			await vueWrapper.find('.amelipro-patient-banner__patient-change__btn').trigger('click')
+			expect(vueWrapper.emitted('click:patient-change')).toStrictEqual([[]])
+		})
+	})
+})

package/src/components/Amelipro/AmeliproPatientBanner/__tests__/__snapshots__/AmeliproPatientBanner.spec.ts.snap

@@ -0,0 +1,285 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`AmeliproPatientBanner > Snapshots > renders the component with all properties filled in 1`] = `
+<div
+  class="
+    amelipro-patient-banner
+    bg-ap-white
+    d-flex
+    justify-center
+    px-8
+    py-4
+    w-100
+  "
+  id="modified-unique-id-container"
+  style="position: relative;"
+>
+  <div
+    class="amelipro-patient-banner__content"
+    id="modified-unique-id-wrapper"
+    style="width: 100%;"
+  >
+    <div class="
+      align-center
+      d-flex
+      justify-space-between
+    ">
+      <div
+        class="
+          align-center
+          amelipro-patient-banner__patient-infos
+          d-inline-flex
+          flex-wrap
+        "
+        id="modified-unique-id-patient-infos"
+      >
+        <p
+          class="
+            amelipro-patient-banner__patient-info__name
+            mb-4
+            mb-md-0
+          "
+          id="modified-unique-id-identity"
+        >
+          <span class="
+            d-block
+            d-sm-inline
+            font-weight-bold
+            text-h3
+          ">
+            Modified name
+          </span>
+          né(e)
+          <span>
+            Modified birth name
+          </span>
+          le Modified birthdate
+        </p>
+        <!-- v-if -->
+      </div>
+      <p
+        class="
+          amelipro-patient-banner__patient-info__doctor
+          font-weight-bold
+          mb-0
+          text-ap-blue-darken-1
+        "
+        id="modified-unique-id-patient-doctor-infos"
+      >
+        Modified doctor infos
+      </p>
+    </div>
+    <hr class="patient-banner__separator" />
+    <div
+      class="
+        align-center
+        d-flex
+        patient-banner-main
+      "
+      id="modified-unique-id-main-content"
+    >
+      <div class="
+        d-flex
+        flex-column
+        flex-sm-row
+      ">
+        <div class="mr-16">
+          <p
+            class="
+              font-weight-regular
+              mb-4
+              text-h5
+            "
+            id="modified-unique-id-patient-status"
+          >
+            Statut :
+            <span class="font-weight-bold">
+              Modified status
+            </span>
+          </p>
+          <p
+            class="
+              font-weight-regular
+              mb-4
+              mb-md-0
+            "
+            id="modified-unique-id-patient-number"
+          >
+            NIR :
+            <span class="font-weight-bold">
+              Modified XXXXXXXXX
+            </span>
+          </p>
+        </div>
+        <div class="mr-3">
+          <p
+            class="
+              font-weight-bold
+              mb-4
+            "
+            id="modified-unique-id-patient-system"
+          >
+            Modified system
+          </p>
+          <p
+            class="
+              font-weight-bold
+              mb-4
+              mb-md-0
+            "
+            id="modified-unique-id-patient-organism"
+          >
+            Modified organism
+          </p>
+        </div>
+      </div>
+      <!-- v-if -->
+    </div>
+  </div>
+</div>
+`;
+
+exports[`AmeliproPatientBanner > Snapshots > renders the component with only required properties filled in 1`] = `
+<div
+  class="
+    amelipro-patient-banner
+    bg-ap-white
+    d-flex
+    justify-center
+    px-8
+    py-4
+    w-100
+  "
+  style="position: relative;"
+>
+  <div
+    class="amelipro-patient-banner__content"
+    style="width: 100%;"
+  >
+    <div class="
+      align-center
+      d-flex
+      justify-space-between
+    ">
+      <div class="
+        align-center
+        amelipro-patient-banner__patient-infos
+        d-inline-flex
+        flex-wrap
+      ">
+        <p class="
+          amelipro-patient-banner__patient-info__name
+          mb-4
+          mb-md-0
+        ">
+          <span class="
+            d-block
+            d-sm-inline
+            font-weight-bold
+            text-h3
+          "></span>
+          né(e)
+          <!-- v-if -->
+          le
+        </p>
+        <amelipro-btn-stub
+          badge="false"
+          badgebgcolor="ap-pink"
+          badgecolor="ap-white"
+          bordered="false"
+          class="
+            amelipro-patient-banner__patient-change__btn
+            mb-4
+            mb-md-0
+            mx-4
+            text-none
+          "
+          color="ap-blue-darken-1"
+          disabled="false"
+          hovercolor="ap-blue-darken-2"
+          hoverunderline="true"
+          iconbgcolor="transparent"
+          iconbordered="false"
+          iconleft="false"
+          infoblock="false"
+          minheight="2.5rem"
+          size="60px"
+          text="true"
+          textcolor="ap-white"
+          type="button"
+          underline="false"
+        ></amelipro-btn-stub>
+      </div>
+      <p class="
+        amelipro-patient-banner__patient-info__doctor
+        font-weight-bold
+        mb-0
+        text-ap-blue-darken-1
+      "></p>
+    </div>
+    <hr class="patient-banner__separator" />
+    <div class="
+      align-center
+      d-flex
+      justify-space-between
+      patient-banner-main
+    ">
+      <div class="
+        d-flex
+        flex-column
+        flex-sm-row
+      ">
+        <div class="mr-16">
+          <p class="
+            font-weight-regular
+            mb-4
+            text-h5
+          ">
+            Statut :
+            <span class="font-weight-bold"></span>
+          </p>
+          <p class="
+            font-weight-regular
+            mb-4
+            mb-md-0
+          ">
+            NIR :
+            <span class="font-weight-bold"></span>
+          </p>
+        </div>
+        <div class="mr-3">
+          <p class="
+            font-weight-bold
+            mb-4
+          "></p>
+          <p class="
+            font-weight-bold
+            mb-4
+            mb-md-0
+          "></p>
+        </div>
+      </div>
+      <amelipro-btn-stub
+        badge="false"
+        badgebgcolor="ap-pink"
+        badgecolor="ap-white"
+        bordered="true"
+        color="ap-white"
+        disabled="false"
+        hovercolor="ap-blue-lighten-3"
+        hoverunderline="false"
+        iconbgcolor="transparent"
+        iconbordered="false"
+        iconleft="false"
+        infoblock="false"
+        minheight="2.5rem"
+        size="60px"
+        text="false"
+        textcolor="ap-blue-darken-1"
+        type="button"
+        underline="false"
+      ></amelipro-btn-stub>
+    </div>
+  </div>
+</div>
+`;

package/src/components/Amelipro/AmeliproPatientLogged/__tests__/__snapshots__/AmeliproPatientLogged.spec.ts.snap

@@ -71,7 +71,10 @@ exports[`AmeliproPatientLogged > render correctly 1`] = `
               data-no-activator=""
             >
               <span
-                class="d-sr-only"
+                class="
+                  amelipro-btn__label
+                  d-sr-only
+                "
                 id="test-id-info-btn-btn-label"
               >
                 Informations
@@ -168,7 +171,10 @@ exports[`AmeliproPatientLogged > render correctly 1`] = `
               data-no-activator=""
             >
               <span
-                class="d-sr-only"
+                class="
+                  amelipro-btn__label
+                  d-sr-only
+                "
                 id="test-id-pdf-btn-btn-label"
               >
                 Télécharger le fichier pdf
@@ -297,7 +303,10 @@ exports[`AmeliproPatientLogged > render correctly 1`] = `
                     data-no-activator=""
                   >
                     <span
-                      class="d-sr-only"
+                      class="
+                        amelipro-btn__label
+                        d-sr-only
+                      "
                       id="test-id-copy-nir-btn-copy-btn-btn-label"
                     >
                       Copier le texte
@@ -469,7 +478,10 @@ exports[`AmeliproPatientLogged > render correctly 1`] = `
                     data-no-activator=""
                   >
                     <span
-                      class="d-sr-only"
+                      class="
+                        amelipro-btn__label
+                        d-sr-only
+                      "
                       id="test-id-fund-tooltip-btn-btn-label"
                     >
                       plus d’informations
@@ -634,7 +646,10 @@ exports[`AmeliproPatientLogged > render correctly 1`] = `
                     data-no-activator=""
                   >
                     <span
-                      class="d-sr-only"
+                      class="
+                        amelipro-btn__label
+                        d-sr-only
+                      "
                       id="test-id-doctor-tooltip-btn-btn-label"
                     >
                       plus d’informations
@@ -771,7 +786,10 @@ exports[`AmeliproPatientLogged > render correctly 1`] = `
                     data-no-activator=""
                   >
                     <span
-                      class="d-sr-only"
+                      class="
+                        amelipro-btn__label
+                        d-sr-only
+                      "
                       id="test-id-c2s-tooltip-btn-btn-label"
                     >
                       plus d’informations
@@ -914,8 +932,9 @@ exports[`AmeliproPatientLogged > render correctly 1`] = `
             w-100
           ">
             <div class="
-              align-start
+              align-baseline
               d-inline-flex
+              mb-1
             ">
               <label
                 class="

package/src/components/Amelipro/AmeliproPostalAddressField/AmeliproPostalAddressCityRow/__tests__/__snapshots__/AmeliproPostalAddressCityRow.spec.ts.snap

@@ -29,9 +29,10 @@ exports[`AmeliproPostalAddressCityRow > render correctly 1`] = `
         id="the-groupId-postal-code-container"
       >
         <div class="
-          align-start
+          align-baseline
           amelipro-autocomplete__label-wrapper
           d-inline-flex
+          mb-1
         ">
           <label
             class="amelipro-autocomplete__label"
@@ -213,7 +214,10 @@ exports[`AmeliproPostalAddressCityRow > render correctly 1`] = `
                     data-no-activator=""
                   >
                     <span
-                      class="d-sr-only"
+                      class="
+                        amelipro-btn__label
+                        d-sr-only
+                      "
                       id="the-groupId-postal-code-btn-btn-label"
                     >
                       Code Postal ouvrir la liste
@@ -301,9 +305,10 @@ exports[`AmeliproPostalAddressCityRow > render correctly 1`] = `
         id="the-groupId-city-container"
       >
         <div class="
-          align-start
+          align-baseline
           amelipro-autocomplete__label-wrapper
           d-inline-flex
+          mb-1
         ">
           <label
             class="amelipro-autocomplete__label"
@@ -485,7 +490,10 @@ exports[`AmeliproPostalAddressCityRow > render correctly 1`] = `
                     data-no-activator=""
                   >
                     <span
-                      class="d-sr-only"
+                      class="
+                        amelipro-btn__label
+                        d-sr-only
+                      "
                       id="the-groupId-city-btn-btn-label"
                     >
                       Commune ouvrir la liste