@cnamts/synapse 1.0.13 → 1.0.15

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

@@ -0,0 +1,189 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`AmeliproPageLayout > Snapshots > renders the component with all properties filled in 1`] = `
+<div
+  class="
+    amelipro-page-layout
+    bg-ap-grey-lighten-6
+    d-flex
+    flex-column
+    w-100
+  "
+  id="modified-unique-id-container"
+>
+  <div
+    class="
+      body-content
+      d-flex
+      flex-column
+      w-100
+    "
+    id="modified-unique-id-content"
+  >
+    <nav
+      aria-label="liens d'évitement"
+      class="skip-link__nav"
+      id="modified-unique-id-focus-navigation"
+    >
+      <ul
+        class="
+          list-style-none
+          skip-link__list
+        "
+        id="modified-unique-id-focus-navigation-list"
+      >
+        <li
+          class="skip-link__item"
+          id="modified-unique-id-focus-navigation-item-main"
+        >
+          <a
+            class="
+              d-sr-only-focusable
+              pa-2
+              skip-link
+            "
+            href="#main-content"
+            id="modified-unique-id-focus-navigation-main-link"
+          >Contenu principal</a>
+        </li>
+        <li
+          class="skip-link__item"
+          id="modified-unique-id-focus-navigation-item-0"
+        >
+          <a
+            class="
+              d-sr-only-focusable
+              pa-2
+              skip-link
+            "
+            href="#modified"
+            id="modified-unique-id-focus-navigation-link-0"
+          >Modified skip link</a>
+        </li>
+      </ul>
+    </nav>
+    <div id="modified-unique-id-header-wrapper">
+      <amelipro-header-stub
+        ameliproheaderinfos="[object Object]"
+        backbtnlabel="Retour"
+        backoffice="true"
+        headertitle="Modified header title"
+        norightpart="false"
+        nosubpart="false"
+        servicename="Modified service name"
+        submenu="false"
+        submenuitems=""
+        uniqueid="modified-unique-id-header"
+        unlogged="false"
+      ></amelipro-header-stub>
+    </div>
+    <main
+      class="amelipro-main"
+      id="modified-unique-id-main"
+      role="main"
+      style="min-height: 1px;"
+    >
+      <div id="modified-unique-id-patient-banner-wrapper">
+        <amelipro-patient-banner-stub
+          birthdate="01/01/1980"
+          birthname="Patient Birth Name"
+          name="Patient Name"
+          nomoreinformation="true"
+          nopatientchange="true"
+          patientnir="1234567890123"
+          patientorganism="Organism"
+          patientstatus="Status"
+          patientsystem="System"
+          uniqueid="modified-unique-id-patient-banner"
+        ></amelipro-patient-banner-stub>
+      </div>
+      <div
+        class="
+          main-content__content
+          mx-auto
+        "
+        id="modified-unique-id-main-content"
+      ></div>
+    </main>
+    <div class="mt-auto">
+      <div id="modified-unique-id-footer-wrapper">
+        <amelipro-footer-stub
+          a11ycompliance="conforme"
+          backoffice="false"
+          configurationlabel="Configuration"
+          noa11y="false"
+          noabout="false"
+          nocgu="false"
+          noconfiguration="false"
+          nolegalnotice="false"
+          nolinka11y="false"
+          nophone="false"
+          nositemap="false"
+          phonelink="true"
+          uniqueid="modified-unique-id-footer"
+          version="1.2.3"
+        ></amelipro-footer-stub>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`AmeliproPageLayout > Snapshots > renders the component with only required properties filled in 1`] = `
+<div class="
+  amelipro-page-layout
+  bg-ap-grey-lighten-6
+  d-flex
+  flex-column
+  w-100
+">
+  <div class="
+    body-content
+    d-flex
+    flex-column
+    w-100
+  ">
+    <nav
+      aria-label="liens d'évitement"
+      class="skip-link__nav"
+    >
+      <ul class="
+        list-style-none
+        skip-link__list
+      ">
+        <li class="skip-link__item">
+          <a
+            class="
+              d-sr-only-focusable
+              pa-2
+              skip-link
+            "
+            href="#main-content"
+          >Contenu principal</a>
+        </li>
+      </ul>
+    </nav>
+    <!-- v-if -->
+    <main
+      class="amelipro-main"
+      role="main"
+      style="min-height: 1px;"
+    >
+      <!-- v-if -->
+      <div
+        class="
+          main-content__content
+          mx-auto
+        "
+        style="
+          max-width: 100%;
+          padding: 30px 10px;
+        "
+      ></div>
+    </main>
+    <div class="mt-auto">
+      <!-- v-if -->
+    </div>
+  </div>
+</div>
+`;

package/src/components/Amelipro/AmeliproPagination/AmeliproPaginationBtn/__tests__/AmeliproPaginationBtn.spec.ts

@@ -0,0 +1,92 @@
+import { VueWrapper, shallowMount } from '@vue/test-utils'
+import { beforeEach, describe, expect, it } from 'vitest'
+import { AmeliproBtn } from '@/components'
+import AmeliproPaginationBtn from '../AmeliproPaginationBtn.vue'
+import type { ComponentProps } from 'vue-component-type-helpers'
+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 AmeliproPaginationBtn> = {
+	href: {
+		type: String,
+		default: undefined,
+	},
+	isActive: {
+		type: Boolean,
+		default: false,
+	},
+	title: {
+		type: String,
+		default: undefined,
+	},
+	to: {
+		type: [Array, Object, String] as PropType<RouteLocationRaw>,
+		default: undefined,
+	},
+	uniqueId: {
+		type: String,
+		default: undefined,
+	},
+}
+
+// Values pour les props "required"
+const requiredPropValues = (): ComponentProps<typeof AmeliproPaginationBtn> => ({})
+
+// Valeurs pour les props "modified"
+const modifiedPropValues = (): ComponentProps<typeof AmeliproPaginationBtn> => ({
+	href: 'modified-href',
+	isActive: true,
+	title: 'Modified title',
+	to: 'modified-to',
+	uniqueId: 'modified-unique-id',
+})
+
+const testHelper = new TestHelper(AmeliproPaginationBtn)
+testHelper.setExpectedPropOptions(expectedPropOptions)
+	.setRequiredPropValues(requiredPropValues)
+	.setModifiedPropValues(modifiedPropValues)
+
+describe('AmeliproPaginationBtn', () => {
+	describe('Snapshots', () => {
+		testHelper.snapshots()
+	})
+
+	describe('Properties', () => {
+		testHelper.properties()
+	})
+
+	describe('Events', () => {
+		let vueWrapper: VueWrapper<InstanceType<typeof AmeliproPaginationBtn>>
+		beforeEach(() => {
+			vueWrapper = shallowMount(AmeliproPaginationBtn, { props: requiredPropValues() })
+		})
+
+		it('emits click event when the button is clicked', async () => {
+			expect(vueWrapper.emitted('click')).toBeUndefined()
+			await vueWrapper.findComponent(AmeliproBtn).trigger('click')
+			expect(vueWrapper.emitted('click')).toStrictEqual([[]])
+		})
+	})
+
+	describe('Setting props should update inner attribute and tags', () => {
+		let vueWrapper: VueWrapper<InstanceType<typeof AmeliproPaginationBtn>>
+		const btnFinder = () => vueWrapper.findComponent(AmeliproBtn)
+
+		beforeEach(() => {
+			vueWrapper = shallowMount(AmeliproPaginationBtn, { props: requiredPropValues() })
+		})
+
+		it('prop isActive sets props & attributes = false', async () => {
+			expect(btnFinder().attributes('aria-current')).toBeUndefined()
+			expect(btnFinder().props('color')).toBe('ap-white')
+			expect(btnFinder().props('textColor')).toBe('ap-blue-darken-1')
+
+			await vueWrapper.setProps({ isActive: testHelper.modified('isActive') })
+			expect(btnFinder().attributes('aria-current')).toStrictEqual('page')
+			expect(btnFinder().props('color')).toBe('ap-blue-darken-1')
+			expect(btnFinder().props('textColor')).toBe('ap-white')
+		})
+	})
+})

package/src/components/Amelipro/AmeliproPagination/AmeliproPaginationBtn/__tests__/__snapshots__/AmeliproPaginationBtn.spec.ts.snap

@@ -0,0 +1,56 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`AmeliproPaginationBtn > Snapshots > renders the component with all properties filled in 1`] = `
+<amelipro-btn-stub
+  aria-current="page"
+  badge="false"
+  badgebgcolor="ap-pink"
+  badgecolor="ap-white"
+  bordered="false"
+  classes="amelipro-pagination__btn"
+  color="ap-blue-darken-1"
+  disabled="false"
+  hovercolor="ap-blue-darken-1"
+  hoverunderline="false"
+  href="modified-href"
+  iconbgcolor="transparent"
+  iconbordered="false"
+  iconleft="false"
+  infoblock="false"
+  minheight="2.5rem"
+  size="60px"
+  text="false"
+  textcolor="ap-white"
+  texthovercolor="ap-white"
+  title="page active"
+  to="modified-to"
+  type="button"
+  underline="false"
+  uniqueid="modified-unique-id"
+></amelipro-btn-stub>
+`;
+
+exports[`AmeliproPaginationBtn > Snapshots > renders the component with only required properties filled in 1`] = `
+<amelipro-btn-stub
+  badge="false"
+  badgebgcolor="ap-pink"
+  badgecolor="ap-white"
+  bordered="false"
+  classes="amelipro-pagination__btn"
+  color="ap-white"
+  disabled="false"
+  hovercolor="ap-blue-darken-1"
+  hoverunderline="false"
+  iconbgcolor="transparent"
+  iconbordered="false"
+  iconleft="false"
+  infoblock="false"
+  minheight="2.5rem"
+  size="60px"
+  text="false"
+  textcolor="ap-blue-darken-1"
+  texthovercolor="ap-white"
+  type="button"
+  underline="false"
+></amelipro-btn-stub>
+`;

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

@@ -0,0 +1,165 @@
+import { VueWrapper, shallowMount } from '@vue/test-utils'
+import { beforeEach, describe, expect, it } from 'vitest'
+import AmeliproPagination from '../AmeliproPagination.vue'
+import AmeliproPaginationBtn from '../AmeliproPaginationBtn/AmeliproPaginationBtn.vue'
+import type { ComponentProps } from 'vue-component-type-helpers'
+import type { ExpectedPropOptions } from '@tests/types'
+import type { PaginationTypes } from '../types'
+import TestHelper from '@tests/helpers/TestHelper'
+
+const expectedPropOptions: ExpectedPropOptions<typeof AmeliproPagination> = {
+	activePageDefault: {
+		type: Number,
+		default: 1,
+	},
+	items: {
+		type: Array as () => PaginationTypes[],
+		default: () => [],
+	},
+	uniqueId: {
+		type: String,
+		default: undefined,
+	},
+}
+
+const items2 = () => [
+	{ key: 1 },
+	{ key: 2 },
+]
+
+const items3 = () => [
+	{ key: 1 },
+	{ key: 2 },
+	{ key: 3 },
+]
+
+const items4 = () => [
+	{ key: 1 },
+	{ key: 2 },
+	{ key: 3 },
+	{ key: 4 },
+]
+
+const items5 = () => [
+	{ key: 1 },
+	{ key: 2 },
+	{ key: 3 },
+	{ key: 4 },
+	{ key: 5 },
+]
+
+// Values pour les props "required"
+const requiredPropValues = (): ComponentProps<typeof AmeliproPagination> => ({})
+
+// Valeurs pour les props "modified"
+const modifiedPropValues = (): ComponentProps<typeof AmeliproPagination> => ({
+	activePageDefault: 2,
+	items: [
+		{ key: 1 },
+		{ key: 2 },
+		{ key: 3 },
+		{ key: 4 },
+		{ key: 5 },
+		{ key: 6 },
+		{ key: 7 },
+	],
+	uniqueId: 'modified-unique-id',
+})
+
+const testHelper = new TestHelper(AmeliproPagination)
+testHelper.setExpectedPropOptions(expectedPropOptions)
+	.setRequiredPropValues(requiredPropValues)
+	.setModifiedPropValues(modifiedPropValues)
+
+describe('AmeliproPagination', () => {
+	describe('Snapshots', () => {
+		testHelper.snapshots()
+	})
+
+	describe('Properties', () => {
+		testHelper.properties()
+	})
+
+	describe('Setting props should update list of items', () => {
+		let vueWrapper: VueWrapper<InstanceType<typeof AmeliproPagination>>
+		const itemFinder = () => vueWrapper.findAll('.amelipro-pagination__item')
+		beforeEach(() => {
+			vueWrapper = shallowMount(AmeliproPagination, { props: requiredPropValues() })
+		})
+
+		it('initialise le composant avec le bon nombre d’items', async () => {
+			// TODO: corriger le composant pour ne pas avoir 2 boutons vide si liste vide ?
+			expect(itemFinder()).toHaveLength(2)
+
+			await vueWrapper.setProps({ items: items2() })
+			expect(itemFinder()).toHaveLength(2)
+
+			await vueWrapper.setProps({ items: items3() })
+			expect(itemFinder()).toHaveLength(3)
+
+			await vueWrapper.setProps({ items: items4() })
+			expect(itemFinder()).toHaveLength(4)
+
+			await vueWrapper.setProps({ items: items5() })
+			expect(itemFinder()).toHaveLength(5)
+
+			// we expect it to be 5 because the component must display 5 elements maximum
+			await vueWrapper.setProps({ items: testHelper.modified('items') })
+			expect(itemFinder()).toHaveLength(5)
+		})
+	})
+
+	describe('Events', () => {
+		let vueWrapper: VueWrapper<InstanceType<typeof AmeliproPagination>>
+		const buttonsFinder = () => vueWrapper.findAllComponents(AmeliproPaginationBtn)
+
+		beforeEach(() => {
+			vueWrapper = shallowMount(AmeliproPagination, { props: { ...requiredPropValues(), items: testHelper.modified('items') } })
+		})
+
+		it('emits click event when emitClickEvent is called', async () => {
+			expect(vueWrapper.emitted('click')).toBeUndefined()
+			await vueWrapper.findComponent(AmeliproPaginationBtn).trigger('click')
+			expect(vueWrapper.emitted('click')).toEqual([[1]])
+		})
+
+		it('updates navigation bar items when clicking on buttons', async () => {
+			expect(buttonsFinder().length).toBe(5)
+			// [_1_] [2] [3] [>] [7]
+			expect(buttonsFinder().at(0)?.props('isActive')).toBe(true)
+			expect(buttonsFinder().at(1)?.attributes('title')).toBe(undefined)
+			expect(buttonsFinder().at(3)?.attributes('title')).toBe('page suivante')
+
+			await buttonsFinder().at(0)?.trigger('click')
+			// => click bouton [1], bouton actif reste positionné sur le [1]
+			// [_1_] [2] [3] [>] [7]
+			expect(buttonsFinder().at(0)?.props('isActive')).toBe(true)
+			expect(buttonsFinder().at(1)?.attributes('title')).toBe(undefined)
+			expect(buttonsFinder().at(3)?.attributes('title')).toBe('page suivante')
+
+			await buttonsFinder().at(3)?.trigger('click')
+			// => click bouton [>], bouton actif se décale
+			// [1] [_2_] [3] [>] [7]
+			expect(buttonsFinder().at(0)?.attributes('title')).toBe(undefined)
+			expect(buttonsFinder().at(1)?.props('isActive')).toBe(true)
+			expect(buttonsFinder().at(3)?.attributes('title')).toBe('page suivante')
+
+			await buttonsFinder().at(2)?.trigger('click')
+			// => click bouton [3], bouton actif se positionne sur le [3]
+			// [1] [2] [_3_] [>] [7]
+			expect(buttonsFinder().at(0)?.attributes('title')).toBe(undefined)
+			expect(buttonsFinder().at(1)?.attributes('title')).toBe(undefined)
+			expect(buttonsFinder().at(2)?.props('isActive')).toBe(true)
+			expect(buttonsFinder().at(3)?.attributes('title')).toBe('page suivante')
+
+			await buttonsFinder().at(3)?.trigger('click')
+			// => click bouton [>], bouton actif se positionne sur le [4]
+			// [1] [<] [_4_] [>] [7]
+			expect(buttonsFinder().at(0)?.attributes('title')).toBe(undefined)
+			expect(buttonsFinder().at(1)?.attributes('title')).toBe('page précédente')
+			expect(buttonsFinder().at(2)?.props('isActive')).toBe(true)
+			expect(buttonsFinder().at(3)?.attributes('title')).toBe('page suivante')
+			expect(buttonsFinder().at(4)?.attributes('title')).toBe(undefined)
+		})
+	})
+})

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

@@ -0,0 +1,83 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`AmeliproPagination > Snapshots > renders the component with all properties filled in 1`] = `
+<nav
+  aria-label="pagination"
+  class="
+    align-center
+    amelipro-pagination
+    d-flex
+    justify-center
+  "
+  id="modified-unique-id-container"
+>
+  <ol
+    class="
+      amelipro-pagination__list
+      d-flex
+      list-style-none
+    "
+    id="modified-unique-id-list"
+  >
+    <li class="amelipro-pagination__item">
+      <amelipro-pagination-btn-stub
+        isactive="false"
+        uniqueid="modified-unique-id-first"
+      ></amelipro-pagination-btn-stub>
+    </li>
+    <!-- v-if -->
+    <li class="amelipro-pagination__item">
+      <amelipro-pagination-btn-stub
+        isactive="true"
+        uniqueid="modified-unique-id-middle-0"
+      ></amelipro-pagination-btn-stub>
+    </li>
+    <li class="amelipro-pagination__item">
+      <amelipro-pagination-btn-stub
+        isactive="false"
+        uniqueid="modified-unique-id-middle-1"
+      ></amelipro-pagination-btn-stub>
+    </li>
+    <li class="amelipro-pagination__item">
+      <amelipro-pagination-btn-stub
+        isactive="false"
+        title="page suivante"
+        uniqueid="modified-unique-id-next"
+      ></amelipro-pagination-btn-stub>
+    </li>
+    <li class="amelipro-pagination__item">
+      <amelipro-pagination-btn-stub
+        isactive="false"
+        uniqueid="modified-unique-id-last"
+      ></amelipro-pagination-btn-stub>
+    </li>
+  </ol>
+</nav>
+`;
+
+exports[`AmeliproPagination > Snapshots > renders the component with only required properties filled in 1`] = `
+<nav
+  aria-label="pagination"
+  class="
+    align-center
+    amelipro-pagination
+    d-flex
+    justify-center
+  "
+>
+  <ol class="
+    amelipro-pagination__list
+    d-flex
+    list-style-none
+  ">
+    <li class="amelipro-pagination__item">
+      <amelipro-pagination-btn-stub isactive="true"></amelipro-pagination-btn-stub>
+    </li>
+    <!-- v-if -->
+    <!-- v-if -->
+    <li class="amelipro-pagination__item">
+      <amelipro-pagination-btn-stub isactive="false"></amelipro-pagination-btn-stub>
+    </li>
+  </ol>
+</nav>
+`;