CommonButtonGroup.spec.ts 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. // Copyright (C) 2012-2024 Zammad Foundation, https://zammad-foundation.org/
  2. import { renderComponent } from '#tests/support/components/index.ts'
  3. import { getByIconName } from '#tests/support/components/iconQueries.ts'
  4. import CommonButtonGroup from '../CommonButtonGroup.vue'
  5. import type { CommonButtonItem } from '../types.ts'
  6. const onActionClick = vi.fn()
  7. const items: CommonButtonItem[] = [
  8. {
  9. label: 'Button 1',
  10. variant: 'primary',
  11. icon: 'logo-flat',
  12. onActionClick,
  13. },
  14. {
  15. label: 'Button 2',
  16. variant: 'secondary',
  17. },
  18. {
  19. label: 'Button 3',
  20. variant: 'tertiary',
  21. },
  22. {
  23. label: 'Button 4',
  24. variant: 'submit',
  25. type: 'submit',
  26. },
  27. {
  28. label: 'Button 5',
  29. variant: 'danger',
  30. size: 'large',
  31. },
  32. ]
  33. describe('CommonButtonGroup.vue', () => {
  34. it('renders buttons with correct classes, types, ...', async () => {
  35. const view = renderComponent(CommonButtonGroup, {
  36. props: {
  37. items,
  38. },
  39. })
  40. const buttons = view.getAllByRole('button')
  41. expect(buttons).toHaveLength(5)
  42. const primaryButton = buttons[0]
  43. expect(primaryButton).toHaveAttribute('type', 'button')
  44. expect(primaryButton).toHaveClasses(['btn-primary', 'bg-blue-800'])
  45. expect(getByIconName(primaryButton, 'logo-flat')).toBeInTheDocument()
  46. await view.events.click(primaryButton)
  47. expect(onActionClick).toHaveBeenCalledOnce()
  48. const submitButton = buttons[3]
  49. expect(submitButton).toHaveAttribute('type', 'submit')
  50. const dangerButton = buttons[4]
  51. expect(dangerButton).toHaveClasses(['btn-error', 'text-red-500'])
  52. })
  53. })