// Le declencheur du menu multi-selection est ce qui reste visible une fois le
// menu referme : il doit dire l'etat du filtre sans qu'on ait a le rouvrir.
import { describe, expect, it } from 'vitest'
import { createSSRApp } from 'vue'
import { renderToString } from 'vue/server-renderer'

import SelectionMultiple from '../src/components/SelectionMultiple.vue'

const FOURNISSEURS = [
  { valeur: 'ACME', libelle: 'ACME', complement: '12' },
  { valeur: 'BOREAL', libelle: 'BOREAL', complement: '3' },
  { valeur: 'CERES', libelle: 'CERES', complement: '1' },
]

function rendu(proprietes = {}) {
  return renderToString(
    createSSRApp(SelectionMultiple, {
      options: FOURNISSEURS,
      libelleVide: 'Tous',
      nomPluriel: 'fournisseurs',
      ...proprietes,
    })
  )
}

describe('SelectionMultiple', () => {
  it('annonce l absence de filtre quand rien n est coche', async () => {
    expect(await rendu({ modelValue: [] })).toContain('Tous')
  })

  it('nomme le fournisseur quand il n y en a qu un', async () => {
    // Le compte seul (« 1 fournisseur ») cacherait lequel, alors que c'est
    // justement le cas ou la reponse tient dans le bouton.
    const html = await rendu({ modelValue: ['BOREAL'] })

    expect(html).toContain('BOREAL')
    expect(html).not.toContain('1 fournisseurs')
  })

  it('compte les fournisseurs des qu il y en a plusieurs', async () => {
    expect(await rendu({ modelValue: ['ACME', 'CERES'] })).toContain('2 fournisseurs')
  })

  it('garde le menu ferme au premier rendu', async () => {
    // Une liste de dizaines de fournisseurs deployee d'entree recouvrirait la
    // page a chaque chargement.
    expect(await rendu({ modelValue: [] })).not.toContain('Rechercher')
  })
})