@cnamts/synapse 1.0.25 → 1.0.26

package/src/components/RatingPicker/tests/__snapshots__/RatingPicker.spec.ts.snap

@@ -3,7 +3,6 @@
 exports[`RatingPicker > renders correctly 1`] = `
 <div class="sy-rating-picker">
   <fieldset class="sy-number-picker">
-    <legend class="d-sr-only"></legend>
     <legend class="
       mb-6
       text-h6
@@ -19,7 +18,7 @@ exports[`RatingPicker > renders correctly 1`] = `
         role="radiogroup"
       >
         <div
-          aria-label="Note de 1 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -29,9 +28,12 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="0"
         >
           1
+          <span class="d-sr-only">
+            Note de 1 sur 10.
+          </span>
         </div>
         <div
-          aria-label="Note de 2 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -41,9 +43,12 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="-1"
         >
           2
+          <span class="d-sr-only">
+            Note de 2 sur 10.
+          </span>
         </div>
         <div
-          aria-label="Note de 3 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -53,9 +58,12 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="-1"
         >
           3
+          <span class="d-sr-only">
+            Note de 3 sur 10.
+          </span>
         </div>
         <div
-          aria-label="Note de 4 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -65,9 +73,12 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="-1"
         >
           4
+          <span class="d-sr-only">
+            Note de 4 sur 10.
+          </span>
         </div>
         <div
-          aria-label="Note de 5 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -77,9 +88,12 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="-1"
         >
           5
+          <span class="d-sr-only">
+            Note de 5 sur 10.
+          </span>
         </div>
         <div
-          aria-label="Note de 6 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -89,9 +103,12 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="-1"
         >
           6
+          <span class="d-sr-only">
+            Note de 6 sur 10.
+          </span>
         </div>
         <div
-          aria-label="Note de 7 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -101,9 +118,12 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="-1"
         >
           7
+          <span class="d-sr-only">
+            Note de 7 sur 10.
+          </span>
         </div>
         <div
-          aria-label="Note de 8 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -113,9 +133,12 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="-1"
         >
           8
+          <span class="d-sr-only">
+            Note de 8 sur 10.
+          </span>
         </div>
         <div
-          aria-label="Note de 9 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -125,9 +148,12 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="-1"
         >
           9
+          <span class="d-sr-only">
+            Note de 9 sur 10.
+          </span>
         </div>
         <div
-          aria-label="Note de 10 sur 10."
+          aria-checked="false"
           class="
             pa-0
             sy-number-picker__item
