test(ui) : couvre icône/label readonly vide sur la famille champs

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

app/components/malio/input/InputAmount.test.ts

@@ -200,6 +200,11 @@ describe('MalioInputAmount', () => {
     expect(wrapper.get('label').classes()).toContain('text-m-muted')
   })
 
+  it('readonly vide : icône en text-m-muted', () => {
+    const wrapper = mountInputAmount({label: 'Champ', readonly: true})
+    expect(wrapper.get('[data-test="icon"]').classes()).toContain('text-m-muted')
+  })
+
   it('readonly rempli : label noir et icône noire', () => {
     const wrapper = mountInputAmount({label: 'Champ', readonly: true, modelValue: '12.50'})
     expect(wrapper.get('label').classes()).toContain('text-black')

app/components/malio/input/InputAutocomplete.test.ts

@@ -532,6 +532,11 @@ describe('MalioInputAutocomplete', () => {
     expect(wrapper.get('label').classes()).toContain('text-m-muted')
   })
 
+  it('readonly vide : chevron en text-m-muted', () => {
+    const wrapper = mountComponent({label: 'Champ', readonly: true})
+    expect(wrapper.get('[data-test="chevron"]').classes()).toContain('text-m-muted')
+  })
+
   it('readonly rempli : label noir et icône noire', () => {
     const wrapper = mountComponent({label: 'Champ', readonly: true, modelValue: 'fr', options, iconName: 'mdi:magnify', iconPosition: 'left'})
     expect(wrapper.get('label').classes()).toContain('text-black')

app/components/malio/input/InputPassword.test.ts

@@ -211,6 +211,11 @@ describe('MalioInputPassword', () => {
     expect(wrapper.get('label').classes()).toContain('text-m-muted')
   })
 
+  it('readonly vide : icône en text-m-muted', () => {
+    const wrapper = mountComponent({label: 'Champ', readonly: true})
+    expect(wrapper.get('[data-test="icon"]').classes()).toContain('text-m-muted')
+  })
+
   it('readonly rempli : label noir et icône noire', () => {
     const wrapper = mountComponent({label: 'Champ', readonly: true, modelValue: 'secret'})
     expect(wrapper.get('label').classes()).toContain('text-black')

app/components/malio/input/InputPhone.test.ts

@@ -296,12 +296,23 @@ describe('MalioInputPhone', () => {
   })
 
   it('readonly : pas d\'apparence désactivée (pas opacity-40)', () => {
-    const wrapper = mountComponent({label: 'Tel', readonly: true})
-    expect(wrapper.get('input').classes()).not.toContain('opacity-40')
+    const wrapper = mountComponent({label: 'Tel', addable: true, readonly: true})
+    // opacity-40 was only ever applied to the add button, not the input
+    expect(wrapper.get('[data-test="add-button"]').classes()).not.toContain('opacity-40')
     // and the input is not natively disabled in readonly:
     expect(wrapper.get('input').attributes('disabled')).toBeUndefined()
   })
 
+  it('readonly vide : label en text-m-muted', () => {
+    const wrapper = mountComponent({label: 'Tel', readonly: true})
+    expect(wrapper.get('label').classes()).toContain('text-m-muted')
+  })
+
+  it('readonly rempli : label en text-black', () => {
+    const wrapper = mountComponent({label: 'Tel', readonly: true, modelValue: '+33612345678'})
+    expect(wrapper.get('label').classes()).toContain('text-black')
+  })
+
   it('renders the default add icon (mdi:plus)', () => {
     const wrapper = mountComponent({addable: true})
 

app/components/malio/input/InputUpload.test.ts

@@ -222,6 +222,11 @@ describe('MalioInputUpload', () => {
     expect(label.classes()).toContain('text-m-muted')
   })
 
+  it('readonly vide : icône en text-m-muted', () => {
+    const wrapper = mountComponent({label: 'Champ', readonly: true})
+    expect(wrapper.get('[data-test="icon"]').classes()).toContain('text-m-muted')
+  })
+
   it('readonly rempli : label noir + icône noire', () => {
     const wrapper = mountComponent({label: 'Champ', readonly: true, modelValue: 'fichier.pdf'})
     expect(wrapper.get('label').classes()).toContain('text-black')