fix(ui) : SelectCheckbox tolère modelValue absent (défaut []) — corrige crash SSR readonly

Le composant accédait à props.modelValue.length sans garde alors que modelValue
était requis ; un usage non bindé (ex. page playground readonly) plantait le rendu SSR.
modelValue devient optionnel avec défaut [].

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-06-03 16:24:19 +02:00
parent cec528eac6
commit 801925c443
2 changed files with 16 additions and 3 deletions
@@ -1,5 +1,5 @@
import {describe, expect, it} from 'vitest' import {describe, expect, it} from 'vitest'
import {mount} from '@vue/test-utils' import {mount, renderToString} from '@vue/test-utils'
import type {DefineComponent} from 'vue' import type {DefineComponent} from 'vue'
import SelectCheckbox from './SelectCheckbox.vue' import SelectCheckbox from './SelectCheckbox.vue'
@@ -9,7 +9,7 @@ type Option = {
} }
type SelectCheckboxProps = { type SelectCheckboxProps = {
modelValue: Array<string | number> modelValue?: Array<string | number>
options?: Option[] options?: Option[]
emptyOptionLabel?: string emptyOptionLabel?: string
label?: string label?: string
@@ -38,6 +38,18 @@ const options: Option[] = [
] ]
describe('MalioSelectCheckbox', () => { describe('MalioSelectCheckbox', () => {
it('rend sans planter quand modelValue nest pas fourni (non contrôlé)', () => {
expect(() =>
mount(SelectCheckboxForTest, {props: {label: 'Catégories', options}}),
).not.toThrow()
})
it('rend en SSR sans planter quand modelValue est absent (cause du crash playground)', async () => {
await expect(
renderToString(SelectCheckboxForTest, {props: {label: 'Catégories', readonly: true, options}}),
).resolves.toBeTruthy()
})
it('renders checkbox inputs for options', async () => { it('renders checkbox inputs for options', async () => {
const wrapper = mount(SelectCheckboxForTest, { const wrapper = mount(SelectCheckboxForTest, {
props: {modelValue: [], options}, props: {modelValue: [], options},
@@ -244,7 +244,7 @@ type Option = {
value: string | number value: string | number
} }
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
modelValue: Array<string | number> modelValue?: Array<string | number>
options?: Option[] options?: Option[]
emptyOptionLabel?: string emptyOptionLabel?: string
label?: string label?: string
@@ -264,6 +264,7 @@ const props = withDefaults(defineProps<{
noOptionsText?: string noOptionsText?: string
required?: boolean required?: boolean
}>(), { }>(), {
modelValue: () => [],
options: () => [], options: () => [],
emptyOptionLabel: '', emptyOptionLabel: '',
label: '', label: '',