@@ -137,6 +163,9 @@ exports[`RatingPicker > renders correctly 1`] = `
           tabindex="-1"
         >
           10
+          <span class="d-sr-only">
+            Note de 10 sur 10.
+          </span>
         </div>
       </div>
       <!-- v-if -->

package/src/components/RatingPicker/useRatingFocus.ts

@@ -0,0 +1,97 @@
+import { nextTick, ref, watch, type Ref } from 'vue'
+
+type SelectValueFn = (value: number) => void
+
+interface UseRatingFocusOptions {
+	length: Ref<number>
+	modelValue: Ref<number>
+	selectValue: SelectValueFn
+	wrap?: boolean
+}
+
+export function useRatingFocus({
+	length,
+	modelValue,
+	selectValue,
+	wrap = true,
+}: UseRatingFocusOptions) {
+	const ratingElement = ref<HTMLElement[]>([])
+
+	function setFocus(index: number) {
+		ratingElement.value.forEach((el, i) => {
+			if (!el) return
+			el.setAttribute('tabindex', i === index ? '0' : '-1')
+		})
+
+		ratingElement.value[index]?.focus()
+	}
+
+	function getCurrentIndex() {
+		if (modelValue.value >= 1 && modelValue.value <= length.value) {
+			return modelValue.value - 1
+		}
+		return 0
+	}
+
+	function initFocus() {
+		setFocus(getCurrentIndex())
+	}
+
+	function selectAndFocus(index: number) {
+		const value = index + 1
+		selectValue(value)
+		nextTick(() => setFocus(index))
+	}
+
+	function focusNextElement(index: number) {
+		let nextIndex = index + 1
+
+		if (wrap) {
+			if (nextIndex >= length.value) {
+				nextIndex = 0
+			}
+		}
+		else {
+			nextIndex = Math.min(nextIndex, length.value - 1)
+		}
+
+		setFocus(nextIndex)
+	}
+
+	function focusPrevElement(index: number) {
+		let prevIndex = index - 1
+
+		if (wrap) {
+			if (prevIndex < 0) {
+				prevIndex = length.value - 1
+			}
+		}
+		else {
+			prevIndex = Math.max(prevIndex, 0)
+		}
+
+		setFocus(prevIndex)
+	}
+
+	function focus() {
+		nextTick(() => {
+			setFocus(getCurrentIndex())
+		})
+	}
+
+	watch(modelValue, () => {
+		nextTick(() => {
+			setFocus(getCurrentIndex())
+		})
+	})
+
+	return {
+		ratingElement,
+		setFocus,
+		initFocus,
+		selectAndFocus,
+		focusNextElement,
+		focusPrevElement,
+		focus,
+	}
+}

package/src/components/SyTextArea/SyTextArea.vue

@@ -143,7 +143,12 @@
 		:bg-color="props.bgColor"
 		:error="hasError"
 		:error-messages="errors"
-		:messages="hasError ? errors : (hasWarning ? warnings : (hasSuccess && props.showSuccessMessages ? successes : []))"
+		:class="{
+			'success-field': hasSuccess && !hasError && !hasWarning,
+			'warning-field': hasWarning && !hasError,
+			'error-field': hasError,
+		}"
+		:messages="hasError ? errors : (hasWarning ? warnings : (hasSuccess ? successes : []))"
 		:max-errors="props.maxErrors"
 		:disabled="props.disabled"
 		:readonly="props.readonly"
@@ -157,3 +162,29 @@
 		@update:focused="(e: boolean) => { focused = e; if (!e) execBlurChange() }"
 	/>
 </template>
+
+<style lang="scss" scoped>
+.success-field {
+	:deep(.v-field__outline) {
+		--v-field-border-opacity: 1;
+
+		color: rgb(var(--v-theme-success));
+	}
+
+	:deep(.v-messages__message) {
+		color: rgb(var(--v-theme-success));
+	}
+}
+
+.warning-field {
+	:deep(.v-field__outline) {
+		--v-field-border-opacity: 1;
+
+		color: rgb(var(--v-theme-borderWarning));
+	}
+
+	:deep(.v-messages__message) {
+		color: rgb(var(--v-theme-borderWarning));
+	}
+}
+</style>

package/src/components/Tables/SyServerTable/SyServerTable.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 	import { computed, onMounted, provide, ref, toRef, useAttrs, watch } from 'vue'
-	import type { VDataTableServer } from 'vuetify/components'
+	import type { VDataTableServer } from 'vuetify/components/VDataTable'
 	import SyCheckbox from '@/components/Customs/SyCheckbox/SyCheckbox.vue'
 	import SyTableFilter from '../common/SyTableFilter.vue'
 	import TableHeader from '../common/TableHeader.vue'

package/src/components/Tables/SyTable/SyTable.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 	import { computed, onMounted, provide, ref, toRef, useAttrs, watch } from 'vue'
-	import type { VDataTable } from 'vuetify/components'
+	import type { VDataTable } from 'vuetify/components/VDataTable'
 	import SyCheckbox from '@/components/Customs/SyCheckbox/SyCheckbox.vue'
 	import SyTableFilter from '../common/SyTableFilter.vue'
 	import TableHeader from '../common/TableHeader.vue'

package/src/components/Tables/common/SyTableFilter.vue

@@ -2,7 +2,7 @@
 	import { ref, watch, provide, computed } from 'vue'
 	import type { FilterOption, TableColumnHeader } from './types'
 	import { filterItems } from './tableFilterUtils'
-	import type { DateValue } from '@/composables/date/useDateInitializationDayjs'
+	import type { DateModelValue } from '@/composables/date/useDateInitializationDayjs'
 	import getFilterComponent from './filters/getFilterComponent'
 
 	const props = defineProps({
@@ -59,7 +59,7 @@
 	const filtersMap = ref<{
 		text: Record<string, string>
 		number: Record<string, number>
-		date: Record<string, DateValue>
+		date: Record<string, DateModelValue>
 		period: Record<string, { from: string | null, to: string | null }>
 		select: Record<string, string | number | Record<string, unknown> | undefined>
 		autocomplete: Record<string, string | number | Record<string, unknown> | Array<string | number | Record<string, unknown>> | undefined>
@@ -93,7 +93,7 @@
 			filtersMap.value.number[key] = value as number
 			break
 		case 'date':
-			filtersMap.value.date[key] = value as DateValue
+			filtersMap.value.date[key] = value as DateModelValue
 			break
 		case 'period':
 			if (value && typeof value === 'object' && 'from' in value && 'to' in value) {
@@ -184,7 +184,7 @@
 			filtersMap.value.select[key] = value as string | number | Record<string, unknown> | undefined
 		}
 		else if (header.filterType === 'date') {
-			filtersMap.value.date[key] = value as DateValue
+			filtersMap.value.date[key] = value as DateModelValue
 		}
 		else if (header.filterType === 'period') {
 			filtersMap.value.period[key] = value as { from: string | null, to: string | null }

package/src/components/Tables/common/SyTablePagination.vue

@@ -211,6 +211,7 @@
 				:items="formatedItemsPerPageOptions"
 				hide-details
 				hide-messages
+				disable-error-handling
 				density="compact"
 				class="rows-per-page-select"
 				:aria-label="locales.pagination.itemsPerPageText"

package/src/components/Tables/common/TableHeader.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 	import { computed, nextTick, onMounted, ref, inject, watch, type Ref, onUnmounted } from 'vue'
-	import type { VDataTable, VDataTableServer } from 'vuetify/components'
+	import type { VDataTable, VDataTableServer } from 'vuetify/components/VDataTable'
 	import { locales } from './locales'
 	import SyIcon from '@/components/Customs/SyIcon/SyIcon.vue'
 

package/src/components/Tables/common/filters/DateFilter.vue

@@ -2,7 +2,7 @@
 	import { computed } from 'vue'
 	import type { FilterOption, TableColumnHeader } from '../types'
 	import DatePicker from '@/components/DatePicker/CalendarMode/DatePicker.vue'
-	import type { DateValue } from '@/composables/date/useDateInitializationDayjs'
+	import type { DateModelValue } from '@/composables/date/useDateInitializationDayjs'
 	import { useDateFormat } from '@/composables/date/useDateFormatDayjs'
 	const { parseDate } = useDateFormat()
 
@@ -16,7 +16,7 @@
 			default: () => [],
 		},
 		filterValue: {
-			type: [String, Date, Object, null] as unknown as () => DateValue,
+			type: [String, Date, Object, null] as unknown as () => DateModelValue,
 			default: null,
 		},
 		inputConfig: {

package/src/composables/date/tests/useDateFormatDayjs.spec.ts

@@ -2,7 +2,88 @@ import { describe, it, expect } from 'vitest'
 import { formatDate, parseDate } from '../useDateFormatDayjs'
 
 describe('useDateFormatDayjs', () => {
+	describe('formatDate', () => {
+		it('formats a Date object to string according to the specified format', () => {
+			const date = new Date(2023, 0, 15) // 15 janvier 2023
+			expect(formatDate(date, 'DD/MM/YYYY')).toBe('15/01/2023')
+			expect(formatDate(date, 'YYYY-MM-DD')).toBe('2023-01-15')
+		})
+
+		it('returns empty string when date is null or undefined', () => {
+			expect(formatDate(null as unknown as Date, 'DD/MM/YYYY')).toBe('')
+			expect(formatDate(undefined as unknown as Date, 'DD/MM/YYYY')).toBe('')
+		})
+
+		it('handles different date formats correctly', () => {
+			const date = new Date(2023, 11, 31) // 31 décembre 2023
+			expect(formatDate(date, 'DD/MM/YYYY')).toBe('31/12/2023')
+			expect(formatDate(date, 'YYYY-MM-DD')).toBe('2023-12-31')
+		})
+
+		it('handles custom separators correctly', () => {
+			const date = new Date(2023, 0, 15) // 15 janvier 2023
+			expect(formatDate(date, 'DD.MM.YYYY')).toBe('15.01.2023')
+			expect(formatDate(date, 'DD-MM-YYYY')).toBe('15-01-2023')
+			expect(formatDate(date, 'YYYY/MM/DD')).toBe('2023/01/15')
+		})
+	})
+
 	describe('parseDate', () => {
+		it('parses a date string to a Date object according to the specified format', () => {
+			const dateStr = '15/01/2023'
+			const date = parseDate(dateStr, 'DD/MM/YYYY')
+			expect(date).toBeInstanceOf(Date)
+			expect(date?.getFullYear()).toBe(2023)
+			expect(date?.getMonth()).toBe(0) // Janvier = 0
+			expect(date?.getDate()).toBe(15)
+		})
+
+		it('returns null for invalid date strings', () => {
+			expect(parseDate('invalid', 'DD/MM/YYYY')).toBeNull()
+			expect(parseDate('31/02/2023', 'DD/MM/YYYY')).toBeNull() // 31 février n'existe pas
+		})
+
+		it('handles different date formats correctly', () => {
+			expect(parseDate('2023-01-15', 'YYYY-MM-DD')?.getDate()).toBe(15)
+			expect(parseDate('15.01.2023', 'DD.MM.YYYY')?.getDate()).toBe(15)
+		})
+
+		it('returns null when input is null or empty', () => {
+			expect(parseDate(null, 'DD/MM/YYYY')).toBeNull()
+			expect(parseDate('', 'DD/MM/YYYY')).toBeNull()
+		})
+
+		it('handles leap years correctly', () => {
+			// 2020 était une année bissextile
+			expect(parseDate('29/02/2020', 'DD/MM/YYYY')).not.toBeNull()
+			// 2023 n'est pas une année bissextile
+			expect(parseDate('29/02/2023', 'DD/MM/YYYY')).toBeNull()
+		})
+
+		it('returns the Date object as-is when input is already a Date', () => {
+			const original = new Date(2023, 5, 15, 10, 30)
+			const result = parseDate(original, 'DD/MM/YYYY')
+			expect(result).toBe(original) // même référence
+		})
+
+		it('creates dates at midnight (00:00:00.000)', () => {
+			const date = parseDate('15/01/2023', 'DD/MM/YYYY')!
+			expect(date.getHours()).toBe(0)
+			expect(date.getMinutes()).toBe(0)
+			expect(date.getSeconds()).toBe(0)
+			expect(date.getMilliseconds()).toBe(0)
+		})
+
+		it('roundtrip: parseDate then formatDate preserves the same calendar day', () => {
+			const formats = ['DD/MM/YYYY', 'YYYY-MM-DD', 'DD.MM.YYYY']
+			const inputs = ['01/01/2023', '2023-06-30', '31.12.2020']
+			formats.forEach((fmt, i) => {
+				const parsed = parseDate(inputs[i]!, fmt)
+				expect(parsed).not.toBeNull()
+				expect(formatDate(parsed, fmt)).toBe(inputs[i])
+			})
+		})
+
 		it('keeps the same calendar day when formatting back in a negative timezone (UTC-4)', () => {
 			const previousTz = process.env.TZ
 			process.env.TZ = 'America/Guadeloupe'

package/src/composables/date/tests/{useDateInitialization.spec.ts → useDateInitializationDayjs.spec.ts}

@@ -1,7 +1,7 @@
 import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
-import { initializeSelectedDates, type DateInput } from '../useDateInitialization'
+import { initializeSelectedDates, type DateInput } from '../useDateInitializationDayjs'
 
-describe('useDateInitialization', () => {
+describe('useDateInitializationDayjs', () => {
 	describe('initializeSelectedDates', () => {
 		it('returns null when modelValue is null or undefined', () => {
 			expect(initializeSelectedDates(null, 'DD/MM/YYYY')).toBeNull()
@@ -70,7 +70,7 @@ describe('useDateInitialization', () => {
 			expect(result1).toBeInstanceOf(Date)
 			expect((result1 as Date).getDate()).toBe(15)
 
-			// Date au format d'affichage quand le format de retour est différen
+			// Date au format d'affichage quand le format de retour est différent
 			const result2 = initializeSelectedDates('15/01/2023', 'DD/MM/YYYY', 'YYYY-MM-DD')
 			expect(result2).toBeInstanceOf(Date)
 			expect((result2 as Date).getDate()).toBe(15)
@@ -97,6 +97,42 @@ describe('useDateInitialization', () => {
 			})
 		})
 
+		it('creates dates at midnight (00:00:00.000)', () => {
+			const result = initializeSelectedDates('15/06/2023', 'DD/MM/YYYY') as Date
+			expect(result.getHours()).toBe(0)
+			expect(result.getMinutes()).toBe(0)
+			expect(result.getSeconds()).toBe(0)
+			expect(result.getMilliseconds()).toBe(0)
+		})
+
+		it('creates dates at midnight for arrays too', () => {
+			const result = initializeSelectedDates(['01/03/2023', '15/03/2023'], 'DD/MM/YYYY') as Date[]
+			result.forEach((date) => {
+				expect(date.getHours()).toBe(0)
+				expect(date.getMinutes()).toBe(0)
+				expect(date.getSeconds()).toBe(0)
+			})
+		})
+
+		it('handles range array with different return format', () => {
+			const result = initializeSelectedDates(['2023-01-10', '2023-01-20'], 'DD/MM/YYYY', 'YYYY-MM-DD')
+			expect(Array.isArray(result)).toBe(true)
+			const dates = result as Date[]
+			expect(dates).toHaveLength(2)
+			expect(dates[0]?.getDate()).toBe(10)
+			expect(dates[1]?.getDate()).toBe(20)
+		})
+
+		it('accepts a range where both dates are equal', () => {
+			const result = initializeSelectedDates(['15/01/2023', '15/01/2023'], 'DD/MM/YYYY')
+			expect(Array.isArray(result)).toBe(true)
+			expect(result).toHaveLength(2)
+		})
+
+		it('returns null for empty string input', () => {
+			expect(initializeSelectedDates('', 'DD/MM/YYYY')).toBeNull()
+		})
+
 		it('returns null for object input', () => {
 			const result = initializeSelectedDates({}, 'DD/MM/YYYY')
 			expect(result).toBeNull()

package/src/composables/date/useDateInitializationDayjs.ts

@@ -14,7 +14,10 @@ dayjs.extend(timezone)
 dayjs.locale('fr')
 
 // Types
-export type DateValue = string | [string, string] | null
+export type DateModelValue = string | [string, string] | null
+
+/** @deprecated Utilisez DateModelValue à la place */
+export type DateValue = DateModelValue
 export type DateInput = string | string[] | null | object
 
 /**

package/src/composables/unifyValidation/documentationValidationProps.ts

@@ -59,7 +59,7 @@ export function getValidationDocumentation(type: 'date' | 'number' | 'string' |
 			},
 		},
 		showSuccessMessages: {
-			description: 'Affiche les messages de succès lorsque la validation est réussie.',
+			description: 'Affiche les messages de succès lorsque la validation est réussie. Si la prop est à `false` cela cache uniquement les messages texte, l\'état visuel reste actif.',
 			control: 'boolean',
 			table: {
 				type: { summary: 'boolean' },
@@ -107,7 +107,7 @@ export function getValidationDocumentation(type: 'date' | 'number' | 'string' |
 			},
 		},
 		customRules: {
-			description: 'Les règles de validation personnalisées à appliquer au champ.',
+			description: 'Les règles de validation personnalisées d\'erreur (bloquantes) à appliquer au champ. Elles sont évaluées à partir de la valeur du champ.',
 			control: 'object',
 			table: {
 				type: {
@@ -127,7 +127,7 @@ export function getValidationDocumentation(type: 'date' | 'number' | 'string' |
 			},
 		},
 		customWarningRules: {
-			description: 'Les règles de validation personnalisées pour les avertissements à appliquer au champ.',
+			description: 'Les règles de validation personnalisées d\'avertissement (non bloquantes) à appliquer au champ. Elles sont évaluées à partir de la valeur du champ.',
 			control: 'object',
 			table: {
 				type: {
@@ -147,7 +147,7 @@ export function getValidationDocumentation(type: 'date' | 'number' | 'string' |
 			},
 		},
 		customSuccessRules: {
-			description: 'Les règles de validation personnalisées pour les succès à appliquer au champ.',
+			description: 'Les règles de validation personnalisées de succès à appliquer au champ. Elles sont évaluées à partir de la valeur du champ.',
 			control: 'object',
 			table: {
 				type: {
@@ -167,7 +167,7 @@ export function getValidationDocumentation(type: 'date' | 'number' | 'string' |
 			},
 		},
 		errorMessages: {
-			description: 'Permet de forcer des messages d\'erreur spécifiques.',
+			description: 'Permet d\'injecter des messages d\'erreur depuis le parent. Aucun calcul de validation n\'est exécuté.',
 			control: 'object',
 			table: {
 				type: { summary: 'array<string>' },
@@ -175,7 +175,7 @@ export function getValidationDocumentation(type: 'date' | 'number' | 'string' |
 			},
 		},
 		warningMessages: {
-			description: 'Permet de forcer des messages d\'avertissement spécifiques.',
+			description: 'Permet d\'injecter des messages d\'avertissement depuis le parent. Aucun calcul de validation n\'est exécuté.',
 			control: 'object',
 			table: {
 				type: { summary: 'array<string>' },
@@ -183,7 +183,7 @@ export function getValidationDocumentation(type: 'date' | 'number' | 'string' |
 			},
 		},
 		successMessages: {
-			description: 'Permet de forcer des messages de succès spécifiques.',
+			description: 'Permet d\'injecter des messages de succès depuis le parent. Aucun calcul de validation n\'est exécuté.',
 			control: 'object',
 			table: {
 				type: { summary: 'array<string>' },

package/src/composables/unifyValidation/tests/useCustomValidation.spec.ts

@@ -468,7 +468,8 @@ describe('useCustomValidation', () => {
 				args.disableErrorHandling,
 			),
 		)
-		await result.validate()
+		const validationResult = await result.validate()
+		expect(validationResult.hasSuccess).toBe(true)
 		expect(args.successes.value).toEqual([])
 	})
 

package/src/composables/unifyValidation/tests/useValidation.spec.ts

@@ -1490,6 +1490,7 @@ describe('useValidation (unifyValidation)', () => {
 			const { result } = withSetup(() => useValidation(params as Parameters<typeof useValidation>[0]))
 
 			await result.validate()
+			expect(result.hasSuccess.value).toBe(true)
 			expect(result.successes.value).toContain('Succès externe')
 		})
 
@@ -1510,9 +1511,30 @@ describe('useValidation (unifyValidation)', () => {
 			const { result } = withSetup(() => useValidation(params as Parameters<typeof useValidation>[0]))
 
 			await result.validate()
+			expect(result.hasSuccess.value).toBe(true)
 			expect(result.successes.value).not.toContain('Succès interne')
 			expect(result.successes.value).toContain('Succès externe')
 		})
+
+		it('keeps hasSuccess true when inner success messages are hidden', async () => {
+			const params = makeParams({
+				modelValue: ref('ok'),
+				showSuccessMessages: ref(false),
+				customRules: ref([]),
+				customSuccessRules: ref([{
+					type: 'custom',
+					options: {
+						validate: (value: unknown) => value === 'ok',
+						successMessage: 'Succès interne',
+					},
+				}]),
+			})
+			const { result } = withSetup(() => useValidation(params as Parameters<typeof useValidation>[0]))
+
+			await result.validate()
+			expect(result.hasSuccess.value).toBe(true)
+			expect(result.successes.value).toEqual([])
+		})
 	})
 
 	describe('rules concurrences', () => {